/**
 * Portal colour theme — light + dark accent recolouring.
 * CSS variables injected via campPortalThemeStyleTag() in index.php (after this file).
 * Light surface overrides scoped to html:not([data-theme="dark"]).
 * Dark accents use html[data-theme="dark"] with separate palette vars.
 */

html:not([data-theme="dark"]) {

    /* ── Loader ── */
    & .loader {
        background:
            radial-gradient(ellipse 85% 65% at 50% 42%, rgba(var(--camp-hero-glow-rgb), 0.16) 0%, transparent 58%),
            linear-gradient(165deg, var(--camp-hero-from) 0%, var(--camp-hero-mid) 42%, var(--camp-hero-to) 100%) !important;
    }
    & .loader-topo .topo-map-fill { fill: rgba(var(--camp-hero-glow-rgb), 0.07) !important; }
    & .loader-ring--spin {
        border-top-color: color-mix(in srgb, var(--camp-brand-primary-light) 85%, white) !important;
        border-right-color: rgba(var(--camp-hero-glow-rgb), 0.35) !important;
    }
    & .loader-foot .status { color: color-mix(in srgb, var(--camp-brand-primary-light) 88%, white) !important; }
    & .loader-track span {
        background: linear-gradient(90deg, transparent, var(--camp-brand-primary-light), color-mix(in srgb, var(--camp-brand-primary-light) 75%, white), transparent) !important;
    }
    & .loader-portal__spinner {
        border-color: rgba(var(--camp-hero-glow-rgb), 0.22) !important;
        border-top-color: var(--camp-brand-primary-light) !important;
    }
    & .loader-portal__title { color: color-mix(in srgb, var(--camp-brand-primary-dark) 72%, transparent) !important; }

    /* ── Sidebar & heroes ── */
    & #router #sidebarMenu.sidebar,
    & .sidebar {
        background:
            radial-gradient(ellipse 80% 40% at 50% 0%, rgba(var(--camp-hero-glow-rgb), 0.08) 0%, transparent 60%),
            linear-gradient(180deg, var(--camp-sidebar-from) 0%, var(--camp-sidebar-mid) 55%, var(--camp-sidebar-to) 100%) !important;
    }
    & .sidebar .nav-link.active {
        background: rgba(var(--camp-hero-glow-rgb), 0.18) !important;
        box-shadow: inset 3px 0 0 rgba(var(--camp-hero-glow-rgb), 0.6) !important;
    }
    & .portal-hero,
    & .home-hero-1,
    & .topo-card,
    & .welcome-card,
    & .yg-hero {
        background:
            radial-gradient(ellipse 60% 80% at 80% 20%, rgba(var(--camp-hero-glow-rgb), 0.15) 0%, transparent 50%),
            linear-gradient(135deg, var(--camp-hero-from) 0%, var(--camp-hero-mid) 45%, var(--camp-brand-primary-light) 100%) !important;
    }
    & .site-navbar.scrolled,
    & body.logged-in .site-navbar,
    & body.logged-in .site-navbar.scrolled {
        background: rgba(var(--camp-navbar-rgb), 0.96) !important;
    }
    & body.route-login .site-navbar {
        background: rgba(var(--camp-navbar-mobile-rgb), 0.98) !important;
    }
    & .site-navbar .nav-mobile-menu {
        background: rgba(var(--camp-navbar-mobile-rgb), 0.99) !important;
    }
    & .portal-hero,
    & .portal-hero-topo,
    & .portal-hero:not(.portal-hero--yellow),
    & .home-hero {
        background:
            radial-gradient(ellipse 70% 55% at 50% 40%, rgba(var(--camp-hero-glow-rgb), 0.12) 0%, transparent 55%),
            linear-gradient(165deg, var(--camp-hero-from) 0%, var(--camp-hero-mid) 40%, var(--camp-hero-to) 72%, var(--camp-hero-from) 100%) !important;
    }
    @media (max-width: 767.98px) {
        & .site-navbar {
            background: rgba(var(--camp-navbar-mobile-rgb), 0.98) !important;
        }
    }
    & .glv-hub-promo {
        background:
            radial-gradient(ellipse 50% 80% at 100% 0%, rgba(var(--camp-hero-glow-rgb), 0.12) 0%, transparent 55%),
            linear-gradient(135deg, var(--camp-hero-mid) 0%, var(--camp-brand-primary-mid) 50%, var(--camp-brand-primary) 100%) !important;
        border-color: rgba(var(--camp-hero-glow-rgb), 0.25) !important;
    }

    /* ── Page tabs bar (themed strip; tab chips stay neutral) ── */
    & .page-tabs-bar {
        background: linear-gradient(180deg, color-mix(in srgb, var(--camp-brand-primary) 6%, white) 0%, color-mix(in srgb, var(--camp-brand-primary) 10%, white) 100%) !important;
        border-bottom-color: rgba(var(--camp-brand-primary-rgb), 0.14) !important;
        box-shadow: 0 2px 8px color-mix(in srgb, var(--camp-hero-from) 6%, transparent) !important;
    }
    & .page-tab {
        border-color: #e2e8f0 !important;
        background: rgba(255, 255, 255, 0.72) !important;
    }
    & .page-tab--active {
        border-color: var(--camp-brand-primary-dark) !important;
        box-shadow: 0 1px 4px rgba(var(--camp-hero-glow-rgb), 0.28) !important;
        background: linear-gradient(135deg, var(--camp-brand-primary) 0%, var(--camp-brand-primary-dark) 100%) !important;
    }
    & .page-tab__link {
        color: #64748b !important;
    }
    & .page-tab--active .page-tab__link {
        color: #fff !important;
    }
    & .page-tab__tag {
        background: #e2e8f0 !important;
        color: #64748b !important;
    }
    & .page-tab--active .page-tab__tag {
        background: rgba(255, 255, 255, 0.2) !important;
        color: rgba(255, 255, 255, 0.92) !important;
    }
    & .page-tab--active .page-tab__close {
        color: rgba(255, 255, 255, 0.65) !important;
    }
    & .page-tabs-scroll { scrollbar-color: rgba(100, 116, 139, 0.35) transparent !important; }
    & .page-tabs-scroll::-webkit-scrollbar-thumb { background: rgba(100, 116, 139, 0.35) !important; }

    /* ── Panel chevrons ── */
    & .portal-panel-chevron,
    & .yg-panel-chevron,
    & .sh-panel-chevron,
    & .yg-section-chevron { color: var(--camp-brand-primary) !important; }

    /* ── Page titles & headings ── */
    & #router .page-title,
    & #router h1.page-title,
    & #router .entries-card-header,
    & #router .add-panel h6,
    & #router .ann-markdown .ann-md-h1,
    & #router .ann-markdown .ann-md-h2 {
        color: var(--camp-brand-primary-dark) !important;
    }
    & #router .page-title i,
    & #router .page-title .bi,
    & #router h1.page-title i,
    & #router h1.page-title .bi {
        color: var(--camp-brand-primary) !important;
    }

    /* ── Primary buttons & actions ── */
    & .btn-add,
    & .btn-post,
    & .btn-auto-slot,
    & .btn-sched-child-assign,
    & .btn-topo-primary,
    & .tn-btn-primary,
    & #router .btn-add,
    & #router .btn-post,
    & #router .group-tab.active,
    & #router .yg-jump-btn.active,
    & #router .sh-jump-btn.active,
    & #router .yg-section-filter.active,
    & #router .sh-presence-filter.active,
    & #router .widget-picker-toggle.is-on,
    & #router .type-tab.active {
        background: linear-gradient(135deg, var(--camp-brand-primary) 0%, var(--camp-brand-primary-dark) 100%) !important;
        border-color: var(--camp-brand-primary) !important;
        color: #fff !important;
    }
    & .btn-add:hover,
    & .btn-post:hover,
    & #router .widget-picker-toggle.is-on:hover,
    & #router .group-tab.active:hover {
        background: linear-gradient(135deg, var(--camp-brand-primary-mid) 0%, var(--camp-brand-primary-dark) 100%) !important;
        border-color: var(--camp-brand-primary-dark) !important;
    }

    /* ── Outline / secondary brand buttons ── */
    & #router .btn-match,
    & #router .btn-ann-mini:hover,
    & #router .btn-ann-action:hover,
    & #router .btn-customize-dash:hover,
    & #router .quick-action:hover,
    & #router .yg-quick-link:hover,
    & #router .sh-quick-link:hover {
        border-color: var(--camp-brand-primary) !important;
        color: var(--camp-brand-primary) !important;
    }
    & #router .type-tab:hover,
    & #router .type-tab.active,
    & #router .ann-filter-list button.ann-filter-btn.active {
        color: var(--camp-brand-primary) !important;
        border-bottom-color: var(--camp-brand-primary) !important;
    }
    & #router .type-tab.active {
        background: color-mix(in srgb, var(--camp-brand-primary) 6%, white) !important;
    }

    /* ── Stats & numbers ── */
    & #router .stat-val,
    & #router .stat-num,
    & #router .yg-stat .num,
    & #router .sh-stat .num,
    & #router .group-reg-detail-stat .val,
    & #router .session-pill {
        color: var(--camp-brand-primary-dark) !important;
    }

    /* ── Cards & panels ── */
    & #router .add-panel,
    & #router .composer {
        border-top-color: var(--camp-brand-primary) !important;
    }
    & #router .entries-card-header,
    & #router .add-panel h6,
    & #router .composer-toggle {
        color: var(--camp-brand-primary-dark) !important;
    }
    & #router .add-panel h6 i,
    & #router .composer-toggle i {
        color: var(--camp-brand-primary) !important;
    }

    /* ── Announcements ── */
    & .ann-widget-avatar,
    & .ann-avatar,
    & #router .ann-avatar {
        background: linear-gradient(135deg, var(--camp-brand-primary), var(--camp-brand-primary-dark)) !important;
    }
    & .ann-widget-item.is-pinned {
        background: rgba(var(--camp-brand-primary-rgb), 0.03) !important;
    }
    & #router .ann-markdown .ann-md-h3 { color: var(--camp-brand-primary) !important; }
    & #router .ann-card.pinned { border-left-color: var(--camp-brand-primary) !important; }

    /* ── Focus rings ── */
    & #router .form-control:focus,
    & #router .form-select:focus,
    & #router textarea:focus,
    & #router .yg-search:focus,
    & #router .sh-search:focus,
    & #router .reg-search:focus,
    & #router .camp-search-widget input:focus,
    & #router .composer textarea:focus,
    & .form-control:focus,
    & .form-select:focus {
        border-color: var(--camp-brand-primary) !important;
        box-shadow: 0 0 0 3px color-mix(in srgb, var(--camp-brand-primary) 12%, transparent) !important;
    }

    /* ── Accent / checkbox ── */
    & #router input[type="checkbox"],
    & #router input[type="radio"],
    & .dm-page-toggle input,
    & .act-auto-opt input {
        accent-color: var(--camp-brand-primary) !important;
    }

    /* ── Light brand-tint backgrounds ── */
    & #router .widget-picker-toggle,
    & #router .yg-jump-btn,
    & #router .sh-jump-btn,
    & #router .btn-customize-dash,
    & #router .session-pill,
    & #router .widget-picker-level,
    & #router .dm-portal-summary {
        background: color-mix(in srgb, var(--camp-brand-primary) 8%, white) !important;
        color: var(--camp-brand-primary-dark) !important;
    }
    & #router .portal-panel-header-toggle:hover,
    & #router .yg-card-header-toggle:hover,
    & #router .sh-card-header-toggle:hover,
    & #router .quick-action:hover,
    & #router .widget-move-btn:hover:not(:disabled),
    & #router .yg-move-btn:hover:not(:disabled),
    & #router .sh-move-btn:hover:not(:disabled) {
        background: color-mix(in srgb, var(--camp-brand-primary) 6%, white) !important;
    }

    /* ── Drag handles, dots, icons ── */
    & #router .log-dot,
    & #router .widget-drag-handle:hover,
    & #router .yg-drag-handle:hover,
    & #router .sh-drag-handle:hover,
    & #router .yg-quick-link i,
    & #router .sh-quick-link i,
    & #router .yg-att-day,
    & #router .yg-sched-time,
    & #router .sh-att-day,
    & #router .dash-widget-icon,
    & #router .dash-widget-link {
        color: var(--camp-brand-primary) !important;
    }

    /* ── Inline style overrides (dashboard / page fragments) ── */
    & #router [style*="color:#437037"],
    & #router [style*="color: #437037"],
    & #router [style*="color:#2d4d27"],
    & #router [style*="color: #2d4d27"] {
        color: var(--camp-brand-primary) !important;
    }
    & #router [style*="background:#437037"],
    & #router [style*="background: #437037"],
    & #router [style*="background-color:#437037"],
    & #router [style*="background-color: #437037"] {
        background: var(--camp-brand-primary) !important;
        background-color: var(--camp-brand-primary) !important;
        border-color: var(--camp-brand-primary) !important;
    }
    & #router [style*="linear-gradient(135deg, #437037"],
    & #router [style*="linear-gradient(135deg, #2d4d27"],
    & #router [style*="linear-gradient(135deg, #437037 0%, #2d4d27"] {
        background: linear-gradient(135deg, var(--camp-brand-primary) 0%, var(--camp-brand-primary-dark) 100%) !important;
    }
    & #router [style*="linear-gradient(135deg, #2d4d27 0%, #437037"] {
        background: linear-gradient(135deg, var(--camp-brand-primary-dark) 0%, var(--camp-brand-primary) 45%, var(--camp-brand-primary-light) 100%) !important;
    }

    /* ── Nav tabs (details manager etc.) ── */
    & .nav-tabs .nav-link:hover,
    & .manager-card .nav-tabs .nav-link:hover {
        color: var(--camp-brand-primary) !important;
        background: color-mix(in srgb, var(--camp-brand-primary) 8%, transparent) !important;
    }
    & .nav-tabs .nav-link.active,
    & .manager-card .nav-tabs .nav-link.active {
        color: var(--camp-brand-primary-dark) !important;
    }
    & .day-header,
    & .group-card-header,
    & .edit-card-header {
        color: #fff !important;
        background: linear-gradient(135deg, var(--camp-brand-primary) 0%, var(--camp-brand-primary-dark) 100%) !important;
    }
    & .day-header h3,
    & .day-header .day-date,
    & .group-card-header *,
    & .edit-card-header * {
        color: inherit !important;
    }
    & .mg-modal-header {
        background: linear-gradient(135deg, var(--camp-brand-primary) 0%, var(--camp-brand-primary-dark) 100%) !important;
        color: #fff !important;
    }

    /* ── Universal scout / save buttons ── */
    & .btn-scout,
    & .btn-save,
    & .btn-generate-all,
    & .btn-accept,
    & .btn-view,
    & .btn-register,
    & .qr-btn-scout,
    & .qr-panel-done-btn,
    & .camp-search-widget button,
    & .btn-widget-action {
        background: linear-gradient(135deg, var(--camp-brand-primary) 0%, var(--camp-brand-primary-dark) 100%) !important;
        border-color: var(--camp-brand-primary) !important;
        color: #fff !important;
    }
    & .btn-scout:hover:not(:disabled),
    & .btn-save:hover:not(:disabled),
    & .btn-generate-all:hover,
    & .btn-accept:hover,
    & .btn-view:hover,
    & .btn-register:hover:not(:disabled),
    & .qr-btn-scout:hover,
    & .camp-search-widget button:hover,
    & .btn-widget-action:hover {
        background: linear-gradient(135deg, var(--camp-brand-primary-mid) 0%, var(--camp-brand-primary-dark) 100%) !important;
        color: #fff !important;
    }
    & .btn-scout-outline {
        color: var(--camp-brand-primary) !important;
        border-color: color-mix(in srgb, var(--camp-brand-primary) 35%, white) !important;
    }
    & .btn-scout-outline:hover:not(:disabled) {
        border-color: var(--camp-brand-primary) !important;
        color: var(--camp-brand-primary-dark) !important;
    }

    /* ── Tabs (my tasks, sections, types, links) ── */
    & .my-task-tab.is-active,
    & .section-tab.active,
    & .tn-link-tab.is-active,
    & .tn-cat-tab.is-active,
    & .bulk-chip.active {
        background: var(--camp-brand-primary) !important;
        border-color: var(--camp-brand-primary) !important;
        color: #fff !important;
    }
    & .my-task-tab,
    & .section-tab,
    & .tn-link-tab,
    & .tn-cat-tab,
    & .bulk-chip {
        color: var(--camp-brand-primary) !important;
    }
    & .tn-cat-tab-group:has(.tn-cat-tab.is-active) {
        background: rgba(var(--camp-brand-primary-rgb), 0.12) !important;
        border-color: rgba(var(--camp-brand-primary-rgb), 0.25) !important;
    }

    /* ── Avatars, initials, name tags ── */
    & .child-avatar,
    & .yp-initials,
    & .avatar-initials,
    & .user-avatar,
    & .sh-avatar,
    & .yg-avatar,
    & .mg-member-avatar,
    & .leader-tag,
    & .act-type-badge {
        background: linear-gradient(135deg, var(--camp-brand-primary), var(--camp-brand-primary-dark)) !important;
        color: #fff !important;
    }
    & .attendance-chip:checked,
    & .att-chip:checked,
    & .day-check:has(input:checked) {
        background: var(--camp-brand-primary) !important;
        border-color: var(--camp-brand-primary) !important;
    }

    /* ── Announcements composer & categories ── */
    & .ann-side-card h6,
    & .ann-cat-manage h6,
    & .composer-toggle h6 {
        color: var(--camp-brand-primary-dark) !important;
    }
    & .composer-toggle,
    & .add-panel h6,
    & .entries-card-header,
    & .ann-filter-btn.active,
    & .ann-cat-badge {
        color: var(--camp-brand-primary-dark) !important;
    }
    & .ann-filter-list button.ann-filter-btn.active,
    & .ann-filter-list a.active {
        color: var(--camp-brand-primary-dark) !important;
        border-color: rgba(var(--camp-brand-primary-rgb), 0.35) !important;
        background: rgba(var(--camp-brand-primary-rgb), 0.1) !important;
    }
    & .composer-chevron {
        color: var(--camp-brand-primary) !important;
    }
    & .composer-toggle i,
    & .ann-side-card h6 i,
    & .add-panel h6 i,
    & .entries-card-header > span i {
        color: var(--camp-brand-primary) !important;
    }

    /* ── Camp search hero ── */
    & .search-hero {
        background: linear-gradient(135deg, var(--camp-brand-primary-dark) 0%, var(--camp-brand-primary) 45%, var(--camp-brand-primary-light) 100%) !important;
    }
    & .results-meta-bar strong,
    & .result-type-label,
    & .empty-state h4 {
        color: var(--camp-brand-primary-dark) !important;
    }

    /* ── QR scanner ── */
    & .corner-border {
        border-color: var(--camp-brand-primary-light) !important;
    }
    & .scan-line {
        background: linear-gradient(90deg, transparent, var(--camp-brand-primary-light), transparent) !important;
    }
    & .qr-tip-icon {
        background: color-mix(in srgb, var(--camp-brand-primary) 12%, white) !important;
        color: var(--camp-brand-primary) !important;
    }
    & .qr-side-header {
        color: var(--camp-brand-primary-dark) !important;
    }
    & .session-tag i {
        color: var(--camp-brand-primary) !important;
    }
    & .recent-link:hover {
        border-color: var(--camp-brand-primary) !important;
    }
    /* Scanning prompt stays blue (semantic, not brand) */
    & .scan-status.status-scanning {
        background: #dbeafe !important;
        color: #1e40af !important;
    }

    /* ── Homepage features ── */
    & .section-eyebrow .tag {
        color: var(--camp-brand-primary) !important;
        background: rgba(var(--camp-brand-primary-rgb), 0.1) !important;
    }
    & .feature-card .fc-icon,
    & .home-feature-icon {
        background: linear-gradient(135deg, var(--camp-brand-primary-light) 0%, var(--camp-brand-primary) 100%) !important;
        color: #fff !important;
    }

    /* ── Minibus admin titles ── */
    & .mb-admin-section-title,
    & .mb-admin-act-day,
    & .mb-page-icon {
        color: var(--camp-brand-primary) !important;
    }
    & .mb-bus-heading,
    & .mb-day-label {
        color: var(--camp-brand-primary-dark) !important;
    }

    /* ── Activity groups ── */
    & .mg-count-badge {
        background: var(--camp-brand-primary) !important;
        color: #fff !important;
    }

    /* ── Audit / stats pills ── */
    & .stat-pill .num,
    & .action-default {
        color: var(--camp-brand-primary-dark) !important;
    }

    /* ── Child profile (not leader) ── */
    & .qr-hero--child {
        background: linear-gradient(135deg, var(--camp-brand-primary) 0%, var(--camp-brand-primary-dark) 55%, var(--camp-hero-from) 100%) !important;
    }
    & .qr-section-icon--green,
    & .qr-section-badge {
        background: color-mix(in srgb, var(--camp-brand-primary) 12%, white) !important;
        color: var(--camp-brand-primary-dark) !important;
    }

    /* ── Policy pages (outside #router; skip yellow card) ── */
    & body:not(.yellow-card-page) .policy-nav a {
        color: var(--camp-brand-primary) !important;
    }
    & body:not(.yellow-card-page) .policy-nav a:hover,
    & body:not(.yellow-card-page) .policy-nav a.is-active {
        background: var(--camp-brand-primary) !important;
        border-color: var(--camp-brand-primary) !important;
        color: #fff !important;
    }

    /* ── More inline style overrides ── */
    & [style*="color:#6ab356"],
    & [style*="color: #6ab356"],
    & [style*="color:#355a2c"],
    & [style*="color: #355a2c"] {
        color: var(--camp-brand-primary) !important;
    }
    & [style*="background:#6ab356"],
    & [style*="background: #6ab356"],
    & [style*="background-color:#6ab356"],
    & [style*="background-color: #6ab356"] {
        background: var(--camp-brand-primary-light) !important;
        background-color: var(--camp-brand-primary-light) !important;
    }
    & [style*="border-color:#437037"],
    & [style*="border-color: #437037"],
    & [style*="border:1.5px solid #437037"],
    & [style*="border: 1.5px solid #437037"] {
        border-color: var(--camp-brand-primary) !important;
    }
    & [style*="accent-color:#437037"],
    & [style*="accent-color: #437037"] {
        accent-color: var(--camp-brand-primary) !important;
    }

    /* ── Login page (public) ── */
    & .login-left {
        background: linear-gradient(160deg, var(--camp-hero-from) 0%, var(--camp-hero-mid) 40%, var(--camp-brand-primary) 100%) !important;
    }
    & .login-step.active .step-num,
    & .login-step-connector .connector-fill {
        background: var(--camp-brand-primary) !important;
    }
    & .login-step.active .step-label,
    & .login-back:hover,
    & .tfa-hint i,
    & .login-already-card .check-ring {
        color: var(--camp-brand-primary) !important;
    }
    & .login-step.done .step-label {
        color: var(--camp-brand-primary-dark) !important;
    }
    & .login-field .form-control:focus,
    & .otp-input {
        border-color: var(--camp-brand-primary) !important;
    }
    & .login-submit:not(.login-submit--secondary) {
        background: linear-gradient(135deg, var(--camp-brand-primary) 0%, var(--camp-brand-primary-dark) 100%) !important;
        box-shadow: 0 4px 16px rgba(var(--camp-hero-glow-rgb), 0.3) !important;
        color: #fff !important;
    }
    & .login-submit:not(.login-submit--secondary):hover:not(:disabled) {
        background: linear-gradient(135deg, var(--camp-brand-primary-mid) 0%, var(--camp-brand-primary-dark) 100%) !important;
    }
    & .login-submit--secondary {
        background: #fff !important;
        color: #2d4d27 !important;
        border: 1.5px solid #b8ccb4 !important;
        box-shadow: none !important;
    }
    & .login-auth-tab.active {
        border-color: var(--camp-brand-primary) !important;
        background: rgba(var(--camp-hero-glow-rgb), 0.08) !important;
        color: var(--camp-brand-primary-dark) !important;
    }

    /* ── System Status ── */
    & .ss-hero {
        background: linear-gradient(135deg, var(--camp-brand-primary-dark) 0%, var(--camp-brand-primary) 55%, var(--camp-hero-from) 100%) !important;
    }
    & .ss-hero::before {
        background: radial-gradient(circle at 85% 20%, rgba(var(--camp-hero-glow-rgb), 0.25), transparent 45%) !important;
    }
    & .ss-section-head h2,
    & .ss-history-card-head h3,
    & .ss-metric-value,
    & .ss-modal-service {
        color: var(--camp-brand-primary-dark) !important;
    }
    & .ss-service-icon,
    & .ss-btn--primary {
        background: linear-gradient(135deg, var(--camp-brand-primary) 0%, var(--camp-brand-primary-dark) 100%) !important;
    }
    & .ss-alert-icon,
    & .ss-timeline-type,
    & .ss-sparkline {
        color: var(--camp-brand-primary) !important;
    }
    & .ss-timeline-dot:not(.ss-timeline-dot--warning):not(.ss-timeline-dot--critical) {
        background: var(--camp-brand-primary) !important;
    }
    & .ss-metric-bar:not(.ss-metric-bar--disk):not(.ss-metric-bar--good):not(.ss-metric-bar--warning):not(.ss-metric-bar--bad) span {
        background: linear-gradient(90deg, var(--camp-brand-primary), var(--camp-brand-primary-light)) !important;
    }
    & .ss-range-tab:hover {
        border-color: var(--camp-brand-primary) !important;
        color: var(--camp-brand-primary) !important;
    }
    & .ss-range-tab.active {
        background: rgba(var(--camp-hero-glow-rgb), 0.08) !important;
        border-color: rgba(var(--camp-hero-glow-rgb), 0.35) !important;
        color: var(--camp-brand-primary-dark) !important;
    }
    & .ss-btn--ghost:hover {
        border-color: var(--camp-brand-primary) !important;
        color: var(--camp-brand-primary) !important;
    }
    & .ss-status-pick input {
        accent-color: var(--camp-brand-primary) !important;
    }

    /* ── Registration form (public token links) ── */
    & .reg-header {
        background: linear-gradient(135deg, var(--camp-brand-primary) 0%, var(--camp-brand-primary-dark) 100%) !important;
        color: #fff !important;
    }
    & .reg-header h2,
    & .reg-header p {
        color: inherit !important;
    }
    & .reg-container .section-header {
        border-left-color: var(--camp-brand-primary) !important;
        color: var(--camp-brand-primary-dark) !important;
    }
    & .reg-container .consent-box h3 {
        color: var(--camp-brand-primary) !important;
    }
    & .reg-container .btn-register {
        background: linear-gradient(135deg, var(--camp-brand-primary) 0%, var(--camp-brand-primary-dark) 100%) !important;
        color: #fff !important;
    }

    /* ── Notifications ── */
    & .site-notif-toast--success .site-notif-accent {
        background: linear-gradient(180deg, var(--camp-brand-primary-light), var(--camp-brand-primary)) !important;
    }
    & .site-notif-toast--success .site-notif-icon {
        background: color-mix(in srgb, var(--camp-brand-primary) 12%, white) !important;
        color: var(--camp-brand-primary-dark) !important;
    }
    & .site-notif-toast--success .site-notif-progress::after {
        background: var(--camp-brand-primary) !important;
    }

    & body::-webkit-scrollbar-thumb {
        background-color: var(--camp-brand-primary) !important;
    }

    /* ── Public homepage ── */
    & .hero-date-chip .chip-dot {
        background: var(--camp-brand-primary-light) !important;
        box-shadow: 0 0 0 3px rgba(var(--camp-hero-glow-rgb), 0.3) !important;
    }
    & .hero-btn-primary,
    & .hero-btn-primary:hover {
        color: var(--camp-brand-primary-dark) !important;
    }
    & .hero-btn-primary:hover {
        background: color-mix(in srgb, var(--camp-brand-primary) 8%, white) !important;
    }
    & .about-tag {
        background: rgba(var(--camp-brand-primary-rgb), 0.1) !important;
        color: var(--camp-brand-primary) !important;
    }
    & .about-heading,
    & .home-contact-heading {
        color: var(--camp-hero-from) !important;
    }
    & .about-img-badge .badge-dot {
        background: var(--camp-brand-primary-light) !important;
    }
    & .about-img-badge span {
        color: var(--camp-brand-primary-dark) !important;
    }
    & .about-cta,
    & .about-cta:hover,
    & .home-contact-btn,
    & .home-contact-btn:hover {
        background: linear-gradient(135deg, var(--camp-brand-primary) 0%, var(--camp-brand-primary-dark) 100%) !important;
        color: #fff !important;
    }
    & .about-cta:hover {
        background: linear-gradient(135deg, var(--camp-brand-primary-mid) 0%, var(--camp-hero-mid) 100%) !important;
    }
    & .home-stats {
        background: linear-gradient(135deg, var(--camp-brand-primary-dark) 0%, var(--camp-brand-primary) 100%) !important;
    }
    & .home-stats .stat-num {
        color: #fff !important;
    }
    & .home-feature-icon {
        background: linear-gradient(135deg, var(--camp-brand-primary-light) 0%, var(--camp-brand-primary) 100%) !important;
    }
    & .home-feature-card h3 {
        color: var(--camp-hero-from) !important;
    }
    & .home-feature-card a {
        color: var(--camp-brand-primary) !important;
    }
    & .home-contact-tag {
        color: var(--camp-brand-primary) !important;
    }
    & .section-divider-label,
    & .zone-label {
        color: var(--camp-brand-primary) !important;
    }
    & .btn-glv-hub,
    & .btn-glv-hub:hover {
        color: var(--camp-brand-primary-dark) !important;
    }
    & .widget-picker-toggle.is-on,
    & .widget-picker-toggle.is-on:hover {
        background: var(--camp-brand-primary) !important;
        border-color: var(--camp-brand-primary) !important;
        color: #fff !important;
    }
    & .sh-person-name,
    & .yg-person-name {
        color: inherit !important;
    }
}

