/* Reizen live compatibility fix v50
   Targeted layout enforcement that stays effective even when Laravel still serves
   an older cached Blade template. */

@media (min-width:801px) {
    .sidebar:has(.reizen-route-overview-card),
    .sidebar:has(.route-overview-card),
    .sidebar:has(.reizen-v50-route-card) {
        width:355px !important;
        max-width:none !important;
        right:auto !important;
    }
}

@media (max-width:800px) {
    .sidebar:has(.reizen-route-overview-card),
    .sidebar:has(.route-overview-card),
    .sidebar:has(.reizen-v50-route-card) {
        left:12px !important;
        right:12px !important;
        width:auto !important;
        max-width:none !important;
    }
}

.route-overview-card .route-item-heading,
.reizen-route-overview-card .route-item-heading,
.reizen-v50-route-card .route-item-heading {
    min-height:36px !important;
}

.reizen-route-overview-card > .reizen-route-endpoints,
.route-overview-card > .route-endpoints,
.reizen-v50-route-card > .reizen-route-endpoints,
.reizen-v50-route-card > .route-endpoints {
    display:block !important;
    clear:both !important;
    width:100% !important;
    max-width:none !important;
    margin:0 0 12px !important;
    padding:0 !important;
}

.reizen-route-overview-card > .reizen-route-distance,
.route-overview-card > .route-distance,
.reizen-v50-route-card > .reizen-route-distance,
.reizen-v50-route-card > .route-distance {
    display:flex !important;
    clear:both !important;
    width:100% !important;
    max-width:none !important;
    margin:0 0 14px !important;
}

.reizen-media-cover-control,
.reizen-media-cover-control.active,
.media-thumb-cover,
.media-thumb-cover.active {
    left:auto !important;
    right:7px !important;
    top:7px !important;
    bottom:auto !important;
    transform:none !important;
}

.reizen-media-delete-control,
.media-thumb-delete {
    left:auto !important;
    top:auto !important;
    right:7px !important;
    bottom:7px !important;
}

.reizen-v50-media-scroll-hint,
.media-scroll-hint {
    display:block !important;
    margin:6px 0 0 !important;
}

.detail .media-gallery ~ .row-actions {
    display:none !important;
}

@media (max-width:800px) {
    .reizen-media-cover-control,
    .reizen-media-cover-control.active,
    .media-thumb-cover,
    .media-thumb-cover.active {
        right:6px !important;
        top:6px !important;
    }

    .reizen-media-delete-control,
    .media-thumb-delete {
        right:6px !important;
        bottom:6px !important;
    }
}


/* ROUTE_TRIP_PICKING_V52 */
.reizen-route-distance-row,
.route-distance-row {
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:12px !important;
    width:100% !important;
    margin:0 0 14px !important;
}
.reizen-route-distance-row > .reizen-route-distance,
.reizen-route-distance-row > .route-distance,
.route-distance-row > .route-distance {
    flex:1 1 auto !important;
    min-width:0 !important;
    margin:0 !important;
}
.reizen-route-distance-row > .reizen-v52-retry-inline,
.reizen-route-distance-row > .reizen-route-retry-action,
.route-distance-row > .route-retry-button {
    position:static !important;
    flex:0 0 auto !important;
    margin:0 !important;
    top:auto !important;
    right:auto !important;
}
.reizen-v52-retry-source {
    display:none !important;
}
.reizen-route-overview-card > .route-candidates-panel,
.route-overview-card > .route-candidates-panel,
.reizen-v50-route-card > .route-candidates-panel {
    position:static !important;
    clear:both !important;
    width:100% !important;
    margin:0 0 10px !important;
}
.history-card:has(> .history-cover) {
    display:block !important;
    padding:12px !important;
}
.history-card:has(> .history-cover) > .history-cover {
    display:block !important;
    width:100% !important;
    height:118px !important;
    margin:0 0 12px !important;
    border-radius:9px !important;
    object-fit:cover !important;
}
.history-card:has(> .history-cover) > span {
    display:block !important;
    width:100% !important;
}
@media(max-width:800px) {
    .history-card:has(> .history-cover) > .history-cover {
        height:108px !important;
    }
}


