/* ==========================================================================
   NextRide Global Dark Mode Overrides
   
   WHY THIS FILE EXISTS:
   Blazor CSS isolation (.razor.css files) compiles scoped rules with a
   [b-XXXXXX] attribute selector. Component files that tried to escape scope
   with :global() were using CSS Modules syntax — Blazor does NOT understand
   it, so those :global() rules were silently invalid and ignored by the browser.
   
   All dark mode styles that previously lived inside :global() wrappers have
   been moved here as standard body.dark-mode rules. These intentionally run
   outside CSS isolation scope so they always apply at the page level.
   
   Components with body.dark-mode rules (no :global) in their scoped files:
     – HeroRideCard.razor.css    ✓  (works via scoped [b-xxx] selector)
     – CompactRideCard.razor.css ✓  (works via scoped [b-xxx] selector)
     – WaitTimeBar.razor.css     ✓  (works via scoped [b-xxx] selector)
     – NrBadge.razor.css         ✓  (works via scoped [b-xxx] selector)
   ========================================================================== */


/* ── WhatsNext Page (/whatsnext) ─────────────────────────────────────────── */

body.dark-mode .wn-title {
    color: #f1f5f9;
}

body.dark-mode .wn-subtitle {
    color: #94a3b8;    /* slate-400 – was missing, rendered invisible */
}

body.dark-mode .wn-control-bar {
    background: rgba(30, 41, 59, 0.85);   /* slate-800/85 */
    border-color: rgba(99, 102, 241, 0.20);
}

body.dark-mode .wn-park-select,
body.dark-mode .wn-location__input,
body.dark-mode .wn-location__detect,
body.dark-mode .wn-dev-input {
    background: rgba(15, 23, 42, 0.55);
    border-color: rgba(99, 102, 241, 0.22);
    color: #e2e8f0;
}

body.dark-mode .wn-filters-btn {
    background: rgba(15, 23, 42, 0.45);
    border-color: rgba(99, 102, 241, 0.22);
    color: #94a3b8;
}

body.dark-mode .wn-filters-btn:hover,
body.dark-mode .wn-filters-btn.active {
    border-color: rgba(99, 102, 241, 0.55);
    color: #a5b4fc;
    background: rgba(99, 102, 241, 0.14);
}

body.dark-mode .wn-divider {
    background: rgba(99, 102, 241, 0.18);
}

body.dark-mode .wn-filters-panel,
body.dark-mode .wn-filters-panel__dev {
    border-color: rgba(99, 102, 241, 0.18);
}

body.dark-mode .wn-filter-check {
    color: #94a3b8;
}

body.dark-mode .wn-filter-label {
    color: #94a3b8;
}

body.dark-mode .wn-section-heading__text,
body.dark-mode .wn-insights-title {
    color: #f1f5f9;
}

body.dark-mode .wn-insights-panel {
    background: rgba(30, 41, 59, 0.85);
    border-color: rgba(99, 102, 241, 0.20);
}

body.dark-mode .wn-insights-panel__heading {
    color: #e2e8f0;
}

/* Insight row tinted backgrounds */
body.dark-mode .wn-insight-row--green  { background: rgba(22,  163,  74, 0.14); }
body.dark-mode .wn-insight-row--blue   { background: rgba(37,   99, 235, 0.14); }
body.dark-mode .wn-insight-row--purple { background: rgba(124,  58, 237, 0.14); }

