/* =====================================================================
   Avya Travel - theme (shared)
   "Fare from there" look, palette "Navy, Turquoise & Gold":
   navigation + text navy #102A43, primary buttons turquoise #00A6A6,
   secondary buttons gold #D6AD60, highlights #42C5C1, cards white,
   page #F5F7FA. Open Sans (display + body).
   Loaded LAST on Index.aspx and Site.Master so it overrides legacy CSS.
   ===================================================================== */

:root {
    --av-bg: #f5f7fa;
    --av-night: #102a43;
    --av-gold: #d6ad60;
    --av-paper: #ffffff;
    --av-line: #d9e2ec;
    --av-orb-a: #42c5c1;
    --av-orb-b: #d6ad60;
    --av-orb-c: #c6eeec;
    --av-blue: #008b8b;
    --av-blue-2: #00a6a6;
    --av-orange: #9c7633;
    --av-ink: #102a43;
    --av-ink-soft: #334e68;
    --av-muted: #486581;
    --av-ok: #008b8b;
    --av-danger: #c23a49;
    --av-accent-rgb: 0, 166, 166;
    --av-cta-rgb: 0, 166, 166;
    --av-accent-grad: linear-gradient(0deg, #00a6a6, #00a6a6);
    --av-cta-grad: linear-gradient(0deg, #00a6a6, #00a6a6);
    --av-turq: #00a6a6;
    --av-turq-dark: #008b8b;
    --av-turq-ink: #00797a;   /* turquoise for small text on white (AA) */
    --av-hi: #42c5c1;
    --av-gold-dark: #c4994a;
    --av-gold-ink: #8a6a2c;   /* gold for small text on white (AA) */
    --av-glass: #ffffff;
    --av-glass-strong: #ffffff;
    --av-glass-soft: #f0f4f8;
    --av-glass-border: #d9e2ec;
    --av-glass-edge: rgba(255, 255, 255, 0);
    --av-hairline: #e4e9ef;
    --av-shadow: 0 1px 2px rgba(16, 42, 67, 0.05);
    --av-shadow-lift: 0 10px 28px rgba(16, 42, 67, 0.12);
    --av-blur: none;
    --av-r-xl: 12px;
    --av-r-lg: 10px;
    --av-r-md: 8px;
    --av-r-sm: 6px;
    --av-r-btn: 8px;
    --av-font-display: "Open Sans", "Segoe UI", system-ui, sans-serif;
    --av-font-body: "Open Sans", "Segoe UI", system-ui, sans-serif;
    --av-header-h: 72px;
}

/* ---------- Page background: lagoon wash over warm sand ---------- */
html body.av-glass {
    background: var(--av-bg);
    color: var(--av-ink-soft);
    font-family: var(--av-font-body);
    -webkit-font-smoothing: antialiased;
    min-height: 100vh;
    position: relative;
}

body.av-glass::before {
    content: "";
    position: fixed;
    inset: -10vmax;
    z-index: -1;
    pointer-events: none;
    background: var(--av-bg);
}

body.av-glass h1, body.av-glass h2, body.av-glass h3,
body.av-glass h4, body.av-glass h5, body.av-glass h6 {
    font-family: var(--av-font-display);
    color: var(--av-ink);
}

/* Generic glass surface */
.av-card {
    background: var(--av-glass);
    -webkit-backdrop-filter: var(--av-blur);
    backdrop-filter: var(--av-blur);
    border: 1px solid var(--av-glass-border);
    border-radius: var(--av-r-xl);
    box-shadow: var(--av-shadow), inset 0 1px 0 var(--av-glass-edge);
}

/* ---------- Buttons ---------- */
.av-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 10px 18px;
    border-radius: var(--av-r-btn);
    font-family: var(--av-font-display);
    font-weight: 700;
    font-size: 15px;
    line-height: 1.2;
    text-decoration: none !important;
    border: 1px solid transparent;
    cursor: pointer;
    transition: transform .15s ease, box-shadow .2s ease, background-color .2s ease;
    white-space: nowrap;
}

.av-btn:focus-visible { outline: 3px solid rgba(var(--av-accent-rgb), .35); outline-offset: 2px; }
.av-btn:hover { transform: translateY(-1px); }

.av-btn--primary {
    background: var(--av-accent-grad);
    color: #fff !important;
    box-shadow: 0 8px 22px rgba(var(--av-accent-rgb), 0.32), inset 0 1px 0 rgba(255, 255, 255, 0.35);
}

.av-btn--cta {
    background: var(--av-cta-grad);
    color: #fff !important;
    box-shadow: 0 6px 16px rgba(var(--av-cta-rgb), 0.38);
}

.av-btn--glass {
    background: var(--av-glass-strong);
    color: var(--av-blue) !important;
    border-color: var(--av-glass-border);
    box-shadow: 0 6px 16px rgba(var(--av-accent-rgb), 0.12), inset 0 1px 0 var(--av-glass-edge);
}

.av-btn--glass:hover { background: #fff; }

.av-btn .mdi { font-size: 18px; line-height: 1; }

/* ---------- Header ---------- */
.av-header {
    position: sticky;
    top: 0;
    z-index: 1000;
    padding: 12px 16px 0;
}

.av-header__inner {
    max-width: 1240px;
    margin: 0 auto;
    min-height: 60px;
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 8px 10px 8px 22px;
    background: var(--av-glass-strong);
    -webkit-backdrop-filter: var(--av-blur);
    backdrop-filter: var(--av-blur);
    border: 1px solid var(--av-glass-border);
    border-radius: 999px;
    box-shadow: var(--av-shadow), inset 0 1px 0 var(--av-glass-edge);
}

.av-brand { display: inline-flex; align-items: center; }
.av-brand img { height: 30px; width: auto; display: block; }

.av-nav {
    display: flex;
    align-items: center;
    gap: 4px;
    margin-left: auto;
}

.av-nav__link {
    padding: 8px 14px;
    border-radius: 999px;
    color: var(--av-ink-soft) !important;
    font-family: var(--av-font-display);
    font-weight: 700;
    font-size: 15px;
    text-decoration: none !important;
    transition: background-color .2s ease, color .2s ease;
}

.av-nav__link:hover { background: var(--av-glass-soft); color: var(--av-blue) !important; }
.av-nav__link.is-active { color: var(--av-blue) !important; background: rgba(var(--av-accent-rgb), .08); }

@media (max-width: 640px) {
    .av-header { padding: 10px 10px 0; }
    .av-header__inner { padding: 6px 6px 6px 16px; gap: 8px; }
    .av-brand img { height: 24px; }
    .av-nav__link { display: none; }
    .av-btn--support { padding: 9px 14px; font-size: 14px; }
}

/* ---------- Section headings ---------- */
.av-eyebrow {
    display: inline-block;
    font-family: var(--av-font-display);
    font-weight: 800;
    font-size: 13px;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--av-orange);
    margin-bottom: 6px;
}

.av-title {
    font-family: var(--av-font-display);
    font-weight: 800;
    font-size: clamp(26px, 3vw, 36px);
    color: var(--av-ink);
    margin: 0 0 8px;
}

.av-lead { color: var(--av-muted); font-size: 17px; margin: 0; }

/* ---------- Footer ---------- */
.av-footer {
    padding: 0 16px 20px;
    margin-top: 56px;
    text-align: left;
}

.av-footer__inner {
    max-width: 1240px;
    margin: 0 auto;
    padding: 40px 40px 22px;
}

.av-footer__grid {
    display: grid;
    grid-template-columns: 1.3fr 1fr 1fr 1.1fr;
    gap: 32px;
}

.av-footer__brand img { height: 32px; width: auto; margin-bottom: 14px; }
.av-footer p { color: var(--av-muted); font-size: 15px; line-height: 1.6; margin: 0; }

.av-footer__title {
    font-family: var(--av-font-display);
    font-weight: 800;
    font-size: 16px;
    color: var(--av-ink);
    margin: 0 0 14px;
}

.av-footer__list { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }

.av-footer__list a {
    color: var(--av-ink-soft) !important;
    text-decoration: none !important;
    font-size: 15px;
    transition: color .2s ease;
}

.av-footer__list a:hover { color: var(--av-blue) !important; }
.av-footer__list .mdi { color: var(--av-blue); margin-right: 6px; }

.av-footer__quote {
    font-style: italic;
    color: var(--av-ink-soft) !important;
    border-left: 3px solid var(--av-orange);
    padding-left: 14px;
}

.av-footer__support { margin-top: 16px; }

.av-footer__bottom {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 32px;
    padding-top: 18px;
    border-top: 1px solid var(--av-hairline);
    font-size: 14px;
    color: var(--av-muted);
}

.av-footer__pay { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; }
.av-footer__pay img { height: 26px; width: auto; opacity: .85; }

@media (max-width: 991px) {
    .av-footer__grid { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 575px) {
    .av-footer__inner { padding: 28px 20px 18px; }
    .av-footer__grid { grid-template-columns: 1fr; gap: 26px; }
}

/* ---------- jQuery UI autocomplete + datepicker ---------- */
body.av-glass .ui-autocomplete.ui-menu {
    background: rgba(255, 255, 255, 0.92);
    -webkit-backdrop-filter: var(--av-blur);
    backdrop-filter: var(--av-blur);
    border: 1px solid var(--av-glass-border);
    border-radius: var(--av-r-md);
    box-shadow: var(--av-shadow-lift);
    padding: 6px;
    font-family: var(--av-font-body);
    max-height: 320px;
    overflow-y: auto;
    z-index: 2000 !important;
}

body.av-glass .ui-autocomplete .ui-menu-item,
body.av-glass .ui-autocomplete .ui-menu-item-wrapper,
body.av-glass .ui-autocomplete .ui-menu-item a {
    border-radius: var(--av-r-sm);
    color: var(--av-ink) !important;
    border: 0 !important;
    margin: 0 !important;
}

body.av-glass .ui-autocomplete .ui-state-active,
body.av-glass .ui-autocomplete .ui-state-focus,
body.av-glass .ui-autocomplete .ui-menu-item-wrapper.ui-state-active {
    background: rgba(var(--av-accent-rgb), .1) !important;
    color: var(--av-blue) !important;
}

/* ---------- Date picker (jQuery UI + 2408UI datepicker.js) ----------
   Classes set by datepicker.js: startDay, endDay, dp-highlight-clicked
   (selected range), dp-highlight (hover range), holiday.               */
body.av-glass .ui-datepicker {
    background: transparent;
    border: 0 !important;
    padding: 0;
    margin-top: 8px;
    font-family: var(--av-font-body);
    z-index: 2000 !important;
    max-width: calc(100vw - 20px);
}

body.av-glass #ui-datepicker-div .datepicker-wrapper {
    background: rgba(255, 255, 255, 0.95);
    -webkit-backdrop-filter: var(--av-blur);
    backdrop-filter: var(--av-blur);
    border: 1px solid var(--av-glass-border);
    border-radius: 22px;
    box-shadow: 0 24px 60px rgba(14, 36, 58, 0.22), inset 0 1px 0 var(--av-glass-edge);
    overflow: hidden;
    padding-bottom: 8px;
    animation: av-dp-in .18s ease-out;
}

@keyframes av-dp-in {
    from { opacity: 0; transform: translateY(-6px); }
    to { opacity: 1; transform: none; }
}

/* Header strip */
body.av-glass .ui-datepicker .datepicker-wrapper .header-content {
    padding: 14px 18px;
    background: linear-gradient(90deg, rgba(0, 166, 166, 0.08), rgba(214, 173, 96, 0.08));
    border-bottom: 1px solid var(--av-hairline);
    color: var(--av-ink);
}

body.av-glass .ui-datepicker .datepicker-wrapper .header-content .header-title {
    font-family: var(--av-font-display);
    font-weight: 800;
    font-size: 15px;
    color: var(--av-ink);
}

body.av-glass .ui-datepicker .datepicker-wrapper .header-content .header-subtitle {
    font-size: 12px;
    font-weight: 600;
    color: var(--av-muted);
}

/* broken holiday image -> orange dot legend */
body.av-glass .ui-datepicker .datepicker-wrapper .holiday-img img { display: none; }

body.av-glass .ui-datepicker .datepicker-wrapper .holiday-img::before {
    content: "";
    display: inline-block;
    width: 8px;
    height: 8px;
    margin-right: 6px;
    border-radius: 50%;
    background: var(--av-orange);
    vertical-align: 1px;
}

/* Month header + arrows */
body.av-glass .ui-datepicker .ui-datepicker-group { padding: 6px 10px 0; }

body.av-glass .ui-datepicker .ui-datepicker-header {
    background: transparent;
    border: 0;
    padding: 8px 0 6px;
}

body.av-glass .ui-datepicker .ui-datepicker-title {
    font-family: var(--av-font-display);
    font-weight: 800;
    font-size: 16px;
    line-height: 32px;
    color: var(--av-ink);
}

body.av-glass .ui-datepicker .ui-datepicker-prev,
body.av-glass .ui-datepicker .ui-datepicker-next {
    top: 8px !important;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    border: 1px solid rgba(var(--av-accent-rgb), 0.18) !important;
    background: #fff !important;
    box-shadow: 0 4px 10px rgba(24, 63, 102, 0.08);
    cursor: pointer;
    transition: background-color .15s ease, border-color .15s ease;
}

body.av-glass .ui-datepicker .ui-datepicker-prev { left: 4px !important; }
body.av-glass .ui-datepicker .ui-datepicker-next { right: 4px !important; }

body.av-glass .ui-datepicker .ui-datepicker-prev:hover,
body.av-glass .ui-datepicker .ui-datepicker-next:hover {
    background: rgba(var(--av-accent-rgb), 0.08) !important;
    border-color: rgba(var(--av-accent-rgb), 0.4) !important;
}

body.av-glass .ui-datepicker .ui-datepicker-prev.ui-state-disabled,
body.av-glass .ui-datepicker .ui-datepicker-next.ui-state-disabled { opacity: .35; cursor: default; }

body.av-glass .ui-datepicker .ui-datepicker-header .ui-icon {
    background: none !important;
    text-indent: -9999px;
    overflow: hidden;
    position: absolute;
    left: 50%;
    top: 50%;
    width: 9px;
    height: 9px;
    margin: 0;
    border: solid var(--av-blue);
    border-width: 0 2px 2px 0;
}

body.av-glass .ui-datepicker .ui-datepicker-prev .ui-icon { transform: translate(-30%, -50%) rotate(135deg); }
body.av-glass .ui-datepicker .ui-datepicker-next .ui-icon { transform: translate(-70%, -50%) rotate(-45deg); }

/* Grid */
body.av-glass .ui-datepicker table.ui-datepicker-calendar {
    border-collapse: separate;
    border-spacing: 0 4px;
    margin: 0;
    font-size: 14px;
}

body.av-glass .ui-datepicker .ui-datepicker-calendar th {
    padding: 6px 0;
    border: 0 !important;
    font-family: var(--av-font-display);
    font-weight: 800;
    font-size: 11px;
    letter-spacing: .06em;
    color: var(--av-muted);
}

body.av-glass .ui-datepicker .ui-datepicker-calendar td {
    padding: 0 !important;
    border: 0 !important;
    background: transparent;
}

body.av-glass .ui-datepicker .ui-datepicker-calendar td .ui-state-default {
    position: relative;
    display: block;
    height: 40px;
    line-height: 40px;
    margin: 0 2px;
    padding: 0;
    border: 0 !important;
    border-radius: 12px;
    background: transparent !important;
    color: var(--av-ink) !important;
    font-weight: 600;
    text-align: center;
    transition: background-color .15s ease, color .15s ease, transform .15s ease;
}

body.av-glass .ui-datepicker .ui-datepicker-calendar td a.ui-state-default:hover,
body.av-glass .ui-datepicker .ui-datepicker-calendar td a.ui-state-hover {
    background: rgba(var(--av-accent-rgb), 0.1) !important;
    color: var(--av-blue) !important;
}

/* Past / unavailable */
body.av-glass .ui-datepicker .ui-datepicker-calendar td.ui-state-disabled { opacity: 1; }
body.av-glass .ui-datepicker .ui-datepicker-calendar td.ui-state-disabled .ui-state-default {
    color: #bcccdc !important;
    font-weight: 500;
}

/* Today: small dot */
body.av-glass .ui-datepicker .ui-datepicker-calendar td.ui-datepicker-today .ui-state-default::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: 5px;
    width: 4px;
    height: 4px;
    margin-left: -2px;
    border-radius: 50%;
    background: var(--av-blue);
}