/* ROUTE_HISTORY_EDITOR_V53 */
/* Route candidates/status belong between endpoints and the distance row. */
.route-candidates-slot,
.route-overview-card > .route-candidates-panel,
.reizen-route-overview-card > .route-candidates-panel,
.reizen-route-overview-card > .reizen-route-candidate-inline {
    display:block !important;
    clear:both !important;
    width:100% !important;
    margin:0 0 10px !important;
}
.route-candidates-slot > .route-candidates-panel {
    margin:0 !important;
}
.route-candidate-status,
.reizen-route-candidate-inline {
    margin:0 0 8px !important;
}

/* Preserve the cover's natural aspect ratio. Horizontal covers remain above the trip details. */
.history-card:has(> .history-cover):not(.history-cover-portrait) {
    display:block !important;
    padding:12px !important;
}
.history-card:has(> .history-cover):not(.history-cover-portrait) > .history-cover {
    display:block !important;
    width:100% !important;
    height:auto !important;
    max-height:none !important;
    margin:0 0 12px !important;
    border-radius:9px !important;
    object-fit:contain !important;
}

/* Portrait covers sit left; the existing trip content remains right. */
.history-card.history-cover-portrait {
    display:grid !important;
    grid-template-columns:minmax(72px,105px) minmax(0,1fr) !important;
    align-items:center !important;
    gap:12px !important;
    padding:12px !important;
}
.history-card.history-cover-portrait > .history-cover {
    display:block !important;
    width:auto !important;
    height:auto !important;
    max-width:105px !important;
    max-height:150px !important;
    margin:0 !important;
    border-radius:9px !important;
    object-fit:contain !important;
    justify-self:start !important;
}
.history-card.history-cover-portrait > span {
    min-width:0 !important;
}

/* Title/date left, all trip action icons together on the right. */
.history-card > span {
    display:grid !important;
    grid-template-columns:minmax(0,1fr) auto !important;
    grid-template-rows:auto auto !important;
    column-gap:10px !important;
    align-items:center !important;
    width:100% !important;
}
.history-card > span > strong {
    grid-column:1 !important;
    grid-row:1 !important;
    min-width:0 !important;
}
.history-card > span > small {
    grid-column:1 !important;
    grid-row:2 !important;
    min-width:0 !important;
}
.history-card > span > .history-card-actions {
    grid-column:2 !important;
    grid-row:1 / span 2 !important;
    align-self:center !important;
    justify-self:end !important;
    justify-content:flex-end !important;
    flex-wrap:nowrap !important;
    margin:0 !important;
}
.history-card > span > .history-card-actions .icon-button {
    flex:0 0 auto !important;
}

@media(max-width:800px) {
    .history-card.history-cover-portrait {
        grid-template-columns:minmax(64px,92px) minmax(0,1fr) !important;
        gap:10px !important;
    }
    .history-card.history-cover-portrait > .history-cover {
        max-width:92px !important;
        max-height:135px !important;
    }
}


/* LEGACY_HISTORY_ACTIONS_RIGHT_V53 */
/* Older compiled frontend renders history actions as a clickable ::after strip. */
.history-card.reizen-history-actions-row > span {
    position:relative !important;
}
.history-card.reizen-history-actions-row > span::after {
    position:absolute !important;
    right:0 !important;
    top:50% !important;
    transform:translateY(-50%) !important;
    margin:0 !important;
}
.history-card.reizen-history-admin.reizen-history-has-points > span {
    padding-right:134px !important;
}
.history-card.reizen-history-admin:not(.reizen-history-has-points) > span {
    padding-right:82px !important;
}
.history-card:not(.reizen-history-admin).reizen-history-has-points > span {
    padding-right:56px !important;
}
.history-card:not(.reizen-history-admin):not(.reizen-history-has-points) > span {
    padding-right:30px !important;
}

