/* =========================================================================
 * Homz - unified dark mode (loaded after style.css and before page styles).
 * One navy-tinted palette for every page, so the navy brand areas (top bar,
 * hero, footer) and the cards/sections share the same family of colours.
 * Selectors start with html[...] so they win over page-level dark rules.
 * ========================================================================= */
html[data-bs-theme="dark"] {
  --hz-d-bg: #0b1120;        /* page */
  --hz-d-band: #0e1628;      /* alternate sections, navbar */
  --hz-d-card: #141d31;      /* cards, panels */
  --hz-d-raise: #1a2440;     /* inputs, hover, chips */
  --hz-d-line: #263352;      /* borders */
  --hz-d-text: #e8ebf2;
  --hz-d-muted: #a5afc3;
  --hz-d-link: #8db8ff;
  --hz-d-gold: #D9B665;
  --hz-d-green: #4ade80;

  /* existing site tokens (style.css) */
  --bs-body-bg: var(--hz-d-bg);
  --bs-body-color: var(--hz-d-text);
  --bs-secondary-bg: var(--hz-d-card);
  --bs-tertiary-bg: var(--hz-d-band);
  --bs-border-color: var(--hz-d-line);
  --bs-secondary-color: var(--hz-d-muted);
  --bs-emphasis-color: #fff;
  --bs-link-color: var(--hz-d-link);
  --bs-link-hover-color: #b5d0ff;
  --bg-primary: var(--hz-d-bg);
  --bg-secondary: var(--hz-d-band);
  --bg-card: var(--hz-d-card);
  --bg-input: var(--hz-d-raise);
  --border-color: var(--hz-d-line);
  --navbar-bg: var(--hz-d-band);
  --hover-bg: var(--hz-d-raise);
  --text-primary: var(--hz-d-text);
  --text-secondary: var(--hz-d-muted);
  color-scheme: dark;
}
html[data-bs-theme="dark"] body { background: var(--hz-d-bg) !important; color: var(--hz-d-text); }