/* Holidays: orange number + dot (replaces missing pointer image) */
body.av-glass .ui-datepicker .ui-datepicker-calendar td.holiday a { background-image: none !important; }
body.av-glass .ui-datepicker .ui-datepicker-calendar td.holiday .ui-state-default { color: #a8803a !important; }

body.av-glass .ui-datepicker .ui-datepicker-calendar td.holiday .ui-state-default::before {
    content: "";
    position: absolute;
    top: 6px;
    right: 7px;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--av-orange);
}

/* Range between departure and return (selected + hover preview) */
body.av-glass .ui-datepicker .ui-datepicker-calendar td.dp-highlight-clicked,
body.av-glass .ui-datepicker .ui-datepicker-calendar td.dp-highlight {
    background: rgba(var(--av-accent-rgb), 0.09) !important;
}

body.av-glass .ui-datepicker .ui-datepicker-calendar td.dp-highlight-clicked .ui-state-default,
body.av-glass .ui-datepicker .ui-datepicker-calendar td.dp-highlight .ui-state-default {
    color: var(--av-blue) !important;
    border-radius: 0;
    margin: 0;
}

/* round the band at row edges */
body.av-glass .ui-datepicker .ui-datepicker-calendar td.dp-highlight-clicked:first-child,
body.av-glass .ui-datepicker .ui-datepicker-calendar td.dp-highlight:first-child { border-radius: 12px 0 0 12px; }
body.av-glass .ui-datepicker .ui-datepicker-calendar td.dp-highlight-clicked:last-child,
body.av-glass .ui-datepicker .ui-datepicker-calendar td.dp-highlight:last-child { border-radius: 0 12px 12px 0; }