/* NATIVE_UI_V54: horizontal cover cards keep title/date left and actions beside them. */
.history-card:has(> .history-cover):not(.history-cover-portrait) > span {
    display:grid !important;
    grid-template-columns:minmax(0,1fr) auto !important;
    grid-template-rows:auto auto !important;
    column-gap:10px !important;
    align-items:center !important;
    width:100% !important;
}

/* MAP_MEDIA_HISTORY_V55 */
/* Horizontal media swipes are handled by pointer logic; vertical page scrolling remains native. */
.media-gallery,
.media-gallery .media-thumb {
    touch-action:pan-y !important;
}
.media-gallery-admin .media-thumb {
    touch-action:none !important;
}

/* Horizontal cover: keep title/date left and pin all trip actions to the far right edge. */
.history-card:has(> .history-cover):not(.history-cover-portrait) > span {
    position:relative !important;
    display:block !important;
    width:100% !important;
    min-height:52px !important;
    padding-right:154px !important;
}
.history-card:has(> .history-cover):not(.history-cover-portrait) > span > strong,
.history-card:has(> .history-cover):not(.history-cover-portrait) > span > small {
    display:block !important;
    max-width:100% !important;
}
.history-card:has(> .history-cover):not(.history-cover-portrait) > span > .history-card-actions {
    position:absolute !important;
    right:0 !important;
    top:50% !important;
    transform:translateY(-50%) !important;
    display:flex !important;
    flex-wrap:nowrap !important;
    justify-content:flex-end !important;
    margin:0 !important;
}

/* HISTORY_ACTION_BLOCK_V57 */
/* Horizontal cover: title/date form one block; actions sit at the far right,
   vertically centered across title + date (not on the date row). */
.history-card:has(> .history-cover):not(.history-cover-portrait) > span {
    position:static !important;
    display:grid !important;
    grid-template-columns:minmax(0,1fr) auto !important;
    grid-template-rows:auto auto !important;
    column-gap:12px !important;
    align-items:center !important;
    width:100% !important;
    min-height:0 !important;
    padding-right:0 !important;
}
.history-card:has(> .history-cover):not(.history-cover-portrait) > span > strong {
    grid-column:1 !important;
    grid-row:1 !important;
    min-width:0 !important;
}
.history-card:has(> .history-cover):not(.history-cover-portrait) > span > small {
    grid-column:1 !important;
    grid-row:2 !important;
    min-width:0 !important;
}
.history-card:has(> .history-cover):not(.history-cover-portrait) > span > .history-card-actions {
    position:static !important;
    grid-column:2 !important;
    grid-row:1 / 3 !important;
    align-self:center !important;
    justify-self:end !important;
    transform:none !important;
    display:flex !important;
    flex-wrap:nowrap !important;
    justify-content:flex-end !important;
    margin:0 !important;
}