/* ---- Brand navy blocks: same family as the page, slightly deeper ---- */
html[data-bs-theme="dark"] .hz-topbar,
html[data-bs-theme="dark"] .hz-footer { background: #070d1a !important; }
html[data-bs-theme="dark"] .hz-footer { border-top: 1px solid var(--hz-d-line); }
html[data-bs-theme="dark"] .navbar,
html[data-bs-theme="dark"] .hz-nav { background: var(--hz-d-band) !important; border-bottom: 1px solid var(--hz-d-line); }

/* ---- Generic surfaces ---- */
html[data-bs-theme="dark"] .bg-white,
html[data-bs-theme="dark"] .card,
html[data-bs-theme="dark"] .modal-content,
html[data-bs-theme="dark"] .dropdown-menu,
html[data-bs-theme="dark"] .list-group-item,
html[data-bs-theme="dark"] .accordion-item,
html[data-bs-theme="dark"] .accordion-button,
html[data-bs-theme="dark"] .search-card,
html[data-bs-theme="dark"] .stat-card,
html[data-bs-theme="dark"] .feature-box,
html[data-bs-theme="dark"] .blog-card,
html[data-bs-theme="dark"] .compare-bar,
html[data-bs-theme="dark"] [style*="background:#fff"],
html[data-bs-theme="dark"] [style*="background: #fff"],
html[data-bs-theme="dark"] [style*="background-color:#fff"],
html[data-bs-theme="dark"] [style*="background-color: #fff"],
html[data-bs-theme="dark"] [style*="background: white"],
html[data-bs-theme="dark"] [style*="background:white"] {
  background-color: var(--hz-d-card) !important;
  border-color: var(--hz-d-line) !important;
  color: var(--hz-d-text);
}
html[data-bs-theme="dark"] .bg-light,
html[data-bs-theme="dark"] section.bg-light,
html[data-bs-theme="dark"] [style*="background:#f8f9fa"],
html[data-bs-theme="dark"] [style*="background: #f8f9fa"],
html[data-bs-theme="dark"] [style*="background:#f6f8fb"],
html[data-bs-theme="dark"] [style*="background:#f3f5f8"] { background-color: var(--hz-d-band) !important; }
html[data-bs-theme="dark"] .text-muted,
html[data-bs-theme="dark"] .text-secondary { color: var(--hz-d-muted) !important; }
html[data-bs-theme="dark"] .text-dark { color: var(--hz-d-text) !important; }
html[data-bs-theme="dark"] .border,
html[data-bs-theme="dark"] hr { border-color: var(--hz-d-line) !important; }
html[data-bs-theme="dark"] .table { --bs-table-bg: transparent; --bs-table-color: var(--hz-d-text); --bs-table-border-color: var(--hz-d-line); }

/* ---- Forms ---- */
html[data-bs-theme="dark"] .form-control,
html[data-bs-theme="dark"] .form-select,
html[data-bs-theme="dark"] .input-group-text {
  background-color: var(--hz-d-raise) !important;
  border-color: var(--hz-d-line) !important;
  color: var(--hz-d-text) !important;
}
html[data-bs-theme="dark"] .form-control::placeholder { color: #7f8aa3 !important; }
html[data-bs-theme="dark"] .form-control:focus,
html[data-bs-theme="dark"] .form-select:focus { border-color: var(--hz-d-gold) !important; box-shadow: 0 0 0 .2rem rgba(217,182,101,.18) !important; }
html[data-bs-theme="dark"] .form-label { color: var(--hz-d-muted); }

/* ---- Buttons that were built for light backgrounds ---- */
html[data-bs-theme="dark"] .btn-outline-secondary,
html[data-bs-theme="dark"] .btn-outline-dark { color: var(--hz-d-text) !important; border-color: var(--hz-d-line) !important; }
html[data-bs-theme="dark"] .btn-outline-secondary:hover,
html[data-bs-theme="dark"] .btn-outline-dark:hover { background: var(--hz-d-raise) !important; }
html[data-bs-theme="dark"] .btn-outline-light { color: var(--hz-d-text) !important; border-color: var(--hz-d-line) !important; }
html[data-bs-theme="dark"] .btn-light { background: var(--hz-d-gold) !important; border-color: var(--hz-d-gold) !important; color: #14171c !important; }

/* ---- Text colours that were navy/dark-grey on white ---- */
html[data-bs-theme="dark"] .read-more,
html[data-bs-theme="dark"] .hz-tab-link,
html[data-bs-theme="dark"] .hz-food-card small,
html[data-bs-theme="dark"] .hz-tcity small,
html[data-bs-theme="dark"] .hu-service small { color: var(--hz-d-link) !important; }
html[data-bs-theme="dark"] .hu-step p,
html[data-bs-theme="dark"] .ab-step p,
html[data-bs-theme="dark"] .hz-partners-title,
html[data-bs-theme="dark"] .hz-bcard .s { color: var(--hz-d-muted) !important; }
html[data-bs-theme="dark"] h1, html[data-bs-theme="dark"] h2, html[data-bs-theme="dark"] h3,
html[data-bs-theme="dark"] h4, html[data-bs-theme="dark"] h5, html[data-bs-theme="dark"] h6 { color: inherit; }

/* ---- Homepage pieces ---- */
html[data-bs-theme="dark"] .feature-icon { background: rgba(217,182,101,.12) !important; color: var(--hz-d-gold) !important; }
html[data-bs-theme="dark"] .feature-box:hover .feature-icon { background: var(--hz-d-gold) !important; color: #14171c !important; }
html[data-bs-theme="dark"] .hz-partner {
  background: var(--hz-d-card) !important; border-color: var(--hz-d-line) !important;
  color: color-mix(in srgb, var(--pc, #fff) 45%, #ffffff) !important; box-shadow: none !important;
}
html[data-bs-theme="dark"] .hz-bcard { background: var(--hz-d-card) !important; border-color: var(--hz-d-line) !important; color: var(--hz-d-text) !important; }
html[data-bs-theme="dark"] .hz-bcard .p { color: var(--hz-d-green) !important; }
html[data-bs-theme="dark"] .card-body .badge { color: #14171c !important; }
/* newsletter: a gold slab is too loud at night -> calm panel with gold accents */
html[data-bs-theme="dark"] .newsletter-form { position: relative; }
html[data-bs-theme="dark"] section:has(> .container .newsletter-form),
html[data-bs-theme="dark"] section:has(.newsletter-form):not(footer section) {
  background: var(--hz-d-band) !important; border-top: 1px solid var(--hz-d-line); border-bottom: 1px solid var(--hz-d-line);
}
html[data-bs-theme="dark"] section:has(.newsletter-form) h2 { color: var(--hz-d-gold) !important; }
html[data-bs-theme="dark"] section:has(.newsletter-form) p { color: var(--hz-d-muted) !important; opacity: 1 !important; }

/* ---- Flights page ---- */
html[data-bs-theme="dark"] .hz-tab { color: var(--hz-d-muted); }
html[data-bs-theme="dark"] .hz-tab.active { color: #fff; }
html[data-bs-theme="dark"] .hz-live-frame { background: var(--hz-d-card) !important; border-color: var(--hz-d-line) !important; }
html[data-bs-theme="dark"] .hz-live-loading,
html[data-bs-theme="dark"] .hz-live-blocked { background: var(--hz-d-raise) !important; color: var(--hz-d-text) !important; }

/* ---- Partner frames (they stay light inside): frame them so they look intentional ---- */
html[data-bs-theme="dark"] .hz-map,
html[data-bs-theme="dark"] .hz-live-frame { background: var(--hz-d-card) !important; border: 1px solid var(--hz-d-line) !important; box-shadow: 0 10px 30px rgba(0,0,0,.35); }
html[data-bs-theme="dark"] iframe { color-scheme: light; }

/* ---- 404 / misc ---- */
html[data-bs-theme="dark"] .nf-links a { background: var(--hz-d-card) !important; border-color: var(--hz-d-line) !important; color: var(--hz-d-text) !important; }
html[data-bs-theme="dark"] .hz-icon-btn.active { background: var(--hz-d-raise) !important; color: var(--hz-d-gold) !important; }
html[data-bs-theme="dark"] .author-avatar { background: var(--hz-d-raise) !important; }

/* ---- Date picker ---- */
html[data-bs-theme="dark"] .flatpickr-calendar { background: var(--hz-d-card); border: 1px solid var(--hz-d-line); box-shadow: 0 14px 36px rgba(0,0,0,.5); }
html[data-bs-theme="dark"] .flatpickr-calendar.arrowTop:before,
html[data-bs-theme="dark"] .flatpickr-calendar.arrowTop:after { border-bottom-color: var(--hz-d-card); }
html[data-bs-theme="dark"] .flatpickr-calendar.arrowBottom:before,
html[data-bs-theme="dark"] .flatpickr-calendar.arrowBottom:after { border-top-color: var(--hz-d-card); }
html[data-bs-theme="dark"] .flatpickr-months .flatpickr-month,
html[data-bs-theme="dark"] .flatpickr-current-month .flatpickr-monthDropdown-months,
html[data-bs-theme="dark"] .flatpickr-current-month input.cur-year,
html[data-bs-theme="dark"] span.flatpickr-weekday,
html[data-bs-theme="dark"] .flatpickr-months .flatpickr-prev-month,
html[data-bs-theme="dark"] .flatpickr-months .flatpickr-next-month { color: var(--hz-d-text); fill: var(--hz-d-text); background: transparent; }
html[data-bs-theme="dark"] .flatpickr-current-month .flatpickr-monthDropdown-months option { background: var(--hz-d-card); }
html[data-bs-theme="dark"] .flatpickr-day { color: var(--hz-d-text); }
html[data-bs-theme="dark"] .flatpickr-day:hover { background: var(--hz-d-raise); border-color: var(--hz-d-raise); }
html[data-bs-theme="dark"] .flatpickr-day.today { border-color: var(--hz-d-gold); }
html[data-bs-theme="dark"] .flatpickr-day.flatpickr-disabled,
html[data-bs-theme="dark"] .flatpickr-day.prevMonthDay,
html[data-bs-theme="dark"] .flatpickr-day.nextMonthDay { color: #4c587a; }
html[data-bs-theme="dark"] .flatpickr-day.inRange { background: var(--hz-d-raise); border-color: var(--hz-d-raise); box-shadow: -5px 0 0 var(--hz-d-raise), 5px 0 0 var(--hz-d-raise); }
html[data-bs-theme="dark"] .flatpickr-day.selected,
html[data-bs-theme="dark"] .flatpickr-day.startRange,
html[data-bs-theme="dark"] .flatpickr-day.endRange { background: var(--hz-d-gold); border-color: var(--hz-d-gold); color: #14171c; }
html[data-bs-theme="dark"] .hz-fare { color: var(--hz-d-muted); }
html[data-bs-theme="dark"] .flatpickr-day.hz-cheap .hz-fare { color: var(--hz-d-green); }
html[data-bs-theme="dark"] .flatpickr-day.selected .hz-fare,
html[data-bs-theme="dark"] .flatpickr-day.startRange .hz-fare,
html[data-bs-theme="dark"] .flatpickr-day.endRange .hz-fare { color: #14171c; }

/* ---- Autocomplete dropdown ---- */
html[data-bs-theme="dark"] .hz-ac { background: var(--hz-d-card) !important; border-color: var(--hz-d-line) !important; color: var(--hz-d-text) !important; }
html[data-bs-theme="dark"] .hz-ac-item:hover,
html[data-bs-theme="dark"] .hz-ac-item.active { background: var(--hz-d-raise) !important; }

/* ---- Mobile bottom nav ---- */
html[data-bs-theme="dark"] .hz-bottom-nav { background: rgba(14,22,40,.97) !important; border-color: var(--hz-d-line) !important; }
html[data-bs-theme="dark"] .hz-bottom-nav a { color: var(--hz-d-muted); }
html[data-bs-theme="dark"] .hz-bottom-nav a.active { color: #fff; }

/* ---- Gold buttons keep their gold everywhere (some containers cleared it) ---- */
html[data-bs-theme="dark"] .btn-gold { background-color: var(--hz-d-gold) !important; color: #14171c !important; }
html[data-bs-theme="dark"] .btn-gold:hover { background-color: var(--hz-d-card) !important; color: var(--hz-d-gold) !important; border-color: var(--hz-d-gold) !important; }

/* ---- Destination page tabs ---- */
html[data-bs-theme="dark"] .ds-tabs a { color: var(--hz-d-muted); }
html[data-bs-theme="dark"] .ds-tabs a:hover,
html[data-bs-theme="dark"] .ds-tabs a.active { color: #fff; }

/* ---- Navbar: hamburger icon and logo ---- */
/* Bootstrap already draws light lines in dark mode; the old invert() turned them black */
html[data-bs-theme="dark"] .navbar-toggler-icon {
  filter: none !important;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(232,235,242,0.92)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") !important;
}
html[data-bs-theme="dark"] .navbar-toggler { border-color: var(--hz-d-line) !important; background: var(--hz-d-card); }
html[data-bs-theme="dark"] .navbar-toggler:focus { box-shadow: 0 0 0 .18rem rgba(217,182,101,.35) !important; }
/* the dark logo file has its own dark square behind it: blend it into the navbar */
html[data-bs-theme="dark"] .logo-dark { mix-blend-mode: lighten; }