/* Departure (start) = Avya teal, Return (end) = Avya gold */
body.av-glass .ui-datepicker .ui-datepicker-calendar td.startDay .ui-state-default,
body.av-glass .ui-datepicker .ui-datepicker-calendar td .ui-state-default.ui-state-active {
    background: var(--av-accent-grad) !important;
    color: #fff !important;
    border-radius: 12px !important;
    margin: 0 2px;
    box-shadow: 0 6px 14px rgba(var(--av-accent-rgb), 0.35);
}

body.av-glass .ui-datepicker .ui-datepicker-calendar td.endDay .ui-state-default {
    background: var(--av-night) !important;
    color: #fff !important;
    border-radius: 12px !important;
    margin: 0 2px;
    box-shadow: 0 6px 14px rgba(16, 42, 67, 0.3);
}

body.av-glass .ui-datepicker .ui-datepicker-calendar td.startDay .ui-state-default::after,
body.av-glass .ui-datepicker .ui-datepicker-calendar td.endDay .ui-state-default::after { background: #fff; }

/* band joins the start/end pills */
body.av-glass .ui-datepicker .ui-datepicker-calendar td.startDay.dp-highlight-clicked,
body.av-glass .ui-datepicker .ui-datepicker-calendar td.startDay.dp-highlight {
    background: linear-gradient(90deg, transparent 50%, rgba(var(--av-accent-rgb), 0.09) 50%) !important;
}

body.av-glass .ui-datepicker .ui-datepicker-calendar td.endDay.dp-highlight-clicked,
body.av-glass .ui-datepicker .ui-datepicker-calendar td.endDay.dp-highlight {
    background: linear-gradient(90deg, rgba(var(--av-accent-rgb), 0.09) 50%, transparent 50%) !important;
}

/* hovering a date inside the range (return picker preview) */
body.av-glass .ui-datepicker .ui-datepicker-calendar td.dp-highlight:not(.startDay) a.ui-state-default:hover,
body.av-glass .ui-datepicker .ui-datepicker-calendar td.dp-highlight:not(.startDay) a.ui-state-default.ui-state-hover {
    background: var(--av-night) !important;
    color: #fff !important;
    border-radius: 12px !important;
}

body.av-glass .ui-datepicker .ui-datepicker-group-last { border-left: 1px solid var(--av-hairline); }
body.av-glass .ui-datepicker .ui-datepicker-row-break { display: none; }

@media (max-width: 575px) {
    body.av-glass .ui-datepicker .datepicker-wrapper .header-content .date-details { display: none; }
    body.av-glass .ui-datepicker .ui-datepicker-calendar td .ui-state-default { height: 38px; line-height: 38px; }
}

/* SweetAlert2 "Searching..." dialog */
body.av-glass .swal2-popup {
    border-radius: var(--av-r-xl);
    font-family: var(--av-font-body);
    box-shadow: var(--av-shadow-lift);
}

body.av-glass .swal2-title { font-family: var(--av-font-display); color: var(--av-ink); }
body.av-glass .swal2-styled.swal2-confirm { background: var(--av-accent-grad) !important; border-radius: 999px; }

/* Bootbox / Bootstrap modal used by displayAlert() */
body.av-glass .modal-content {
    border-radius: var(--av-r-lg);
    border: 1px solid var(--av-glass-border);
    box-shadow: var(--av-shadow-lift);
}

@media (prefers-reduced-motion: reduce) {
    .av-btn, .av-nav__link { transition: none; }
    .av-btn:hover { transform: none; }
}

/* =====================================================================
   Flight search loader (SweetAlert2 popup) - markup from scripts/Index.js
   ===================================================================== */
.swal2-container.av-search-backdrop.swal2-backdrop-show {
    background: rgba(14, 36, 58, 0.38) !important;
    -webkit-backdrop-filter: blur(8px) saturate(140%);
    backdrop-filter: blur(8px) saturate(140%);
}

body.av-glass .swal2-popup.av-search-popup {
    position: relative;
    overflow: hidden;
    padding: 30px 26px 26px;
    border-radius: var(--av-r-xl);
    background: rgba(255, 255, 255, 0.86);
    -webkit-backdrop-filter: var(--av-blur);
    backdrop-filter: var(--av-blur);
    border: 1px solid var(--av-glass-border);
    box-shadow: 0 30px 80px rgba(14, 36, 58, 0.35), inset 0 1px 0 var(--av-glass-edge);
}

/* soft orbs inside the card */
body.av-glass .swal2-popup.av-search-popup::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        radial-gradient(60% 70% at 0% 0%, rgba(66, 197, 193, 0.32), transparent 70%),
        radial-gradient(55% 65% at 100% 100%, rgba(214, 173, 96, 0.38), transparent 70%);
    animation: av-sl-orbs 6s ease-in-out infinite alternate;
}