/* FOLLOWERS_PANEL_V58 */
.sidebar-followers{
    top:44px!important;
    bottom:44px!important;
    left:50%!important;
    right:auto!important;
    width:min(1080px,calc(100vw - 48px))!important;
    max-height:none!important;
    transform:translateX(-50%)!important;
    border-radius:18px!important;
    background:#fffefaf7!important;
    backdrop-filter:blur(8px);
}
.sidebar-followers .sidebar-heading{
    padding:24px 30px 12px!important;
    font-size:38px!important;
    line-height:1.05!important;
}
.sidebar-followers .sidebar-heading .icon-button{
    width:42px!important;
    height:42px!important;
}
.sidebar-followers .tabs{
    padding:0 28px!important;
}
.sidebar-followers .tabs button{
    padding:15px 8px!important;
    gap:10px!important;
    font-size:14px!important;
}
.sidebar-followers .tabs button svg{
    width:24px!important;
    height:24px!important;
}
.sidebar-followers .panel-body{
    padding:24px 28px 30px!important;
}
.followers-page{
    display:flex;
    flex-direction:column;
    gap:18px;
}
.followers-intro{
    display:flex;
    align-items:center;
    gap:22px;
    padding:18px 28px;
    background:#f4f5ef;
    border-radius:14px;
    color:#53655c;
}
.followers-intro>svg{
    flex:0 0 auto;
    color:#173f31;
}
.followers-intro p{
    margin:0;
    font-size:15px;
    line-height:1.45;
}
.follower-add-card{
    border:1px solid #d9ddd4;
    border-radius:14px;
    padding:18px 28px 20px;
    background:#fff;
}
.follower-add-card h3,
.followers-list-heading h3{
    margin:0;
    font-size:18px;
    font-family:inherit;
    font-weight:700;
}
.follower-add-fields{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:24px;
}
.follower-add-card .field{
    margin:14px 0 4px;
}
.follower-add-card .field>span{
    font-size:13px;
    font-weight:700;
}
.follower-add-card input{
    min-height:46px;
}
.follower-add-card .button{
    min-height:50px;
    font-size:14px;
}
.followers-message{
    margin:0;
    padding:11px 14px;
    border-radius:8px;
    background:#edf4eb;
    color:#315c42;
    font-size:12px;
}
.followers-list-heading{
    border-top:1px solid #dfe3da;
    padding:20px 6px 0;
}
.followers-table{
    border-radius:14px;
    overflow:hidden;
}
.follower-table-head,
.follower-table-row{
    display:grid;
    grid-template-columns:minmax(220px,1.35fr) minmax(150px,.8fr) minmax(170px,.8fr) 76px;
    align-items:center;
    column-gap:18px;
}
.follower-table-head{
    padding:12px 18px;
    background:#f3f4ef;
    border-radius:12px;
    font-size:12px;
    color:#34473e;
}
.follower-table-head span:last-child{
    text-align:center;
}
.follower-record{
    margin-top:8px;
    border:1px solid #dde1d8;
    border-radius:14px;
    background:#fff;
    overflow:hidden;
}
.follower-table-row{
    min-height:76px;
    padding:12px 18px;
}
.follower-name-cell{
    display:flex;
    align-items:center;
    gap:16px;
    min-width:0;
}
.follower-avatar{
    display:grid;
    place-items:center;
    flex:0 0 52px;
    width:52px;
    height:52px;
    border-radius:50%;
    background:#e8efe4;
    color:#173f31;
    font-family:Georgia,serif;
    font-size:22px;
}
.follower-name-cell strong{
    display:block;
    font-size:15px;
    color:#18382c;
}
.follower-name-cell small{
    display:block;
    margin-top:4px;
    color:#87918a;
    font-size:11px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}