/* Insight row label text */
body.dark-mode .wn-insight-row--green  .wn-insight-row__label { color: #86efac; }
body.dark-mode .wn-insight-row--blue   .wn-insight-row__label { color: #93c5fd; }
body.dark-mode .wn-insight-row--purple .wn-insight-row__label { color: #d8b4fe; }

/* Progress bar track */
body.dark-mode .wn-progress__bar-track {
    background: rgba(99, 102, 241, 0.18);
}

/* Location pill */
body.dark-mode .wn-location__display,
body.dark-mode .wn-location {
    color: #94a3b8;
}

body.dark-mode .wn-filters-panel__location {
    border-color: rgba(99, 102, 241, 0.18);
}

body.dark-mode .wn-location-status {
    color: #64748b;
}

body.dark-mode .wn-filter-section-label {
    color: #64748b;
}

body.dark-mode .wn-location__sep {
    color: #475569;
}

body.dark-mode .wn-template-trigger {
    background: rgba(15, 23, 42, 0.58);
    border-color: rgba(99, 102, 241, 0.24);
    color: #f8fafc;
}

body.dark-mode .wn-template-trigger:hover,
body.dark-mode .wn-template-trigger:focus {
    border-color: rgba(99, 102, 241, 0.60);
}

body.dark-mode .wn-template-trigger__label {
    color: #f8fafc;
}

body.dark-mode .wn-template-chevron {
    color: #94a3b8;
}

body.dark-mode .wn-template-options {
    background: #1e293b;
    border-color: rgba(99, 102, 241, 0.22);
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.42);
}

body.dark-mode .wn-template-option {
    color: #e2e8f0;
}

body.dark-mode .wn-template-option:hover {
    background: rgba(99, 102, 241, 0.16);
    color: #f8fafc;
}

body.dark-mode .wn-template-option.selected {
    background: rgba(99, 102, 241, 0.24);
    color: #c7d2fe;
}

body.dark-mode .wn-template-option.selected span {
    color: #c7d2fe;
}

body.dark-mode .alert.wn-callout--surface,
body.dark-mode .card.wn-callout--surface,
body.dark-mode .alert.wn-callout--info,
body.dark-mode .card.wn-callout--info {
    background: rgba(30, 41, 59, 0.92) !important;
    border-color: rgba(99, 102, 241, 0.22) !important;
    color: #e2e8f0 !important;
    box-shadow: 0 10px 24px rgba(2, 6, 23, 0.24);
}

body.dark-mode .alert.wn-callout--info {
    background: linear-gradient(135deg, rgba(30, 41, 59, 0.96) 0%, rgba(51, 65, 85, 0.94) 100%) !important;
}

body.dark-mode .card.wn-callout--warning,
body.dark-mode .alert.wn-callout--warning {
    background: linear-gradient(135deg, rgba(69, 26, 3, 0.86) 0%, rgba(120, 53, 15, 0.78) 100%) !important;
    border-color: rgba(251, 191, 36, 0.28) !important;
    color: #fef3c7 !important;
}

body.dark-mode .wn-callout--surface .card-body,
body.dark-mode .wn-callout--info .card-body,
body.dark-mode .wn-callout--warning .card-body {
    color: inherit;
}

body.dark-mode .wn-callout--surface .text-muted,
body.dark-mode .wn-callout--info .text-muted,
body.dark-mode .wn-callout--warning .text-muted {
    color: #94a3b8 !important;
}

body.dark-mode .wn-callout--surface a,
body.dark-mode .wn-callout--info a,
body.dark-mode .wn-callout--warning a {
    color: #93c5fd !important;
}

body.dark-mode .wn-callout--surface .bg-light,
body.dark-mode .wn-callout--surface .bg-white {
    background: rgba(15, 23, 42, 0.82) !important;
    border-color: rgba(99, 102, 241, 0.20) !important;
    color: #e2e8f0 !important;
}

body.dark-mode .alert.lcb-banner {
    background: linear-gradient(135deg, rgba(69, 26, 3, 0.88) 0%, rgba(120, 53, 15, 0.76) 100%) !important;
    border-color: rgba(251, 191, 36, 0.28) !important;
    color: #fef3c7 !important;
    box-shadow: 0 12px 28px rgba(2, 6, 23, 0.30);
}

body.dark-mode .lcb-banner__title {
    color: #fde68a;
}

body.dark-mode .lcb-banner__body {
    color: #f8fafc;
}

body.dark-mode .lcb-banner__helper {
    color: #cbd5e1;
}

body.dark-mode .lcb-banner__icon,
body.dark-mode .lcb-banner__close {
    color: #fbbf24;
}


/* ── Legal Pages (/terms, /privacy) ─────────────────────────────────────── */

body.dark-mode .terms-card,
body.dark-mode .privacy-card {
    background: rgba(30, 41, 59, 0.88);
    border-color: rgba(99, 102, 241, 0.18);
    box-shadow: 0 12px 28px rgba(2, 6, 23, 0.26);
}

body.dark-mode .terms-card h2,
body.dark-mode .privacy-card h2,
body.dark-mode .privacy-card h3 {
    color: #f8fafc;
}

body.dark-mode .terms-meta,
body.dark-mode .privacy-meta,
body.dark-mode .terms-note,
body.dark-mode .privacy-note {
    color: #94a3b8;
}

body.dark-mode .terms-card a,
body.dark-mode .privacy-card a {
    color: #93c5fd;
}

body.dark-mode .terms-card a:hover,
body.dark-mode .privacy-card a:hover {
    color: #bfdbfe;
}


/* ── NrTabs Component ────────────────────────────────────────────────────── */

body.dark-mode .nr-tabs__list {
    background: rgba(255, 255, 255, 0.06);
}

body.dark-mode .nr-tabs__trigger--active {
    background: rgba(255, 255, 255, 0.12);
    border-color: rgba(255, 255, 255, 0.10);
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.35);
}


/* ── Sheet (side-drawer) Component ──────────────────────────────────────── */

body.dark-mode .nr-sheet {
    box-shadow: -8px 0 40px rgba(0, 0, 0, 0.5);
}


/* ── EmptyState Component ────────────────────────────────────────────────── */

body.dark-mode .nr-empty__title {
    color: #f1f5f9;
}

body.dark-mode .nr-empty__icon-wrap {
    background: rgba(255, 255, 255, 0.06);
    color: #9ca3af;
}


/* ── Skeleton / Loading shimmer Component ────────────────────────────────── */

body.dark-mode .nr-skeleton {
    background: linear-gradient(
        90deg,
        rgba(255, 255, 255, 0.05) 25%,
        rgba(255, 255, 255, 0.12) 50%,
        rgba(255, 255, 255, 0.05) 75%
    );
    background-size: 200% 100%;
}


/* ── NrTooltip Component ─────────────────────────────────────────────────── */

body.dark-mode .nr-tooltip-wrap::before,
body.dark-mode .nr-tooltip-wrap::after {
    background: #f1f5f9;
    color: #0f172a;
}


/* ── NrAccordionItem Component ───────────────────────────────────────────── */

body.dark-mode .nr-accordion-item {
    border-color: rgba(255, 255, 255, 0.10);
}

body.dark-mode .nr-accordion-item__trigger {
    color: #f1f5f9;
}

body.dark-mode .nr-accordion-item__label {
    color: #f1f5f9;
}

body.dark-mode .nr-accordion-item__chevron {
    color: #94a3b8;
}

body.dark-mode .nr-accordion-item__content {
    color: #cbd5e1;
}


/* ── HeroCardSkeleton Component ──────────────────────────────────────────── */

body.dark-mode .hero-card-skeleton {
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.10), rgba(255, 255, 255, 0.06));
}