body.av-glass .av-search-popup .swal2-content,
body.av-glass .av-search-popup .swal2-html-container { margin: 0; padding: 0; position: relative; z-index: 1; }

.av-sl { font-family: var(--av-font-body); color: var(--av-ink-soft); }

.av-sl__route {
    display: flex;
    align-items: flex-end;
    justify-content: center;
    gap: 6px;
    margin-bottom: 18px;
}

.av-sl__end { display: flex; flex-direction: column; align-items: center; min-width: 64px; }

.av-sl__code {
    font-family: var(--av-font-display);
    font-weight: 800;
    font-size: 26px;
    line-height: 1;
    letter-spacing: .02em;
    color: var(--av-blue);
}

.av-sl__code--to { color: var(--av-orange); }

.av-sl__city {
    margin-top: 4px;
    max-width: 90px;
    font-size: 12px;
    color: var(--av-muted);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.av-sl__track { position: relative; width: 240px; height: 70px; flex-shrink: 0; margin-bottom: 8px; }
.av-sl__arc { position: absolute; inset: 0; width: 240px; height: 70px; overflow: visible; }

.av-sl__dash {
    fill: none;
    stroke: rgba(0, 166, 166, 0.28);
    stroke-width: 2;
    stroke-linecap: round;
    stroke-dasharray: 1.2 3;
    animation: av-sl-dash 1.2s linear infinite;
}

.av-sl__trail {
    fill: none;
    stroke: url(#maSlGrad);
    stroke-width: 3;
    stroke-linecap: round;
    stroke-dasharray: 100 100;
    stroke-dashoffset: 100;
    animation: av-sl-trail 2.6s cubic-bezier(.45, 0, .25, 1) infinite;
}

.av-sl__pin { stroke: #fff; stroke-width: 2.5; }
.av-sl__pin--from { fill: var(--av-blue); }
.av-sl__pin--to { fill: var(--av-orange); }

.av-sl__ring {
    fill: none;
    stroke: var(--av-orange);
    stroke-width: 2;
    transform-box: fill-box;
    transform-origin: center;
    animation: av-sl-ping 1.6s ease-out infinite;
}

.av-sl__plane {
    position: absolute;
    top: 0;
    left: 0;
    width: 26px;
    height: 26px;
    fill: var(--av-blue);
    filter: drop-shadow(0 4px 6px rgba(0, 166, 166, 0.35));
    offset-path: path("M10 60 Q120 -12 230 60");
    offset-anchor: center;
    offset-rotate: auto 90deg;
    animation: av-sl-fly 2.6s cubic-bezier(.45, 0, .25, 1) infinite;
}

.av-sl__title {
    margin: 0 0 6px;
    font-family: var(--av-font-display);
    font-weight: 800;
    font-size: 22px;
    color: var(--av-ink);
}

.av-sl__status {
    min-height: 22px;
    margin: 0 0 18px;
    font-size: 15px;
    color: var(--av-muted);
    transition: opacity .22s ease, transform .22s ease;
}

.av-sl__status.is-swapping { opacity: 0; transform: translateY(4px); }

.av-sl__bar {
    position: relative;
    height: 6px;
    margin: 0 auto;
    max-width: 300px;
    border-radius: 999px;
    background: rgba(0, 166, 166, 0.1);
    overflow: hidden;
}

.av-sl__bar span {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 40%;
    border-radius: 999px;
    background: linear-gradient(90deg, #00a6a6, #00a6a6 45%, #d6ad60 80%, #d6ad60);
    animation: av-sl-bar 1.4s ease-in-out infinite;
}

/* Success state: plane lands, bar fills, turns green */
.av-sl.is-done .av-sl__plane { animation: none; offset-distance: 100%; fill: var(--av-orange); }
.av-sl.is-done .av-sl__trail { animation: none; stroke-dashoffset: 0; }
.av-sl.is-done .av-sl__bar span { animation: none; left: 0; width: 100%; background: linear-gradient(90deg, #00a6a6, #008b8b); transition: width .4s ease; }
.av-sl.is-done .av-sl__title { color: var(--av-ok); }

@keyframes av-sl-fly {
    0% { offset-distance: 0%; opacity: 0; }
    8% { opacity: 1; }
    88% { opacity: 1; }
    100% { offset-distance: 100%; opacity: 0; }
}

@keyframes av-sl-trail {
    0% { stroke-dashoffset: 100; opacity: 1; }
    85% { stroke-dashoffset: 0; opacity: 1; }
    100% { stroke-dashoffset: 0; opacity: 0; }
}

@keyframes av-sl-dash { to { stroke-dashoffset: -4.2; } }

@keyframes av-sl-ping {
    0% { transform: scale(1); opacity: .9; }
    100% { transform: scale(3); opacity: 0; }
}

@keyframes av-sl-bar {
    0% { left: -40%; }
    100% { left: 100%; }
}

@keyframes av-sl-orbs {
    0% { transform: translate3d(0, 0, 0); }
    100% { transform: translate3d(-4%, 3%, 0); }
}

@media (max-width: 420px) {
    body.av-glass .swal2-popup.av-search-popup { padding: 24px 14px 20px; }
    .av-sl__route { transform: scale(.82); transform-origin: center bottom; margin-bottom: 10px; }
    .av-sl__title { font-size: 20px; }
}

@media (prefers-reduced-motion: reduce) {
    .av-sl__plane { animation: none; offset-distance: 50%; }
    .av-sl__trail { animation: none; stroke-dashoffset: 50; }
    .av-sl__dash, .av-sl__ring, body.av-glass .swal2-popup.av-search-popup::before { animation: none; }
    .av-sl__bar span { animation-duration: 3s; }
}

/* Warning / error alerts (displayAlert) in theme colours */
body.av-glass .swal2-icon.swal2-error { border-color: rgba(217, 63, 79, 0.45); color: var(--av-danger); }
body.av-glass .swal2-icon.swal2-error [class^="swal2-x-mark-line"] { background-color: var(--av-danger); }
body.av-glass .swal2-html-container, body.av-glass .swal2-content { color: var(--av-ink-soft); font-family: var(--av-font-body); }

/* =====================================================================
   "Fare from there" shared pieces: night header, buttons, footer.
   Used by Index.aspx and Site.Master.
   ===================================================================== */
.av2-sr { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

.av2-top { background: var(--av-night); border-bottom: 0; }

.av2-header {
    max-width: 1240px;
    margin: 0 auto;
    padding: 20px 32px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 16px 28px;
    text-align: left;
}
.av2-brand { display: flex; align-items: center; }
.av2-brand img { height: 46px; width: auto; display: block; }
.av2-nav { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 28px; }
.av2-nav a { color: #e4e9ef !important; font: 500 15px/1.4 var(--av-font-body); text-decoration: none !important; }
.av2-nav a:hover, .av2-nav a.is-active { color: var(--av-hi) !important; }

.av2-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 44px;
    padding: 0 18px;
    border-radius: var(--av-r-btn);
    font: 600 15px/1.2 var(--av-font-body);
    text-decoration: none !important;
    cursor: pointer;
    white-space: nowrap;
    transition: background-color .15s ease, color .15s ease, border-color .15s ease;
}
.av2-btn:focus-visible { outline: 3px solid var(--av-hi); outline-offset: 2px; }
/* secondary = gold */
.av2-btn--outline { border: 1.5px solid var(--av-gold); color: var(--av-gold-ink) !important; background: transparent; }
.av2-btn--outline:hover { background: var(--av-gold); color: var(--av-night) !important; }
.av2-top .av2-btn--outline { color: var(--av-gold) !important; }
.av2-top .av2-btn--outline:hover { color: var(--av-night) !important; }
/* primary = turquoise */
.av2-btn--primary { border: 0; background: var(--av-turq); color: #ffffff !important; font-weight: 700; }
.av2-btn--primary:hover { background: var(--av-turq-dark); }
.av2-btn--gold { border: 0; background: var(--av-gold); color: var(--av-night) !important; font-weight: 700; }
.av2-btn--gold:hover { background: var(--av-gold-dark); }
.av2-btn--ghost { border: 1.5px solid #627d98; color: #ffffff !important; background: transparent; }
.av2-btn--ghost:hover { border-color: #ffffff; }

.av2-footer { background: var(--av-night); color: #d3dce6; text-align: left; }
.av2-footer__inner { max-width: 1240px; margin: 0 auto; padding: 72px 32px 36px; }
.av2-footer__cta {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 24px 32px;
    align-items: center;
    padding-bottom: 44px;
    border-bottom: 1px solid #243b53;
}
.av2-footer__cta h2 {
    margin: 0 !important;
    font: 800 clamp(28px, 3.2vw, 40px)/1.06 var(--av-font-display) !important;
    color: #ffffff !important;
    letter-spacing: -.01em;
    text-transform: none !important;
}
.av2-footer__actions { display: flex; flex-wrap: wrap; gap: 12px; }
.av2-footer__actions .av2-btn { min-height: 52px; padding: 0 22px; font-size: 16px; }
.av2-footer__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 32px; padding: 40px 0; }
.av2-footer__logo { height: 36px; width: auto; display: block; }
.av2-footer p { margin: 16px 0 0; font: 400 15px/1.6 var(--av-font-body); color: #d3dce6; }
.av2-footer h3 {
    margin: 0 0 14px !important;
    font: 700 13px/1.4 var(--av-font-body) !important;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--av-gold) !important;
}
.av2-footer ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.av2-footer li a { color: #d3dce6 !important; font: 400 15px/1.5 var(--av-font-body); text-decoration: none !important; }
.av2-footer li a:hover { color: #ffffff !important; text-decoration: underline !important; }
.av2-footer__grid > div > p:first-child { margin-top: 0; }
.av2-footer__copy { margin: 0 !important; padding-top: 24px; border-top: 1px solid #243b53; font-size: 14px !important; color: #9fb3c8 !important; }

@media (max-width: 640px) {
    .av2-header { padding: 14px 18px; }
    .av2-brand img { height: 32px; }
    .av2-nav { order: 3; width: 100%; gap: 6px 20px; }
    .av2-footer__inner { padding: 48px 18px 28px; }
}