.follower-status-cell{
    display:flex;
    align-items:center;
    gap:10px;
    color:#61736a;
    font-size:13px;
}
.follower-status-cell i{
    width:11px;
    height:11px;
    border-radius:50%;
    background:#aaa;
    flex:0 0 auto;
}
.follower-status-cell.active i{background:#4db643}
.follower-status-cell.inactive i{background:#aa6e62}
.follower-last-seen{
    font-size:12px;
    color:#637068;
    line-height:1.35;
}
.follower-actions-cell{
    display:flex;
    justify-content:center;
}
.follower-more{
    display:grid;
    place-items:center;
    width:42px;
    height:42px;
    padding:0;
    border:1px solid #d8ddd5;
    border-radius:9px;
    background:#fff;
    color:#244438;
}
.follower-more:hover,
.follower-more[aria-expanded="true"]{
    background:#f0f4ed;
}
.follower-action-drawer{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    margin:0 14px 14px;
    border:1px solid #dbe0d7;
    border-radius:13px;
    background:#fff;
    overflow:hidden;
}
.follower-action-drawer button{
    display:flex;
    align-items:center;
    justify-content:flex-start;
    gap:14px;
    min-height:68px;
    padding:14px 22px;
    border:0;
    border-right:1px solid #e2e5de;
    border-bottom:1px solid #e2e5de;
    background:#fff;
    color:#17382c;
    font-size:13px;
    text-align:left;
}
.follower-action-drawer button:nth-child(3n){border-right:0}
.follower-action-drawer button:nth-child(n+4){border-bottom:0}
.follower-action-drawer button:hover{background:#f5f7f2}
.follower-action-drawer button:disabled{opacity:.45;cursor:not-allowed}
.follower-action-drawer button svg{flex:0 0 auto}
.follower-visits{
    margin:0 14px 14px;
    padding:14px 18px;
    border-radius:10px;
    background:#f6f7f3;
    font-size:11px;
    color:#56675e;
}
.follower-visits>strong{
    display:block;
    margin-bottom:8px;
    color:#294b3c;
}
.follower-visits p{
    margin:7px 0 0;
    line-height:1.45;
}
.followers-empty{
    margin:10px 0 0!important;
    padding:24px;
    border:1px dashed #d8ddd4;
    border-radius:12px;
    color:#7d887f!important;
    text-align:center;
}
@media(max-width:800px){
    .sidebar-followers{
        top:auto!important;
        bottom:80px!important;
        left:12px!important;
        right:12px!important;
        width:auto!important;
        max-height:78dvh!important;
        transform:none!important;
        border-radius:13px!important;
    }
    .sidebar-followers .sidebar-heading{
        padding:10px 16px 6px!important;
        font-size:24px!important;
    }
    .sidebar-followers .tabs{
        padding:0 8px!important;
    }
    .sidebar-followers .tabs button{
        padding:10px 4px!important;
        gap:5px!important;
        font-size:10px!important;
    }
    .sidebar-followers .tabs button svg{
        width:16px!important;
        height:16px!important;
    }
    .sidebar-followers .panel-body{
        padding:14px!important;
    }
    .followers-intro{
        padding:14px 16px;
        gap:12px;
    }
    .followers-intro p{
        font-size:12px;
    }
    .follower-add-card{
        padding:16px;
    }
    .follower-add-fields{
        grid-template-columns:1fr;
        gap:0;
    }
    .follower-table-head{
        display:none;
    }
    .follower-table-row{
        grid-template-columns:minmax(0,1fr) auto;
        gap:10px 12px;
        padding:14px;
    }
    .follower-name-cell{
        grid-column:1;
        grid-row:1;
    }
    .follower-status-cell{
        grid-column:1;
        grid-row:2;
    }
    .follower-last-seen{
        grid-column:1;
        grid-row:3;
    }
    .follower-last-seen::before{
        content:"Laatste bezoek: ";
        font-weight:650;
    }
    .follower-actions-cell{
        grid-column:2;
        grid-row:1 / 4;
        align-self:center;
    }
    .follower-action-drawer{
        grid-template-columns:1fr 1fr;
    }
    .follower-action-drawer button{
        border-right:1px solid #e2e5de!important;
        border-bottom:1px solid #e2e5de!important;
        min-height:58px;
        padding:12px;
        font-size:11px;
    }
    .follower-action-drawer button:nth-child(2n){border-right:0!important}
    .follower-action-drawer button:nth-child(n+5){border-bottom:0!important}
}

/* FOLLOWERS_COMPACT_V59 */
.followers-page{gap:14px}
.followers-intro{gap:10px;padding:12px 14px;border-radius:10px}
.followers-intro>svg{width:20px;height:20px}
.followers-intro p{font-size:11px;line-height:1.45}
.follower-add-card{padding:14px;border-radius:10px}
.follower-add-card h3,.followers-list-heading h3{font-size:15px}
.follower-add-fields{grid-template-columns:1fr;gap:0}
.follower-add-card .field{margin:10px 0 2px}
.follower-add-card .field>span{font-size:11px}
.follower-add-card input{min-height:40px}
.follower-add-card .button{min-height:42px;font-size:11px}
.followers-list-heading{padding:14px 2px 0}
.followers-table{overflow:visible}
.follower-table-head,.follower-table-row{
    grid-template-columns:minmax(0,1.25fr) 70px 76px 32px;
    column-gap:5px;
}
.follower-table-head{
    padding:8px 6px;
    border-radius:8px;
    font-size:8px;
}
.follower-record{margin-top:6px;border-radius:10px}
.follower-table-row{min-height:58px;padding:9px 7px}
.follower-name-cell{gap:8px}
.follower-avatar-wrap{position:relative;display:inline-flex;flex:0 0 34px}
.follower-avatar{width:34px;height:34px;flex-basis:34px;font-size:16px}
.follower-online-dot{
    position:absolute;
    right:-1px;
    bottom:-1px;
    width:10px;
    height:10px;
    border-radius:50%;
    background:#35b84a;
    border:2px solid #fff;
}
.follower-name-cell strong{font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.follower-name-cell small{font-size:8px;margin-top:2px}
.follower-status-cell{gap:5px;font-size:8px;line-height:1.2}
.follower-status-cell i{width:8px;height:8px;background:#9ca8a0}
.follower-status-cell.active i{background:#9ca8a0}
.follower-status-cell.online i{background:#35b84a}
.follower-status-cell.inactive i{background:#aa6e62}
.follower-last-seen{font-size:8px;line-height:1.25}
.follower-more{width:30px;height:30px;border-radius:7px}
.follower-more svg{width:16px;height:16px}
.follower-action-drawer{
    grid-template-columns:1fr 1fr;
    margin:0 7px 7px;
    border-radius:9px;
}
.follower-action-drawer button{
    min-height:50px;
    padding:9px 10px;
    gap:8px;
    font-size:9px;
    border-right:1px solid #e2e5de!important;
    border-bottom:1px solid #e2e5de!important;
}
.follower-action-drawer button:nth-child(2n){border-right:0!important}
.follower-action-drawer button:nth-child(n+5){border-bottom:0!important}
.follower-action-drawer button svg{width:16px;height:16px}
.follower-visits{margin:0 7px 7px;padding:10px 11px;font-size:9px}
@media(max-width:800px){
    .followers-page{gap:12px}
    .followers-intro{padding:11px 12px}
    .follower-add-card{padding:12px}
    .follower-table-head{display:none}
    .follower-table-row{grid-template-columns:minmax(0,1fr) auto;gap:6px 8px;padding:11px}
    .follower-name-cell{grid-column:1;grid-row:1}
    .follower-status-cell{grid-column:1;grid-row:2}
    .follower-last-seen{grid-column:1;grid-row:3}
    .follower-last-seen::before{content:"Laatste bezoek: ";font-weight:650}
    .follower-actions-cell{grid-column:2;grid-row:1 / 4;align-self:center}
}

/* FOLLOWERS_NO_STATUS_V60 */
.follower-table-head,
.follower-table-row{
    grid-template-columns:minmax(0,1.45fr) minmax(92px,1fr) 32px;
}
.follower-last-seen{
    display:flex;
    align-items:center;
    gap:6px;
}
.follower-last-seen.online{
    color:#2f7d3b;
    font-weight:650;
}
.follower-last-seen.online i{
    width:8px;
    height:8px;
    flex:0 0 auto;
    border-radius:50%;
    background:#35b84a;
}
@media(max-width:800px){
    .follower-table-row{
        grid-template-columns:minmax(0,1fr) auto;
    }
    .follower-last-seen{
        grid-column:1;
        grid-row:2;
    }
    .follower-last-seen::before{
        content:"Laatst gezien: ";
        font-weight:650;
    }
    .follower-last-seen.online::before{
        content:"";
    }
    .follower-actions-cell{
        grid-column:2;
        grid-row:1 / 3;
        align-self:center;
    }
}