body.dark-mode .hero-card-skeleton__inner {
    background: #1e293b;    /* slate-800 */
}


/* ── CompactCardSkeleton Component ──────────────────────────────────────── */

body.dark-mode .compact-card-skeleton {
    background: #1e293b;    /* slate-800 */
    border-color: rgba(255, 255, 255, 0.08);
}


/* ── Premium Page (/premium) ─────────────────────────────────────────────── */

body.dark-mode .premium-page {
    background: #020617;
    color: #ffffff;
}

body.dark-mode .premium-header,
body.dark-mode .premium-cta {
    border-color: #1e293b;
    background: #0f172a;
}

body.dark-mode .premium-back {
    color: #94a3b8;
}

body.dark-mode .premium-back:hover {
    background: #1e293b;
}

body.dark-mode .premium-header h1,
body.dark-mode .premium-feature__title,
body.dark-mode .premium-plan__name,
body.dark-mode .premium-plan__price strong {
    color: #ffffff;
}

body.dark-mode .premium-header p,
body.dark-mode .premium-section-label,
body.dark-mode .premium-includes__title,
body.dark-mode .premium-feature__description,
body.dark-mode .premium-plan__description,
body.dark-mode .premium-plan-disclosure {
    color: #94a3b8;
}

body.dark-mode .premium-hero {
    box-shadow: 0 20px 25px -5px rgba(49, 46, 129, .4), 0 8px 10px -6px rgba(49, 46, 129, .4);
}

body.dark-mode .premium-feature,
body.dark-mode .premium-includes,
body.dark-mode .premium-plan {
    border-color: #1e293b;
    background: #0f172a;
}

body.dark-mode .premium-feature__icon--amber {
    color: #fbbf24;
    background: rgba(120, 53, 15, .3);
}

body.dark-mode .premium-feature__icon--indigo {
    color: #818cf8;
    background: rgba(49, 46, 129, .3);
}

body.dark-mode .premium-feature__icon--emerald {
    color: #34d399;
    background: rgba(6, 78, 59, .3);
}

body.dark-mode .premium-plan--selected {
    border-color: #6366f1;
    background: rgba(49, 46, 129, .2);
}

body.dark-mode .premium-plan__radio {
    border-color: #475569;
}

body.dark-mode .premium-plan--selected .premium-plan__radio {
    border-color: #4f46e5;
    background: #4f46e5;
}

body.dark-mode .premium-plan--selected .premium-plan__name {
    color: #e0e7ff;
}

body.dark-mode .premium-plan--selected .premium-plan__description,
body.dark-mode .premium-plan--selected .premium-plan__price strong {
    color: #c7d2fe;
}

body.dark-mode .premium-plan__renewing,
body.dark-mode .premium-plan__price small {
    color: #64748b;
}

body.dark-mode .premium-include {
    color: #cbd5e1;
}

body.dark-mode .premium-include__check {
    color: #34d399;
    background: rgba(6, 78, 59, .3);
}

body.dark-mode .premium-fine-print {
    color: #475569;
}

body.dark-mode .premium-fine-print__links a {
    color: #a5b4fc;
}

