/*
 * TENT Tours — brand theme "Night & Amber" (approved 31 Oct 2026).
 * Loaded after the stock design system (frontend/scss/main.css) and only
 * re-points its --tv-* variables, plus fonts and a few finishing touches.
 *
 * Palette: navy #122E4A (primary / dark surfaces) · deep navy #0E2439 ·
 * amber #F6BE58 (buttons, highlights) · deep amber #B07214 (amber text on white) ·
 * light amber #FFD48A · steel text #536579 / #C3CFDC · borders #DCE3EC / #2B4C6E · white.
 */

:root {
    --tv-primary: #B07214;
    --tv-primary-dark: #8F5C0E;
    --tv-secondary: #FFF3DC;
    --tv-accent: #F6BE58;
    --tv-info: #122E4A;
    --tv-text-dark: #122E4A;
    --tv-text-light: #536579;
    --tv-placeholder: #8A99AB;
    --tv-bg: #FFFFFF;
    --tv-surface: #FFFFFF;
    --tv-surface-2: #F7F9FC;
    --tv-section-bg: #F2F5F9;
    --tv-border: #DCE3EC;
    --tv-primary-50: #FFF8EA;
    --tv-primary-100: #FFEFCF;
    --tv-primary-200: #FFDFA3;
    --tv-primary-soft: rgba(246, 190, 88, 0.20);
    --tv-on-brand: #FFFFFF;      /* light text on dark (navy) surfaces: hero, page headers, footer */
    --tv-on-gold: #10263D;       /* navy text on amber fills (buttons, badges) */
    --tv-on-accent: #10263D;
    --tv-contrast-surface: #FFFFFF;
    --tv-contrast-text: #122E4A;
    --tv-inverse: #0E2439;
    --tv-deep: #0E2439;
    --tv-overlay: #08182A;
    --tv-badge-accent: #B07214;
    --tv-selection-bg: rgba(246, 190, 88, 0.40);
    --tv-selection-text: #10263D;
    --tv-shadow: 0 8px 24px rgba(18, 46, 74, 0.08);
    --tv-shadow-md: 0 12px 32px rgba(18, 46, 74, 0.10);
    --tv-shadow-lg: 0 24px 60px rgba(18, 46, 74, 0.16);
    --tv-shadow-brand: 0 10px 26px rgba(246, 190, 88, 0.38);
    --tv-shadow-brand-hover: 0 16px 36px rgba(246, 190, 88, 0.50);
    --tv-shadow-focus: 0 0 0 0.2rem rgba(246, 190, 88, 0.30);
    --tv-shadow-focus-button: 0 0 0 0.25rem rgba(246, 190, 88, 0.30);
    --tv-shadow-ring: 0 0 0 4px rgba(246, 190, 88, 0.25);
    --tv-gradient-brand: linear-gradient(135deg, #FFD07A, #F2B33D);
    --tv-gradient-brand-reverse: linear-gradient(150deg, #F2B33D, #FFD07A);
    --tv-gradient-accent: linear-gradient(135deg, #FFD07A, #F2B33D);
    --tv-gradient-page: linear-gradient(120deg, #0E2439, #163A5C);
    --tv-gradient-deep: linear-gradient(135deg, #0A1C2E, #122E4A);
    --tv-gradient-text: linear-gradient(100deg, #B07214, #F2B33D);
    --tv-gradient-media: linear-gradient(to top, rgba(8, 24, 42, 0.82), transparent 58%);
    --tv-gradient-hero-overlay: linear-gradient(120deg, rgba(8, 24, 42, 0.88), rgba(18, 46, 74, 0.55));
}

html[data-theme=dark] {
    --tv-primary: #F6BE58;
    --tv-primary-dark: #FFD48A;
    --tv-secondary: rgba(246, 190, 88, 0.12);
    --tv-accent: #F6BE58;
    --tv-info: #8EB4DA;
    --tv-text-dark: #FFFFFF;
    --tv-text-light: #C3CFDC;
    --tv-placeholder: #8EA1B5;
    --tv-bg: #0E2439;
    --tv-surface: #122E4A;
    --tv-surface-2: #17375A;
    --tv-section-bg: #0F2741;
    --tv-border: #2B4C6E;
    --tv-primary-50: rgba(246, 190, 88, 0.10);
    --tv-primary-100: rgba(246, 190, 88, 0.16);
    --tv-primary-200: rgba(246, 190, 88, 0.40);
    --tv-primary-soft: rgba(246, 190, 88, 0.14);
    --tv-on-brand: #FFFFFF;
    --tv-on-gold: #10263D;
    --tv-contrast-text: #F6BE58;
    --tv-inverse: #0A1C2E;   /* footer stays darkest navy, with light text */
    --tv-deep: #0A1C2E;
    --tv-overlay: #071523;
    --tv-badge-accent: #F6BE58;
    --tv-selection-bg: rgba(246, 190, 88, 0.35);
    --tv-selection-text: #FFFFFF;
    --tv-shadow: 0 8px 24px rgba(3, 12, 24, 0.35);
    --tv-shadow-md: 0 12px 32px rgba(3, 12, 24, 0.40);
    --tv-shadow-lg: 0 24px 60px rgba(3, 12, 24, 0.50);
    --tv-shadow-brand: 0 10px 26px rgba(246, 190, 88, 0.22);
    --tv-shadow-brand-hover: 0 16px 36px rgba(246, 190, 88, 0.32);
    --tv-shadow-focus: 0 0 0 0.2rem rgba(246, 190, 88, 0.22);
    --tv-shadow-focus-button: 0 0 0 0.25rem rgba(246, 190, 88, 0.22);
    --tv-shadow-ring: 0 0 0 4px rgba(246, 190, 88, 0.2);
    --tv-gradient-brand: linear-gradient(135deg, #FFD48A, #F6BE58);
    --tv-gradient-brand-reverse: linear-gradient(150deg, #F6BE58, #FFD48A);
    --tv-gradient-accent: linear-gradient(135deg, #FFD48A, #F6BE58);
    --tv-gradient-page: linear-gradient(120deg, #0A1C2E, #122E4A);
    --tv-gradient-deep: linear-gradient(135deg, #071523, #10294A);
    --tv-gradient-text: linear-gradient(100deg, #F6BE58, #FFE3B0);
    --tv-gradient-media: linear-gradient(to top, rgba(7, 21, 35, 0.85), transparent 58%);
    --tv-gradient-hero-overlay: linear-gradient(120deg, rgba(7, 21, 35, 0.9), rgba(18, 46, 74, 0.6));
}

/* The stock dark-mode sheet hardcodes its blue/navy surfaces; bring them in line. */
html[data-theme=dark] body { background: #0E2439; color: #F1F5F9; }
html[data-theme=dark] :is(.section--tint, .bg-tint, .newsletter, .dash, .prose blockquote, .prose .toc, .dash-table th) { background: #0F2741 !important; }
html[data-theme=dark] :is(.card, .service-card, .review-card, .enquiry-card, .job-card, .search-widget, .site-header, .mega-menu, .nav-dropdown, .lang-switch .lang-menu, .mobile-drawer, .dash-sidebar, .dash-topbar, .dash-stat, .panel, .accordion-item, .accordion-button) { background-color: #122E4A; border-color: #2B4C6E; }
html[data-theme=dark] :is(.form-control, .form-select) { background-color: #17375A; border-color: #2B4C6E; }
html[data-theme=dark] :is(.form-control, .form-select):focus { background-color: #17375A; border-color: #F6BE58; box-shadow: 0 0 0 .2rem rgba(246, 190, 88, .18); }

/* Typography: Tajawal for body, Alexandria (Arabic) / Inter (English) for headings — clean and modern. */
body, .form-control, .form-select, input, select, textarea, button {
    font-family: "Tajawal", "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
}
h1, h2, h3, h4, h5, h6, .display-1, .display-2, .display-3, .display-4, .display-5, .display-6, .fw-display, .section-head h2 {
    font-family: "Alexandria", "Inter", "Tajawal", system-ui, sans-serif;
    font-weight: 700;
    letter-spacing: -0.015em;
}
.btn, .eyebrow-text, .section-head .eyebrow {
    font-family: "Tajawal", "Inter", system-ui, sans-serif;
}
[dir=rtl] :is(h1, h2, h3, h4, h5, h6, .display-1, .display-2, .display-3, .display-4, .display-5, .display-6) {
    letter-spacing: 0;
    line-height: 1.35;
}

/* Amber fills carry navy text (--tv-on-gold). */
.btn-brand, .btn-brand:hover, .btn-brand:focus, .btn-outline-brand:hover, .section--brand,
.service-card:hover .sc-icon, .scroll-top:hover,
.flatpickr-day.selected, .flatpickr-day.startRange, .flatpickr-day.endRange, .flatpickr-day.today:hover {
    color: var(--tv-on-gold) !important;
}

/* Finishing touches */
.btn-brand { font-weight: 700; letter-spacing: .01em; }
.btn-brand:hover { filter: brightness(1.04); }
.badge-tv.is-accent, .section-head .eyebrow { background: var(--tv-primary-soft); color: var(--tv-primary-dark); border-color: transparent; }
.site-header .main-nav .nav-link:hover, .site-header .main-nav .nav-link.active { color: var(--tv-primary-dark); }
.search-widget { border-top: 3px solid var(--tv-primary); }
::selection { background: var(--tv-selection-bg); color: var(--tv-selection-text); }

/* Contrast: anything on a light surface uses dark text, anything on a dark
   surface uses light text — in both themes. */
:root { --tv-card-bg: #FFFFFF; --tv-card-text: #0E2439; --tv-card-muted: #536579; --tv-menu-hover: #F2F5F9; }
html[data-theme=dark] { --tv-card-bg: #122E4A; --tv-card-text: #F1F5F9; --tv-card-muted: #C3CFDC; --tv-menu-hover: #163A5C; }

/* Flight search: results, filters and the airport suggestions list */
.dfr-card, .dff, .dfs-ac-list { background: var(--tv-card-bg) !important; color: var(--tv-card-text) !important; border-color: var(--tv-border) !important; }
.dfr-card .text-muted, .dff .text-muted, .dff label small, .dff h6, .dff-count, .dfr-mid { color: var(--tv-card-muted) !important; }
.dfs-ac-list div { color: var(--tv-card-text); }
.dfs-ac-list div:hover { background: var(--tv-menu-hover); }
.dfr-card details, .dfr-card .border-top { border-color: var(--tv-border) !important; }

/* Native dropdown lists and pop-ups follow the theme */
select option, select optgroup { background: var(--tv-card-bg); color: var(--tv-card-text); }
.select2-container .select2-dropdown, .select2-results__option { background: var(--tv-card-bg); color: var(--tv-card-text); }
.select2-container--bootstrap-5 .select2-results__option--highlighted, .select2-results__option--highlighted { background: var(--tv-primary) !important; color: var(--tv-on-gold) !important; }
html[data-theme=dark] .flatpickr-calendar, html[data-theme=dark] .flatpickr-months .flatpickr-month,
html[data-theme=dark] .flatpickr-weekdays, html[data-theme=dark] span.flatpickr-weekday { background: #122E4A; color: #F1F5F9; fill: #F1F5F9; }
html[data-theme=dark] .flatpickr-day { color: #F1F5F9; }
html[data-theme=dark] .flatpickr-day.flatpickr-disabled, html[data-theme=dark] .flatpickr-day.prevMonthDay, html[data-theme=dark] .flatpickr-day.nextMonthDay { color: #536579; }
html[data-theme=dark] .flatpickr-day:hover { background: #163A5C; border-color: #163A5C; }
html[data-theme=dark] .dropdown-menu { background: #122E4A; border-color: #2B4C6E; }
html[data-theme=dark] .dropdown-menu .dropdown-item { color: #F1F5F9; }
html[data-theme=dark] .dropdown-menu .dropdown-item:hover { background: #163A5C; color: #F6BE58; }

/* New TENT logo — Arabic version (partials/tent-logo-ar). */
.tent-ar { --tent-ink: #122E4A; --tent-paper: #F6BE58; --tent-mark: #122E4A; display: inline-flex; align-items: center; gap: calc(var(--tent-h) * .26); direction: rtl; line-height: 1; white-space: nowrap; }
.tent-ar__icon { width: var(--tent-h); height: var(--tent-h); flex: none; display: block; }
.tent-ar__box { fill: var(--tent-paper); }
.tent-ar__mark { fill: var(--tent-mark); }
.tent-ar__name { font-family: "Alexandria", "Tajawal", sans-serif; font-weight: 900; font-size: calc(var(--tent-h) * .86); color: var(--tent-ink); letter-spacing: 0; }
.tent-ar--light, html[data-theme=dark] .tent-ar--auto { --tent-ink: #FFFFFF; --tent-paper: #F6BE58; --tent-mark: #122E4A; }

/* Phones: wide row gutters (g-5) stuck out past the container and let the
   page slide sideways (seen on iPhone). Narrow them and clip any overflow. */
@media (max-width: 767.98px) { .row.g-5, .row.gx-5 { --bs-gutter-x: 1.5rem; } }
html, body { overflow-x: clip; }

/* Home hero: the TENT tent mark, large and faint, in the corner opposite the
   text. Drawn in CSS so it stays sharp and sits over whatever slider photo is
   chosen in CMS → Sliders. The door is cut out so the photo shows through. */
.hero::before {
    content: "";
    position: absolute;
    top: -6%;
    inset-inline-end: -5%;
    width: min(44vw, 560px);
    aspect-ratio: 1;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 76 76'%3E%3Cpath fill='%23F1F5F9' fill-rule='evenodd' d='M38 20.75 L58.12 55.25 L17.88 55.25 Z M38 36.56 L46.62 55.25 L29.38 55.25 Z'/%3E%3C/svg%3E") center / contain no-repeat;
    opacity: .10;
    pointer-events: none;
    z-index: 0;
}
.hero > .container { z-index: 1; }
@media (max-width: 767.98px) {
    .hero::before { top: -4%; inset-inline-end: -18%; width: 78vw; opacity: .07; }
}


/* Home hero, light theme: bright and modern — white with soft amber and steel glows
   instead of the dark photo overlay. The dark theme keeps the photo.
   !important beats the inline CMS-slider background on the section. */
html:not([data-theme=dark]) .hero {
    background:
        radial-gradient(900px 480px at 88% -8%, rgba(246, 190, 88, .28), transparent 62%),
        radial-gradient(760px 420px at -6% 108%, rgba(18, 46, 74, .10), transparent 60%),
        radial-gradient(520px 320px at 50% 40%, rgba(255, 255, 255, .7), transparent 70%),
        linear-gradient(180deg, #FFFFFF 0%, #EEF3F8 100%) !important;
    color: #0E2439;
    border-bottom: 1px solid #E6ECF3;
}
html:not([data-theme=dark]) .hero h1 { color: #0E2439; }
html:not([data-theme=dark]) .hero .hero-sub { color: #536579; }
html:not([data-theme=dark]) .hero .ht-item { color: #122E4A; }
html:not([data-theme=dark]) .hero .ht-item i { color: #B07214; }
/* The faint tent mark, in navy on the light background. */
html:not([data-theme=dark]) .hero::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 76 76'%3E%3Cpath fill='%23122E4A' fill-rule='evenodd' d='M38 20.75 L58.12 55.25 L17.88 55.25 Z M38 36.56 L46.62 55.25 L29.38 55.25 Z'/%3E%3C/svg%3E");
    opacity: .05;
}
html:not([data-theme=dark]) .hero .search-widget { box-shadow: 0 24px 60px rgba(14, 36, 57, .12); border: 1px solid #E6ECF3; }

/* Footer: support line under the tagline. */
.f-support { display: inline-flex; align-items: center; gap: .5rem; font-size: .9rem; font-weight: 600; margin: -.25rem 0 1rem; opacity: .9; }
.f-support i { color: #F6BE58; }

/* Header: Partners menu (agent / supplier portals) next to Login / Register. */
.partner-switch .lang-menu { min-width: 200px; }
.partner-switch .partner-current { display: inline-flex; align-items: center; gap: .4rem; }

/* ---- Form fixes: room for the dropdown arrow (main.css gives selects equal padding on both
   sides, so in Arabic the arrow sat on top of the text) + breadcrumb separator in RTL. ---- */
.form-select { padding-right: 2.4rem; }
[dir=rtl] .form-select { padding-right: .9rem; padding-left: 2.4rem; background-position: left .8rem center; }
.form-select.form-select-sm { padding-right: 2rem; }
[dir=rtl] .form-select.form-select-sm { padding-right: .6rem; padding-left: 2rem; background-position: left .6rem center; }
html[data-theme=dark] .form-select { --bs-form-select-bg-img: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23F6BE58' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e"); }
[dir=rtl] .breadcrumb-item + .breadcrumb-item { padding-left: 0; padding-right: .5rem; }
[dir=rtl] .breadcrumb-item + .breadcrumb-item::before { float: right; padding-right: 0; padding-left: .5rem; }

/* ===== Night & Amber: finishing touches and gentle motion ===== */
/* Amber fills always get navy text; selected days / options use the bright amber. */
.flatpickr-day.selected, .flatpickr-day.startRange, .flatpickr-day.endRange,
.select2-container--bootstrap-5 .select2-results__option--highlighted, .select2-results__option--highlighted {
    background: #F6BE58 !important; border-color: #F6BE58 !important; color: #10263D !important;
}
.search-widget { border-top-color: #F6BE58; }
.section-head .eyebrow, .badge-tv.is-accent { color: var(--tv-primary-dark); }

/* Header: frosted glass while scrolling */
.site-header { backdrop-filter: saturate(160%) blur(14px); -webkit-backdrop-filter: saturate(160%) blur(14px); }
.site-header .main-nav .nav-link { position: relative; }
.site-header .main-nav .nav-link::after { content: ""; position: absolute; inset-inline: .75rem; bottom: .2rem; height: 2px; border-radius: 2px; background: #F6BE58; transform: scaleX(0); transition: transform .25s ease; }
.site-header .main-nav .nav-link:hover::after, .site-header .main-nav .nav-link.active::after { transform: scaleX(1); }

/* Buttons: lift + a light sweep across amber buttons */
.btn { transition: transform .2s ease, box-shadow .2s ease, background-color .2s ease, color .2s ease; }
.btn-brand { position: relative; overflow: hidden; }
.btn-brand::before { content: ""; position: absolute; top: 0; bottom: 0; width: 45%; inset-inline-start: -70%; background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .55), transparent); transform: skewX(-20deg); transition: inset-inline-start .7s ease; pointer-events: none; }
.btn-brand:hover::before { inset-inline-start: 130%; }
.btn-brand:hover, .btn-outline-brand:hover, .btn-soft:hover { transform: translateY(-2px); }

/* Cards: lift, amber edge and a slow photo zoom on hover */
:is(.card, .service-card, .review-card, .package-card, .pc, .st-card, .dfr-card, .es-plan, .hotel-card) { transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease; }
:is(.service-card, .package-card, .pc, .st-card, .hotel-card, .es-plan):hover { transform: translateY(-6px); box-shadow: var(--tv-shadow-lg); border-color: rgba(246, 190, 88, .55) !important; }
:is(.package-card, .pc, .st-card, .hotel-card) :is(img, .st-img, .pc-img) { transition: transform .7s ease; }
:is(.package-card, .pc, .st-card, .hotel-card):hover :is(img, .st-img, .pc-img) { transform: scale(1.05); }
.st-card .st-img { overflow: hidden; }

/* Fields: soft amber glow */
.form-control, .form-select { transition: border-color .2s ease, box-shadow .2s ease; }
.form-control:hover, .form-select:hover { border-color: rgba(246, 190, 88, .7); }
.form-control:focus, .form-select:focus { border-color: #F6BE58; box-shadow: 0 0 0 4px rgba(246, 190, 88, .22); }

/* Search tabs: amber pill for the active tab */
.search-widget .search-tabs .stab { transition: background .2s ease, color .2s ease; }
.search-widget .search-tabs .stab.active { background: #F6BE58; color: #10263D; }

/* Page headers: slow drifting amber glow */
.page-hero { position: relative; overflow: hidden; }
.page-hero::after { content: ""; position: absolute; width: 460px; height: 460px; border-radius: 50%; top: -180px; inset-inline-end: -120px; background: radial-gradient(circle, rgba(246, 190, 88, .22), transparent 65%); animation: tent-drift 16s ease-in-out infinite; pointer-events: none; }
@keyframes tent-drift { 50% { transform: translate(-40px, 30px) scale(1.1); } }

/* Respect "reduce motion" */
@media (prefers-reduced-motion: reduce) {
    .btn-brand::before, .page-hero::after { display: none; }
    :is(.btn, .card, .service-card, .package-card, .pc, .st-card, .hotel-card, .es-plan), :is(.package-card, .pc, .st-card, .hotel-card) :is(img, .st-img, .pc-img) { transition: none !important; transform: none !important; }
}

/* ===== Date picker (flatpickr) — TENT calendar ===== */
.flatpickr-calendar.tn-cal { width: auto !important; padding: 14px; border: 1px solid var(--tv-border); border-radius: 20px; background: var(--tv-card-bg); box-shadow: 0 24px 60px rgba(14, 36, 57, .20); font-family: "Tajawal", "Inter", sans-serif; }
.flatpickr-calendar.tn-cal::before, .flatpickr-calendar.tn-cal::after { display: none; }
.tn-cal .flatpickr-months { align-items: center; margin-bottom: 6px; }
.tn-cal .flatpickr-months .flatpickr-month { height: 44px; color: var(--tv-card-text); fill: var(--tv-card-text); }
.tn-cal .flatpickr-current-month { font-family: "Alexandria", "Inter", sans-serif; font-size: 16px; font-weight: 700; padding-top: 10px; }
.tn-cal .flatpickr-current-month .numInputWrapper { width: 6ch; }
.tn-cal .flatpickr-current-month input.cur-year { font-weight: 700; }
.tn-cal .flatpickr-prev-month, .tn-cal .flatpickr-next-month { position: static !important; width: 38px; height: 38px; padding: 0 !important; display: grid; place-items: center; border-radius: 12px; color: var(--tv-card-text) !important; background: var(--tv-surface-2); transition: background .2s, color .2s; }
.tn-cal .flatpickr-prev-month:hover, .tn-cal .flatpickr-next-month:hover { background: #F6BE58; color: #10263D !important; }
.tn-cal .flatpickr-prev-month i, .tn-cal .flatpickr-next-month i { font-size: 14px; }
.tn-cal .flatpickr-days, .tn-cal .flatpickr-weekdays, .tn-cal .flatpickr-rContainer, .tn-cal .flatpickr-innerContainer { width: auto !important; }
.tn-cal .flatpickr-innerContainer { display: block; }
.tn-cal .flatpickr-days { display: flex; }
.tn-cal .flatpickr-days .dayContainer:not(:last-child), .tn-cal .flatpickr-weekdaycontainer:not(:last-child) { padding-inline-end: 10px; }
/* Arabic: first month, first weekday (Saturday) and the "previous" arrow on the right. */
.tn-cal[dir=rtl] .flatpickr-months, .tn-cal[dir=rtl] .flatpickr-weekdays, .tn-cal[dir=rtl] .flatpickr-weekdaycontainer,
.tn-cal[dir=rtl] .flatpickr-days, .tn-cal[dir=rtl] .dayContainer { direction: rtl; }
.tn-cal .flatpickr-weekdays { height: 34px; }
.tn-cal span.flatpickr-weekday { color: var(--tv-card-muted); font-weight: 700; font-size: 12px; background: transparent; }
.tn-cal .dayContainer { min-width: 294px; max-width: 294px; width: 294px; gap: 2px 0; }
.tn-cal .flatpickr-day { height: 42px; line-height: 42px; max-width: 42px; border-radius: 12px; font-weight: 600; color: var(--tv-card-text); border: 0; transition: background .15s, color .15s; }
.tn-cal .flatpickr-day:hover, .tn-cal .flatpickr-day:focus { background: var(--tv-primary-50); }
.tn-cal .flatpickr-day.today { box-shadow: inset 0 0 0 2px #F6BE58; }
.tn-cal .flatpickr-day.today:hover { background: var(--tv-primary-50); color: var(--tv-card-text); }
.tn-cal .flatpickr-day.selected, .tn-cal .flatpickr-day.selected:hover { background: #F6BE58 !important; color: #10263D !important; box-shadow: 0 6px 16px rgba(246, 190, 88, .45); }
.tn-cal .flatpickr-day.tn-in-range { background: rgba(246, 190, 88, .18); border-radius: 0; }
.tn-cal .flatpickr-day.tn-range-end { background: #122E4A; color: #fff; }
.tn-cal .flatpickr-day.flatpickr-disabled, .tn-cal .flatpickr-day.flatpickr-disabled:hover { color: var(--tv-card-muted); opacity: .35; background: transparent; cursor: not-allowed; }
.tn-cal .flatpickr-day.prevMonthDay, .tn-cal .flatpickr-day.nextMonthDay { visibility: hidden; }
html[data-theme=dark] .tn-cal .flatpickr-day.tn-range-end { background: #FFD48A; color: #10263D; }
html[data-theme=dark] .flatpickr-calendar.tn-cal { box-shadow: 0 24px 60px rgba(3, 12, 24, .6); }
/* The visible field: calendar icon, pointer, comfortable height */
input.tn-date { cursor: pointer; background-color: var(--tv-surface-2); }
.input-icon input.tn-date { background-image: none; }
input.tn-date:not(.input-icon input) { padding-inline-start: 2.6rem !important; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23B07214' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4.5' width='18' height='16' rx='3'/%3E%3Cpath d='M3 9.5h18M8 3v3M16 3v3'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-size: 18px; background-position: left .85rem center; }
[dir=rtl] input.tn-date:not(.input-icon input) { background-position: right .85rem center; }
@media (max-width: 767.98px) {
    .flatpickr-calendar.tn-cal { left: 8px !important; right: 8px !important; margin: 0 auto; max-width: calc(100vw - 16px); padding: 10px; }
    .tn-cal .dayContainer { min-width: 100%; max-width: 100%; width: 100%; }
    .tn-cal .flatpickr-days { width: 100% !important; }
    .tn-cal .flatpickr-day { max-width: 14.28%; flex-basis: 14.28%; height: 44px; line-height: 44px; }
}

/* ===== Home hero: photos that change every 5 seconds ===== */
.hero.has-slides { background: #0A1C2E !important; color: #fff; }
.hero.has-slides::before { display: none; }
.hero-slides { position: absolute; inset: 0; z-index: 0; overflow: hidden; }
.hero-slide { position: absolute; inset: 0; background-size: cover; background-position: center; opacity: 0; transform: scale(1.08); transition: opacity 1.4s ease, transform 6.5s ease-out; }
.hero-slide.on { opacity: 1; transform: scale(1); }
/* Dark navy veil on the text side so the words stay readable on any photo. */
.hero.has-slides::after { content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none;
    background: linear-gradient(to left, rgba(7, 21, 35, .88) 0%, rgba(10, 28, 46, .62) 45%, rgba(10, 28, 46, .18) 100%), linear-gradient(to top, rgba(7, 21, 35, .55), transparent 40%); }
[dir=ltr] .hero.has-slides::after { background: linear-gradient(to right, rgba(7, 21, 35, .88) 0%, rgba(10, 28, 46, .62) 45%, rgba(10, 28, 46, .18) 100%), linear-gradient(to top, rgba(7, 21, 35, .55), transparent 40%); }
.hero.has-slides > .container { position: relative; z-index: 2; }
html:not([data-theme=dark]) .hero.has-slides h1, .hero.has-slides h1 { color: #fff; }
html:not([data-theme=dark]) .hero.has-slides .hero-sub, .hero.has-slides .hero-sub { color: #E6ECF3; }
.hero.has-slides .badge-tv { background: rgba(246, 190, 88, .18); color: #FFD48A; border: 1px solid rgba(246, 190, 88, .45); backdrop-filter: blur(6px); }
.hero.has-slides .text-gradient { background-image: linear-gradient(100deg, #F6BE58, #FFE3B0); }
.hero-dots { position: absolute; z-index: 3; bottom: 18px; inset-inline-start: 50%; transform: translateX(-50%); display: flex; gap: 8px; }
[dir=rtl] .hero-dots { transform: translateX(50%); }
.hero-dots button { width: 34px; height: 5px; padding: 0; border: 0; border-radius: 5px; background: rgba(255, 255, 255, .35); cursor: pointer; overflow: hidden; }
.hero-dots button span { display: block; height: 100%; width: 0; background: #F6BE58; }
.hero-dots button.on span { width: 100%; transition: width 5s linear; }
@media (prefers-reduced-motion: reduce) { .hero-slide { transition: opacity .6s; transform: none !important; } .hero-dots button.on span { transition: none; } }