/* Dark mode — full portal accent theming (loads after dark-mode-portal.css) */
html[data-theme="dark"] {

    /* ── Page backgrounds — subtle themed tint ── */
    & body,
    & .main-content,
    & .mb-main,
    & .scheduler-main {
        background:
            radial-gradient(ellipse 100% 48% at 50% 0%, rgba(var(--camp-hero-glow-rgb), 0.018) 0%, transparent 50%),
            var(--camp-bg-muted) !important;
    }

    /* ── Portal hero banners ── */
    & .portal-hero,
    & .portal-hero:not(.portal-hero--yellow),
    & .home-hero-1 {
        background:
            radial-gradient(ellipse 70% 55% at 50% 40%, rgba(var(--camp-hero-glow-rgb), 0.06) 0%, transparent 55%),
            linear-gradient(165deg, var(--camp-hero-from) 0%, var(--camp-hero-mid) 40%, var(--camp-hero-to) 72%, var(--camp-hero-from) 100%) !important;
    }
    & .portal-hero .topo-vignette,
    & .topo-vignette {
        background: radial-gradient(ellipse 60% 55% at 50% 48%, transparent 0%, rgba(0, 0, 0, 0.45) 100%) !important;
    }
    & .portal-hero .topo-map-fill,
    & .topo-map-fill {
        fill: rgba(var(--camp-hero-glow-rgb), 0.08) !important;
    }

    /* ── Navbar & sidebar (dark chrome — subtle theme hue) ── */
    & #router #sidebarMenu.sidebar,
    & .sidebar {
        background:
            radial-gradient(ellipse 80% 40% at 50% 0%, rgba(var(--camp-hero-glow-rgb), 0.02) 0%, transparent 60%),
            linear-gradient(180deg, var(--camp-sidebar-from) 0%, var(--camp-sidebar-mid) 55%, var(--camp-sidebar-to) 100%) !important;
    }
    & .site-navbar,
    & .site-navbar.scrolled,
    & body.logged-in .site-navbar,
    & body.logged-in .site-navbar.scrolled {
        background: rgba(var(--camp-navbar-rgb), 0.98) !important;
    }
    & .site-navbar .nav-mobile-menu {
        background: rgba(var(--camp-navbar-mobile-rgb), 0.99) !important;
    }
    @media (max-width: 767.98px) {
        & .site-navbar {
            background: rgba(var(--camp-navbar-mobile-rgb), 0.98) !important;
        }
    }

    /* ── Page titles, panel headers & headings ── */
    & .page-title,
    & h1.page-title,
    & #router .page-title,
    & #router h1.page-title,
    & .entries-card-header,
    & .add-panel h6,
    & .composer-toggle,
    & .yg-card-header,
    & .sh-card-header,
    & .act-card-header,
    & .info-card-header,
    & .ann-markdown .ann-md-h1,
    & .ann-markdown .ann-md-h2,
    & .tn-title {
        color: var(--camp-brand-primary-light) !important;
    }
    & .page-title i,
    & .page-title .bi,
    & h1.page-title i,
    & .add-panel h6 i,
    & .composer-toggle i,
    & .entries-card-header > span i,
    & .yg-card-header i,
    & .sh-card-header i,
    & .act-card-header i {
        color: var(--camp-brand-accent) !important;
    }
    & .portal-panel-chevron,
    & .yg-panel-chevron,
    & .sh-panel-chevron,
    & .yg-section-chevron {
        color: var(--camp-brand-accent) !important;
    }
    & .ann-markdown .ann-md-h3 {
        color: var(--camp-brand-accent) !important;
    }

    /* ── Announcements sidebar & composer titles ── */
    & .ann-side-card h6,
    & .ann-cat-manage h6,
    & .composer-toggle h6,
    & .composer h6 {
        color: var(--camp-brand-primary-light) !important;
    }
    & .composer-chevron {
        color: var(--camp-brand-accent) !important;
    }
    & .ann-side-card h6 i,
    & .composer-toggle h6 i {
        color: var(--camp-brand-accent) !important;
    }
    & .ann-filter-list button.ann-filter-btn.active,
    & .ann-filter-list a.active {
        color: var(--camp-brand-primary-light) !important;
        border-color: rgba(var(--camp-hero-glow-rgb), 0.22) !important;
        background: rgba(var(--camp-hero-glow-rgb), 0.08) !important;
    }
    & .btn-ann-mini:hover,
    & .btn-ann-action:hover {
        border-color: var(--camp-brand-primary-light) !important;
        color: var(--camp-brand-accent) !important;
    }

    /* ── Page tabs (themed bar; neutral tab chips) ── */
    & .page-tabs-bar {
        background: linear-gradient(
            180deg,
            color-mix(in srgb, var(--camp-brand-primary-mid) 14%, var(--camp-surface)) 0%,
            color-mix(in srgb, var(--camp-hero-from) 18%, var(--camp-bg-muted)) 100%
        ) !important;
        border-bottom-color: rgba(var(--camp-hero-glow-rgb), 0.14) !important;
    }
    & .page-tab {
        background: rgba(255, 255, 255, 0.06) !important;
        border-color: rgba(255, 255, 255, 0.1) !important;
    }
    & .page-tab--active {
        background: linear-gradient(135deg, var(--camp-brand-primary) 0%, var(--camp-brand-primary-mid) 100%) !important;
        border-color: var(--camp-brand-primary-light) !important;
        box-shadow: 0 1px 4px rgba(var(--camp-hero-glow-rgb), 0.35) !important;
    }
    & .page-tab__link {
        color: rgba(255, 255, 255, 0.52) !important;
    }
    & .page-tab--active .page-tab__link {
        color: #fff !important;
    }
    & .page-tab__tag {
        background: rgba(255, 255, 255, 0.1) !important;
        color: rgba(255, 255, 255, 0.48) !important;
    }
    & .page-tab--active .page-tab__tag {
        background: rgba(255, 255, 255, 0.2) !important;
        color: rgba(255, 255, 255, 0.92) !important;
    }
    & .page-tab--active .page-tab__close {
        color: rgba(255, 255, 255, 0.65) !important;
    }
    & .sidebar .nav-link.active {
        box-shadow: inset 3px 0 0 rgba(var(--camp-hero-glow-rgb), 0.35) !important;
    }

    /* ── Primary buttons & actions ── */
    & .btn-add,
    & .btn-post,
    & .btn-auto-slot,
    & .btn-sched-child-assign,
    & .btn-topo-primary,
    & .btn-scout,
    & .btn-save,
    & .btn-generate-all,
    & .btn-accept,
    & .btn-view,
    & .btn-register,
    & .qr-btn-scout,
    & .qr-panel-done-btn,
    & .tn-btn-primary,
    & .camp-search-widget button,
    & .btn-widget-action,
    & .group-tab.active,
    & .yg-jump-btn.active,
    & .sh-jump-btn.active,
    & .yg-section-filter.active,
    & .sh-presence-filter.active,
    & .widget-picker-toggle.is-on,
    & .type-tab.active,
    & .my-task-tab.is-active,
    & .section-tab.active,
    & .tn-cat-tab.is-active,
    & .tn-link-tab.is-active,
    & .bulk-chip.active {
        background: linear-gradient(135deg, var(--camp-brand-primary) 0%, var(--camp-brand-primary-mid) 100%) !important;
        border-color: var(--camp-brand-primary-mid) !important;
        color: #fff !important;
    }
    & .btn-scout-outline {
        color: var(--camp-brand-primary-light) !important;
        border-color: rgba(var(--camp-hero-glow-rgb), 0.4) !important;
    }
    & .btn-scout-outline:hover:not(:disabled) {
        border-color: var(--camp-brand-accent) !important;
        color: var(--camp-brand-accent) !important;
    }

    /* ── Inactive tabs / chips ── */
    & .my-task-tab,
    & .section-tab,
    & .tn-link-tab,
    & .tn-cat-tab,
    & .bulk-chip,
    & .type-tab {
        color: var(--camp-brand-primary-light) !important;
    }
    & .type-tab.active,
    & .ann-filter-btn.active {
        border-bottom-color: var(--camp-brand-accent) !important;
        color: var(--camp-brand-accent) !important;
    }
    & .tn-cat-tab-group:has(.tn-cat-tab.is-active) {
        background: rgba(var(--camp-hero-glow-rgb), 0.1) !important;
        border-color: rgba(var(--camp-hero-glow-rgb), 0.22) !important;
    }

    /* ── Stats & numbers ── */
    & .stat-val,
    & .stat-num,
    & .stat-pill .num,
    & .yg-stat .num,
    & .sh-stat .num,
    & .group-reg-detail-stat .val,
    & .session-pill,
    & .action-default {
        color: var(--camp-brand-accent) !important;
    }

    /* ── Cards & panels ── */
    & .add-panel,
    & .composer,
    & .ann-card.pinned {
        border-top-color: var(--camp-brand-primary) !important;
        border-left-color: var(--camp-brand-primary) !important;
    }

    /* ── Avatars, initials, tags ── */
    & .child-avatar,
    & .yp-initials,
    & .avatar-initials,
    & .user-avatar,
    & .sh-avatar,
    & .yg-avatar,
    & .mg-member-avatar,
    & .leader-tag,
    & .act-type-badge,
    & .ann-widget-avatar,
    & .ann-avatar {
        background: linear-gradient(135deg, var(--camp-brand-primary-mid), var(--camp-brand-primary)) !important;
        color: #fff !important;
    }
    & .attendance-chip:checked,
    & .att-chip:checked,
    & .day-check:has(input:checked) {
        background: var(--camp-brand-primary) !important;
        border-color: var(--camp-brand-primary) !important;
    }

    /* ── Checkmarks (tasks) ── */
    & .tn-check-face,
    & .tn-check-ui:checked + .tn-check-face,
    & .tn-check-ui:hover .tn-check-face {
        border-color: var(--camp-brand-accent) !important;
        background: linear-gradient(145deg, var(--camp-brand-primary-mid) 0%, var(--camp-brand-primary) 100%) !important;
    }

    /* ── Focus & accent inputs ── */
    & input[type="checkbox"],
    & input[type="radio"],
    & .form-control:focus,
    & .form-select:focus,
    & textarea:focus,
    & .yg-search:focus,
    & .sh-search:focus,
    & .reg-search:focus,
    & .composer textarea:focus {
        accent-color: var(--camp-brand-primary) !important;
        border-color: var(--camp-brand-primary) !important;
        box-shadow: 0 0 0 3px rgba(var(--camp-hero-glow-rgb), 0.2) !important;
    }

    /* ── Secondary / outline hovers ── */
    & .btn-match,
    & .btn-ann-mini:hover,
    & .btn-ann-action:hover,
    & .btn-customize-dash:hover,
    & .quick-action:hover,
    & .yg-quick-link:hover,
    & .sh-quick-link:hover,
    & .yg-quick-link i,
    & .sh-quick-link i,
    & .yg-att-day,
    & .yg-sched-time,
    & .sh-att-day,
    & .log-dot,
    & .section-divider-label,
    & .zone-label {
        color: var(--camp-brand-accent) !important;
    }
    & .yg-quick-link:hover,
    & .sh-quick-link:hover,
    & .portal-panel-header-toggle:hover,
    & .yg-card-header-toggle:hover,
    & .sh-card-header-toggle:hover,
    & .act-card-header:hover {
        border-color: rgba(var(--camp-hero-glow-rgb), 0.35) !important;
        background: rgba(var(--camp-hero-glow-rgb), 0.1) !important;
    }

    /* ── Gradient headers ── */
    & .day-header,
    & .group-card-header,
    & .edit-card-header,
    & .mg-modal-header {
        background: linear-gradient(135deg, var(--camp-sidebar-from) 0%, var(--camp-sidebar-to) 100%) !important;
        color: #fff !important;
    }
    & .day-header h3,
    & .day-header .day-date {
        color: inherit !important;
    }
    & .mg-count-badge {
        background: var(--camp-brand-primary) !important;
        color: #fff !important;
    }

    /* ── Welcome / section heroes ── */
    & .welcome-card,
    & .topo-card,
    & .yg-hero,
    & .glv-hub-promo {
        background: linear-gradient(135deg, var(--camp-hero-from) 0%, var(--camp-hero-mid) 52%, var(--camp-brand-primary-mid) 100%) !important;
        box-shadow: 0 8px 28px rgba(0, 0, 0, 0.38) !important;
        border-color: rgba(var(--camp-hero-glow-rgb), 0.12) !important;
    }
    & .topo-card-topo { opacity: 0.2 !important; }
    & .topo-card-grid { opacity: 0.05 !important; }
    & .topo-card-vignette {
        background: radial-gradient(ellipse 80% 70% at 50% 50%, transparent 0%, rgba(0, 0, 0, 0.42) 100%) !important;
    }
    & .topo-card .topo-map-fill,
    & .welcome-card .topo-map-fill,
    & .yg-hero .topo-map-fill {
        fill: rgba(var(--camp-hero-glow-rgb), 0.05) !important;
    }

    /* ── Camp search, QR, minibus ── */
    & .search-hero,
    & .qr-hero--child {
        background: linear-gradient(135deg, var(--camp-hero-from) 0%, var(--camp-brand-primary-mid) 50%, var(--camp-brand-primary) 100%) !important;
    }
    & .results-meta-bar strong,
    & .result-type-label,
    & .empty-state h4,
    & .mb-admin-section-title,
    & .mb-admin-act-day,
    & .mb-page-icon {
        color: var(--camp-brand-accent) !important;
    }
    & .mb-bus-heading,
    & .mb-day-label {
        color: var(--camp-brand-primary-light) !important;
    }
    & .corner-border {
        border-color: var(--camp-brand-accent) !important;
    }
    & .scan-line {
        background: linear-gradient(90deg, transparent, var(--camp-brand-accent), transparent) !important;
    }
    & .qr-tip-icon {
        background: rgba(var(--camp-hero-glow-rgb), 0.16) !important;
        color: var(--camp-brand-accent) !important;
    }
    & .qr-side-header {
        color: var(--camp-brand-primary-light) !important;
    }
    & .session-tag i {
        color: var(--camp-brand-accent) !important;
    }
    & .scan-status.status-scanning {
        background: rgba(59, 130, 246, 0.15) !important;
        color: #93c5fd !important;
    }
    & .qr-section-icon--green,
    & .qr-section-badge {
        background: rgba(var(--camp-hero-glow-rgb), 0.14) !important;
        color: var(--camp-brand-primary-light) !important;
    }

    /* ── Nav tabs (details manager) ── */
    & .nav-tabs .nav-link:hover,
    & .manager-card .nav-tabs .nav-link:hover {
        color: var(--camp-brand-accent) !important;
        background: rgba(var(--camp-hero-glow-rgb), 0.1) !important;
    }
    & .nav-tabs .nav-link.active,
    & .manager-card .nav-tabs .nav-link.active {
        color: var(--camp-brand-primary-light) !important;
    }

    /* ── Policy pages (skip yellow card) ── */
    & body:not(.yellow-card-page) .policy-nav a {
        color: var(--camp-brand-primary-light) !important;
    }
    & body:not(.yellow-card-page) .policy-nav a:hover,
    & body:not(.yellow-card-page) .policy-nav a.is-active {
        background: var(--camp-brand-primary) !important;
        border-color: var(--camp-brand-primary) !important;
        color: #fff !important;
    }

    /* ── Inline style overrides (all pages) ── */
    & [style*="color:#437037"],
    & [style*="color: #437037"],
    & [style*="color:#2d4d27"],
    & [style*="color: #2d4d27"],
    & [style*="color:#6ab356"],
    & [style*="color: #6ab356"],
    & [style*="color:#355a2c"],
    & [style*="color: #355a2c"] {
        color: var(--camp-brand-accent) !important;
    }
    & [style*="background:#437037"],
    & [style*="background: #437037"],
    & [style*="background-color:#437037"],
    & [style*="background-color: #437037"],
    & [style*="background:#6ab356"],
    & [style*="background: #6ab356"] {
        background: var(--camp-brand-primary) !important;
        background-color: var(--camp-brand-primary) !important;
        border-color: var(--camp-brand-primary) !important;
    }
    & [style*="linear-gradient(135deg, #437037"],
    & [style*="linear-gradient(135deg, #2d4d27"],
    & [style*="linear-gradient(135deg, #437037 0%, #2d4d27"],
    & [style*="linear-gradient(135deg,#437037"],
    & [style*="linear-gradient(135deg,#2d4d27"] {
        background: linear-gradient(135deg, var(--camp-brand-primary) 0%, var(--camp-brand-primary-mid) 100%) !important;
    }
    & [style*="border-color:#437037"],
    & [style*="border-color: #437037"],
    & [style*="accent-color:#437037"],
    & [style*="accent-color: #437037"] {
        border-color: var(--camp-brand-primary) !important;
        accent-color: var(--camp-brand-primary) !important;
    }

    /* ── Login page (public, dark) ── */
    & .login-left {
        background:
            radial-gradient(ellipse 85% 70% at 50% 0%, rgba(var(--camp-hero-glow-rgb), 0.1) 0%, transparent 55%),
            linear-gradient(168deg, var(--camp-hero-from) 0%, var(--camp-hero-mid) 30%, var(--camp-hero-to) 80%, var(--camp-brand-primary-dark) 100%) !important;
    }
    & .login-camp-card .lcc-label,
    & .login-step.active .step-label,
    & .login-back:hover,
    & .tfa-hint i,
    & .login-already-card .check-ring {
        color: var(--camp-brand-accent) !important;
    }
    & .login-step.active .step-num,
    & .login-step-connector .connector-fill {
        background: var(--camp-brand-primary-light) !important;
    }
    & .login-field .form-control:focus,
    & .otp-input {
        border-color: var(--camp-brand-primary-light) !important;
    }
    & .login-auth-tab.active {
        background: rgba(var(--camp-hero-glow-rgb), 0.15) !important;
        border-color: rgba(var(--camp-hero-glow-rgb), 0.45) !important;
        color: var(--camp-brand-accent) !important;
    }
    & .login-submit:not(.login-submit--secondary) {
        background: linear-gradient(135deg, var(--camp-brand-primary) 0%, var(--camp-brand-primary-mid) 100%) !important;
        color: #fff !important;
    }
    & .login-submit:not(.login-submit--secondary):hover:not(:disabled) {
        background: linear-gradient(135deg, var(--camp-brand-primary-mid) 0%, var(--camp-brand-primary) 100%) !important;
    }
    & .login-submit--secondary {
        background: var(--camp-surface, #1a2420) !important;
        color: #e8f0e6 !important;
        border: 1.5px solid rgba(255, 255, 255, 0.22) !important;
        box-shadow: none !important;
    }

    /* ── System Status (dark) ── */
    & .ss-hero {
        background: linear-gradient(135deg, var(--camp-hero-from) 0%, var(--camp-brand-primary-mid) 55%, var(--camp-brand-primary-dark) 100%) !important;
    }
    & .ss-hero::before {
        background: radial-gradient(circle at 85% 20%, rgba(var(--camp-hero-glow-rgb), 0.22), transparent 45%) !important;
    }
    & .ss-service-icon,
    & .ss-btn--primary {
        background: linear-gradient(135deg, var(--camp-brand-primary) 0%, var(--camp-brand-primary-mid) 100%) !important;
    }
    & .ss-alert-icon,
    & .ss-timeline-type,
    & .ss-sparkline {
        color: var(--camp-brand-accent) !important;
    }
    & .ss-timeline-dot:not(.ss-timeline-dot--warning):not(.ss-timeline-dot--critical) {
        background: var(--camp-brand-primary-light) !important;
    }
    & .ss-metric-bar:not(.ss-metric-bar--disk):not(.ss-metric-bar--good):not(.ss-metric-bar--warning):not(.ss-metric-bar--bad) span {
        background: linear-gradient(90deg, var(--camp-brand-primary), var(--camp-brand-primary-light)) !important;
    }
    & .ss-btn--ghost:hover,
    & .ss-range-tab:hover {
        border-color: var(--camp-brand-primary-light) !important;
        color: var(--camp-brand-accent) !important;
    }

    /* ── Registration form (public — page CSS is light-scoped in router) ── */
    & .reg-header {
        background: linear-gradient(135deg, var(--camp-brand-primary-mid) 0%, var(--camp-brand-primary) 100%) !important;
        color: #fff !important;
    }
    & .reg-header h2,
    & .reg-header p {
        color: inherit !important;
    }
    & .reg-container .section-header {
        border-left-color: var(--camp-brand-primary-light) !important;
        color: var(--camp-brand-primary-light) !important;
    }
    & .reg-container .consent-box h3 {
        color: var(--camp-brand-accent) !important;
    }
    & .reg-container .btn-register {
        background: linear-gradient(135deg, var(--camp-brand-primary) 0%, var(--camp-brand-primary-mid) 100%) !important;
        border: none !important;
        color: #fff !important;
    }
    & .reg-container .btn-register:hover:not(:disabled) {
        background: linear-gradient(135deg, var(--camp-brand-primary-mid) 0%, var(--camp-brand-primary) 100%) !important;
        color: #fff !important;
    }
    & .reg-container .swim-check-card:has(input:checked) {
        border-color: var(--camp-brand-primary-light) !important;
        background: rgba(var(--camp-hero-glow-rgb), 0.12) !important;
    }

    & body::-webkit-scrollbar-thumb {
        background-color: var(--camp-brand-primary-mid) !important;
    }

    /* ── Site footer ── */
    & .site-footer {
        background: linear-gradient(
            180deg,
            color-mix(in srgb, var(--camp-hero-from) 52%, #0a0c0a) 0%,
            color-mix(in srgb, var(--camp-sidebar-to) 38%, #050605) 100%
        ) !important;
        color: rgba(255, 255, 255, 0.72) !important;
    }
    & .site-footer::before {
        background: linear-gradient(
            90deg,
            color-mix(in srgb, var(--camp-hero-mid) 55%, black),
            var(--camp-brand-primary-mid),
            var(--camp-brand-primary),
            var(--camp-brand-primary-mid),
            color-mix(in srgb, var(--camp-hero-mid) 55%, black)
        ) !important;
        opacity: 0.75 !important;
    }
    & .footer-brand .brand-tagline {
        color: rgba(255, 255, 255, 0.48) !important;
    }
    & .footer-nav-col h3 {
        color: rgba(255, 255, 255, 0.34) !important;
    }
    & .footer-nav-col a {
        color: rgba(255, 255, 255, 0.62) !important;
    }
    & .footer-nav-col a:hover {
        color: #fff !important;
    }
    & .footer-bottom p {
        color: rgba(255, 255, 255, 0.32) !important;
    }
    & .footer-brand .charity-chip,
    & .footer-nav-col a i,
    & .footer-bottom p a,
    & .footer-privacy-btn {
        color: var(--camp-brand-accent) !important;
    }
    & .footer-brand .charity-chip,
    & .footer-privacy-btn {
        background: rgba(var(--camp-hero-glow-rgb), 0.1) !important;
        border-color: rgba(var(--camp-hero-glow-rgb), 0.28) !important;
    }
    & .footer-bottom p a:hover,
    & .footer-privacy-btn:hover {
        color: color-mix(in srgb, var(--camp-brand-accent) 90%, white) !important;
    }
}

/* Activity title tags — (location) and [group] (profiles, scheduler, activity groups) */
.camp-act-display {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 4px;
    line-height: 1.35;
}
.camp-act-display-name { font-weight: inherit; }
.camp-act-tag {
    font-size: 0.68rem;
    font-weight: 600;
    padding: 2px 6px;
    border-radius: 4px;
    border: 1px solid transparent;
    display: inline-flex;
    align-items: center;
    gap: 3px;
    white-space: nowrap;
}
.camp-act-tag--type { background: #f3f4f6; color: #374151; border-color: #e5e7eb; text-transform: uppercase; }
.camp-act-tag--loc { background: #dbeafe; color: #1e40af; border-color: #bfdbfe; }
.camp-act-tag--grp { background: #d1fae5; color: #065f46; border-color: #a7f3d0; }