body.dark-mode .premium-status {
    border-color: rgba(129, 140, 248, .4);
    color: #c7d2fe;
    background: rgba(49, 46, 129, .25);
}

body.dark-mode .premium-cta__button {
    box-shadow: 0 10px 15px -3px rgba(49, 46, 129, .3), 0 4px 6px -4px rgba(49, 46, 129, .3);
}


/* ── Location Enable Banner ─────────────────────────────────────────────── */

body.dark-mode .location-enable-banner,
.dark-mode .location-enable-banner {
    border-color: rgba(123, 192, 255, 0.24);
    background: linear-gradient(135deg, rgba(18, 44, 73, 0.92), rgba(10, 28, 50, 0.94));
}

body.dark-mode .location-enable-banner__icon,
.dark-mode .location-enable-banner__icon {
    color: #8ec7ff;
    background: rgba(255, 255, 255, 0.08);
}

body.dark-mode .location-enable-banner__title,
.dark-mode .location-enable-banner__title {
    color: #eff7ff;
}

body.dark-mode .location-enable-banner__copy,
.dark-mode .location-enable-banner__copy {
    color: rgba(239, 247, 255, 0.78);
}

body.dark-mode .location-enable-banner__action,
.dark-mode .location-enable-banner__action {
    background: #8ec7ff;
    color: #0b2340;
}


/* ── Admin Park Map ─────────────────────────────────────────────────────── */

body.dark-mode .admin-map__header p,
body.dark-mode .admin-map__status,
body.dark-mode .admin-map__field,
body.dark-mode .admin-map__summary-label,
body.dark-mode .admin-map__meta,
body.dark-mode .admin-map__detail-kicker,
body.dark-mode .admin-map__row-subtitle {
    color: #94a3b8;
}

body.dark-mode .admin-map__controls,
body.dark-mode .admin-map__summary > div,
body.dark-mode .admin-map__detail,
body.dark-mode .admin-map__list {
    background: rgba(30, 41, 59, 0.94);
    border-color: rgba(148, 163, 184, 0.22);
    color: #e2e8f0;
}

body.dark-mode .admin-map__field .form-select,
body.dark-mode .admin-map__controls .btn,
body.dark-mode .admin-map__check {
    background-color: rgba(15, 23, 42, 0.78);
    border-color: rgba(148, 163, 184, 0.28);
    color: #e2e8f0;
}

body.dark-mode .admin-map__field .form-select:focus,
body.dark-mode .admin-map__controls .btn:focus {
    border-color: #818cf8;
    box-shadow: 0 0 0 0.2rem rgba(129, 140, 248, 0.22);
}

body.dark-mode .admin-map__summary-value,
body.dark-mode .admin-map__detail h4,
body.dark-mode .admin-map__row,
body.dark-mode .admin-map__row-title {
    color: #f8fafc;
}

body.dark-mode .admin-map__row {
    border-bottom-color: rgba(148, 163, 184, 0.14);
}

body.dark-mode .admin-map__row:hover,
body.dark-mode .admin-map__row--selected {
    background: rgba(99, 102, 241, 0.16);
}

body.dark-mode .admin-map__row-wait,
body.dark-mode .admin-map__badge {
    background: rgba(51, 65, 85, 0.95);
    color: #e2e8f0;
}

body.dark-mode .admin-map__badge--good {
    background: rgba(22, 163, 74, 0.24);
    color: #86efac;
}

body.dark-mode .admin-map__badge--poor {
    background: rgba(220, 38, 38, 0.24);
    color: #fca5a5;
}

body.dark-mode .admin-map__badge--closed {
    background: rgba(100, 116, 139, 0.35);
    color: #cbd5e1;
}

body.dark-mode .admin-map__badge--jackpot {
    background: rgba(251, 191, 36, 0.24);
    color: #fde68a;
}

body.dark-mode .park-map__fallback,
body.dark-mode .admin-map__empty {
    background: rgba(15, 23, 42, 0.86);
    border-color: rgba(148, 163, 184, 0.35);
    color: #e2e8f0;
}

body.dark-mode .park-map__fallback-body {
    color: #94a3b8;
}

body.dark-mode .park-map-info {
    color: #f8fafc;
}

body.dark-mode .park-map-info__meta {
    color: #cbd5e1;
}

body.dark-mode .park-map-info__badge {
    background: rgba(148, 163, 184, 0.16);
    color: #f8fafc;
}

body.dark-mode .park-map .gm-style .gm-style-iw-c,
body.dark-mode .park-map .gm-style .gm-style-iw-d {
    background: #0f172a;
    color: #f8fafc;
}

body.dark-mode .park-map .gm-style .gm-style-iw-tc::after {
    background: #0f172a;
}

body.dark-mode .park-map .gm-style .gm-ui-hover-effect > span {
    background-color: #cbd5e1;
}