/* ============================================================
   Ice Transfer Cities Manager — Frontend Styles v1.2
   Iceland Blue: #003897  |  Iceland Red: #d72828
   ============================================================ */

/* ── Popups that must sit above the full-screen modal ──────── */
.pac-container  { z-index: 9999999 !important; }
.ui-datepicker  { z-index: 9999999 !important; }

/* ── Shared containers ─────────────────────────────────────── */
.ice-cities-container,
.ice-transfers-container { max-width:1200px; margin:0 auto; padding:0 24px; }

/* ── Section wrappers ─────────────────────────────────────── */
.ice-cities-section   { padding:64px 0; background:#f4f6f9; }
.ice-transfers-section{ padding:52px 0 72px; background:#fff; }

/* ── Section headings ─────────────────────────────────────── */
.ice-section-title { font-size:26px; font-weight:800; color:#1a1a2e; margin:0 0 28px; line-height:1.25; }

/* ══════════════════════════════════════════════════════════ */
/*  CITY CARDS GRID                                           */
/* ══════════════════════════════════════════════════════════ */
.ice-cities-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
@media(max-width:1100px){.ice-cities-grid{grid-template-columns:repeat(3,1fr);}}
@media(max-width:760px) {.ice-cities-grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:480px) {.ice-cities-grid{grid-template-columns:1fr;}}

.ice-city-card {
    position:relative; display:block; border-radius:14px; overflow:hidden;
    aspect-ratio:3/4; text-decoration:none; background:#c4cdd8; cursor:pointer;
    transition:transform .32s ease,box-shadow .32s ease; will-change:transform;
}
.ice-city-card:hover{ transform:scale(1.035); box-shadow:0 18px 52px rgba(0,0,0,.26); text-decoration:none; }
/* !important defeats Elementor's ".elementor img { height:auto }" when the
   [ice_cities_section] shortcode is embedded inside an Elementor-built page. */
.ice-city-card img{ width:100% !important; height:100% !important; max-width:100% !important; object-fit:cover; display:block; transition:transform .5s ease; }
.ice-city-card:hover img{ transform:scale(1.09); }
.ice-city-card-no-img{ width:100%; height:100%; background:linear-gradient(135deg,#003897 0%,#1a6bb5 100%); }
.ice-city-card::after{
    content:''; position:absolute; inset:0;
    background:linear-gradient(to top,rgba(0,0,0,.76) 0%,rgba(0,0,0,.22) 45%,transparent 70%);
    pointer-events:none;
}
.ice-city-info{ position:absolute; bottom:16px; left:16px; right:16px; z-index:1; pointer-events:none; }
.ice-city-name   { display:block; font-size:17px; font-weight:800; color:#fff; text-shadow:0 1px 4px rgba(0,0,0,.5); }
.ice-city-tagline{ display:block; font-size:12px; color:rgba(255,255,255,.85); margin-top:3px; }

.ice-city-card.ice-hidden{ display:none; }
.ice-city-card.ice-fadein{ animation:iceFadeIn .38s ease both; }
@keyframes iceFadeIn{ from{opacity:0;transform:scale(.94);} to{opacity:1;transform:scale(1);} }

.ice-show-more-wrap{ text-align:center; margin-top:32px; }
.ice-show-more-btn{
    display:inline-flex; align-items:center; gap:8px;
    background:transparent; border:2px solid #003897; color:#003897;
    padding:13px 36px; border-radius:8px; font-size:15px; font-weight:700; cursor:pointer;
    transition:background .22s,color .22s,transform .2s; font-family:inherit;
}
.ice-show-more-btn:hover{ background:#003897; color:#fff; transform:translateY(-1px); }
.ice-show-more-count{ font-weight:400; font-size:13px; opacity:.8; }

/* ══════════════════════════════════════════════════════════ */
/*  TRANSFER ROUTE CARDS                                      */
/* ══════════════════════════════════════════════════════════ */
.ice-transfers-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
@media(max-width:1024px){.ice-transfers-grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:600px) {.ice-transfers-grid{grid-template-columns:1fr;}}

.ice-transfer-card{
    background:#fff; border-radius:16px; overflow:hidden;
    box-shadow:0 4px 20px rgba(0,0,0,.08);
    transition:transform .3s ease,box-shadow .3s ease;
    display:flex; flex-direction:column; border:1px solid rgba(0,0,0,.05);
    cursor:pointer;
}
.ice-transfer-card:focus-visible{ outline:3px solid #003897; outline-offset:2px; }
.ice-transfer-card:hover{ transform:translateY(-5px); box-shadow:0 20px 48px rgba(0,0,0,.15); }

.ice-transfer-images{ position:relative; height:158px; display:flex; flex-shrink:0; }
.ice-transfer-images img,.ice-transfer-img-placeholder{ flex:1; width:50% !important; height:100% !important; max-width:100% !important; object-fit:cover; display:block; }
.ice-from-img{ border-right:2px solid rgba(255,255,255,.5); }
.ice-transfer-img-placeholder{ background:linear-gradient(135deg,#003897 0%,#5b8fd4 100%); }
.ice-transfer-img-placeholder.ice-to-img{ background:linear-gradient(135deg,#1a4a80 0%,#003897 100%); }

.ice-transfer-arrow{
    position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
    background:#fff; border-radius:50%; width:36px; height:36px;
    display:flex; align-items:center; justify-content:center;
    box-shadow:0 2px 12px rgba(0,0,0,.24); font-size:15px; color:#003897; font-weight:900; z-index:1;
}

.ice-transfer-body{ padding:18px 20px 20px; display:flex; flex-direction:column; flex-grow:1; }
.ice-transfer-route{ font-size:15px; font-weight:800; color:#1a1a2e; line-height:1.35; margin-bottom:8px; }
.ice-route-arrow  { color:#003897; margin:0 3px; font-size:13px; }
.ice-to-city-link { color:#003897; text-decoration:none; }
.ice-to-city-link:hover{ color:#d72828; text-decoration:underline; }
.ice-transfer-desc{ font-size:12px; color:#888; margin:0 0 10px; line-height:1.5; }

.ice-transfer-meta{ display:flex; flex-wrap:wrap; gap:6px; margin-bottom:14px; }
.ice-meta-badge{
    display:inline-flex; align-items:center; gap:4px;
    background:#f0f4fa; color:#445; font-size:12px; font-weight:600;
    padding:4px 10px; border-radius:20px;
}
.ice-meta-badge svg{ color:#003897; flex-shrink:0; }

/* Vehicle prices */
.ice-vehicle-prices{ border:1px solid #e8edf5; border-radius:10px; overflow:hidden; margin-bottom:16px; }
.ice-vehicle-row{
    display:flex; align-items:center; gap:10px; padding:9px 14px;
    border-bottom:1px solid #f0f4f8; transition:background .15s;
}
.ice-vehicle-row:last-child{ border-bottom:none; }
.ice-vehicle-row:hover{ background:#f7f9fc; }
.ice-vehicle-icon { color:#003897; display:flex; align-items:center; flex-shrink:0; }
.ice-vehicle-type { font-size:13px; font-weight:600; color:#445; flex:1; }
.ice-vehicle-price{ font-size:16px; font-weight:800; color:#003897; }

/* Book Transfer button */
.ice-book-btn{
    display:flex; align-items:center; justify-content:center; gap:10px; margin-top:auto;
    padding:13px 22px; background:linear-gradient(135deg,#003897 0%,#0051cc 100%);
    color:#fff !important; text-decoration:none !important; border:none; border-radius:10px;
    font-size:14px; font-weight:700; letter-spacing:.3px; cursor:pointer; font-family:inherit;
    box-shadow:0 4px 14px rgba(0,56,151,.35); transition:background .22s,transform .18s,box-shadow .22s;
    width:100%; text-align:center;
}
.ice-book-btn:hover{
    background:linear-gradient(135deg,#d72828 0%,#f03030 100%);
    box-shadow:0 6px 22px rgba(215,40,40,.38); transform:translateY(-2px); color:#fff !important;
}
.ice-book-btn-text{ flex:1; }
.ice-book-btn-icon{ font-size:18px; opacity:.9; transition:transform .22s; }
.ice-book-btn:hover .ice-book-btn-icon{ transform:translateX(4px); }

.ice-no-transfers,.ice-no-cities{ text-align:center; color:#888; font-size:15px; padding:40px 20px; }

/* ══════════════════════════════════════════════════════════ */
/*  FULL-SCREEN BOOKING MODAL                                 */
/* ══════════════════════════════════════════════════════════ */

/* The modal uses opacity + pointer-events (NOT visibility:hidden)
   so ECAB and Google Maps scripts stay active at all times. */
.ice-booking-modal{
    position:fixed; inset:0; z-index:999998;
    display:flex; align-items:stretch; justify-content:center;
    opacity:0; pointer-events:none;
    transition:opacity .28s ease;
}
.ice-booking-modal.is-open{ opacity:1; pointer-events:all; }

.ice-modal-backdrop{
    position:absolute; inset:0;
    background:rgba(5,15,35,.7); backdrop-filter:blur(4px); cursor:pointer;
}

/* Full-screen box */
.ice-modal-box{
    position:relative; z-index:1;
    background:#fff;
    width:100%; height:100%;
    display:flex; flex-direction:column;
    box-shadow:none;
    transform:translateY(30px);
    transition:transform .32s cubic-bezier(.22,.68,0,1.1);
    overflow:hidden;
}
.ice-booking-modal.is-open .ice-modal-box{ transform:translateY(0); }

.ice-modal-header{
    display:flex; align-items:center; justify-content:space-between;
    padding:16px 28px; border-bottom:1px solid #edf0f5;
    flex-shrink:0; background:#fff;
    box-shadow:0 2px 8px rgba(0,0,0,.06);
}
.ice-modal-route-title{ font-size:20px; font-weight:800; color:#1a1a2e; margin:0; }

.ice-modal-close{
    background:#f4f6fa; border:none; border-radius:8px;
    width:40px; height:40px; display:flex; align-items:center; justify-content:center;
    cursor:pointer; color:#555; transition:background .18s,color .18s; flex-shrink:0;
}
.ice-modal-close:hover{ background:#d72828; color:#fff; }

.ice-modal-body{ padding:28px 32px; overflow-y:auto; flex:1; }
@media(max-width:600px){ .ice-modal-body{ padding:20px 16px; } }

body.ice-modal-open{ overflow:hidden; }

/* ══════════════════════════════════════════════════════════ */
/*  CITY PAGE (single-ice_city.php)                           */
/* ══════════════════════════════════════════════════════════ */
.ice-city-page{ background:#fff; }
.ice-city-hero{
    position:relative; min-height:360px; height:44vh; max-height:500px;
    background-size:cover; background-position:center; display:flex; align-items:flex-end;
}
@media(max-width:600px){ .ice-city-hero{ height:260px; } }

.ice-city-hero-overlay{
    position:absolute; inset:0;
    background:linear-gradient(to top,rgba(0,0,0,.75) 0%,rgba(0,0,0,.2) 55%,rgba(0,0,0,.05) 100%);
}
.ice-city-hero-content{
    position:relative; z-index:1; padding:32px 40px;
    width:100%; max-width:1200px; margin:0 auto;
}
@media(max-width:600px){ .ice-city-hero-content{ padding:24px 20px; } }

/* Pill breadcrumb */
.ice-breadcrumb{
    display:inline-flex; align-items:center; gap:6px;
    background:rgba(255,255,255,.15); backdrop-filter:blur(6px);
    border:1px solid rgba(255,255,255,.25);
    padding:6px 14px; border-radius:100px; font-size:13px;
    color:rgba(255,255,255,.9); margin-bottom:14px;
}
.ice-breadcrumb a{ color:#fff !important; text-decoration:none; opacity:.9; }
.ice-breadcrumb a:hover{ color:#fff !important; opacity:1; }
.ice-bc-sep{ opacity:.6; font-size:11px; }

.ice-city-hero-title  { font-size:44px; font-weight:900; color:#fff; margin:0 0 8px; text-shadow:0 2px 10px rgba(0,0,0,.45); line-height:1.1; }
.ice-city-hero-tagline{ font-size:17px; color:rgba(255,255,255,.88); margin:0; }
@media(max-width:600px){ .ice-city-hero-title{ font-size:28px; } }

.ice-city-description{ background:#f8f9fb; padding:28px 0; border-bottom:1px solid #e8ecf0; }
.ice-city-description-inner{ max-width:1200px; margin:0 auto; padding:0 40px; font-size:15px; color:#444; line-height:1.7; }
@media(max-width:600px){ .ice-city-description-inner{ padding:0 20px; } }
.ice-city-transfers-wrap .ice-transfers-section{ background:#fff; padding-top:50px; }

/* ── Single city CTA book button ─────────────────────────────── */
.ice-city-cta{
    background:linear-gradient(135deg,#003897 0%,#0050cc 100%);
    padding:28px 0;
}
.ice-city-cta-inner{
    max-width:1200px; margin:0 auto; padding:0 40px;
    display:flex; align-items:center; justify-content:space-between; gap:24px; flex-wrap:wrap;
}
.ice-city-cta-text{
    display:flex; flex-direction:column; gap:4px;
}
.ice-city-cta-title{
    font-size:20px; font-weight:800; color:#fff !important; line-height:1.2;
}
.ice-city-cta-sub{
    font-size:13px; color:rgba(255,255,255,.78);
}
.ice-city-cta-btn{
    background:#d72828; color:#fff !important; border:none; border-radius:10px;
    padding:14px 32px; font-size:16px; font-weight:800; cursor:pointer;
    display:inline-flex; align-items:center; gap:10px; white-space:nowrap;
    transition:background .2s, transform .15s, box-shadow .2s;
    box-shadow:0 4px 18px rgba(0,0,0,.18);
}
.ice-city-cta-btn:hover{
    background:#003897; color:#fff !important;
    transform:translateY(-2px); box-shadow:0 8px 24px rgba(0,0,0,.22);
}
.ice-cta-arrow{ font-size:18px; transition:transform .2s; }
.ice-city-cta-btn:hover .ice-cta-arrow{ transform:translateX(4px); }

/* Mobile: book button becomes a floating sticky bar at the bottom */
@media(max-width:640px){
    .ice-city-cta{ background:transparent; padding:0; }
    .ice-city-cta-inner{ padding:0; }
    .ice-city-cta-text{ display:none; }
    .ice-city-cta-btn{
        position:fixed; left:12px; right:12px; bottom:12px;
        z-index:99990; width:auto; justify-content:center;
        padding:16px 24px; font-size:17px; border-radius:12px;
        box-shadow:0 8px 28px rgba(0,0,0,.32);
    }
    /* keep the floating button from covering the last card */
    .ice-city-page{ padding-bottom:88px; }
}

/* ══════════════════════════════════════════════════════════ */
/*  ARCHIVE PAGE (/transfers/)                                */
/* ══════════════════════════════════════════════════════════ */
.ice-archive-page{ background:#f4f6f9; }

/* Full-bleed hero — uses background-image inline style to avoid theme img overrides */
.ice-archive-hero{
    position:relative; min-height:520px; height:60vh; max-height:680px;
    display:flex; align-items:center; overflow:hidden;
    background-size:cover; background-position:center; background-repeat:no-repeat;
}
@media(max-width:768px){ .ice-archive-hero{ min-height:420px; height:auto; padding:60px 0 80px; } }
.ice-archive-hero-overlay{
    position:absolute; inset:0;
    background:linear-gradient(135deg,rgba(0,30,90,.82) 0%,rgba(0,56,151,.65) 50%,rgba(0,20,60,.7) 100%);
}
.ice-archive-hero-content{
    position:relative; z-index:1;
    max-width:1200px; margin:0 auto; padding:0 28px;
    width:100%;
}
/* breadcrumb inside hero */
.ice-archive-bc{
    display:inline-flex; align-items:center; gap:6px;
    background:rgba(255,255,255,.12); backdrop-filter:blur(6px);
    border:1px solid rgba(255,255,255,.2);
    padding:5px 14px; border-radius:100px; font-size:13px;
    color:rgba(255,255,255,.85); margin-bottom:20px;
}
.ice-archive-bc a{ color:rgba(255,255,255,.85); text-decoration:none; }
.ice-archive-bc a:hover{ color:#fff; }
.ice-archive-bc span{ opacity:.65; font-size:11px; }

.ice-archive-h1{
    font-size:clamp(32px,5vw,58px); font-weight:900; color:#fff !important;
    margin:0 0 14px; line-height:1.1;
    text-shadow:0 3px 16px rgba(0,0,0,.35);
}
.ice-archive-lead{
    font-size:clamp(15px,2vw,19px); color:rgba(255,255,255,.86);
    margin:0 0 36px; max-width:600px; line-height:1.6;
}

/* Stats row */
.ice-archive-stats{
    display:flex; align-items:center; flex-wrap:wrap; gap:0;
    background:rgba(255,255,255,.1); backdrop-filter:blur(10px);
    border:1px solid rgba(255,255,255,.18);
    border-radius:14px; padding:20px 28px; max-width:580px;
    margin-bottom:24px;
}
.ice-astat{ text-align:center; padding:0 20px; }
.ice-astat:first-child{ padding-left:0; }
.ice-astat:last-child { padding-right:0; }
.ice-astat-num  { display:block; font-size:30px; font-weight:900; color:#fff; line-height:1; }
.ice-astat-label{ display:block; font-size:12px; color:rgba(255,255,255,.72); margin-top:4px; text-transform:uppercase; letter-spacing:.6px; }
.ice-astat-divider{ width:1px; height:40px; background:rgba(255,255,255,.2); }
@media(max-width:480px){ .ice-archive-stats{ gap:12px; } .ice-astat-divider{ display:none; } .ice-astat{ padding:0 10px; } }

/* Feature pills */
.ice-archive-features{ display:flex; flex-wrap:wrap; gap:10px; }
.ice-afeat{
    display:inline-flex; align-items:center; gap:6px;
    background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.2);
    color:rgba(255,255,255,.9); padding:7px 14px; border-radius:100px;
    font-size:13px; font-weight:600;
}
.ice-afeat svg{ color:#4af; flex-shrink:0; }

/* Bottom wave */
.ice-archive-wave{
    position:absolute; bottom:0; left:0; right:0;
    height:60px; overflow:hidden; line-height:0;
}
.ice-archive-wave svg{ width:100%; height:100%; display:block; }
@media(max-width:768px){ .ice-archive-wave{ display:none; } }

/* Body (grid) */
.ice-archive-body{ padding:52px 0 72px; background:#f4f6f9; }
.ice-archive-grid-title{
    font-size:22px; font-weight:800; color:#1a1a2e;
    margin:0 0 24px; padding-bottom:16px;
    border-bottom:2px solid #e4e8ef;
}
