/*!
 * Grensepakke dark mode v2 (2026-10-18) — public pages only. Linked AFTER style.css.
 * Theme preference (localStorage "gp-theme": auto|light|dark) is applied by an inline <head> script:
 *   auto  -> no data-theme attribute: follows the OS via @media (prefers-color-scheme: dark), scope :root:not([data-theme="light"])
 *   light -> <html data-theme="light">: nothing in this file applies (light = exactly as before)
 *   dark  -> <html data-theme="dark">: the identical rule set, scope :root[data-theme="dark"]
 * Both scopes have the same specificity (0,2,0), enough to beat the inline critical CSS and the inline hero CSS on index.php.
 * The two blocks are generated from one source (build-dark-css.py); keep them identical.
 * Admin (admin/*) and e-mails never load this file.
 */
@media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) {
        /* Bootstrap 5.3.3 dark tokens (copied from [data-bs-theme=dark]) */
        color-scheme:dark;
        --bs-body-color:#dee2e6;
        --bs-body-color-rgb:222,226,230;
        --bs-body-bg:#212529;
        --bs-body-bg-rgb:33,37,41;
        --bs-emphasis-color:#fff;
        --bs-emphasis-color-rgb:255,255,255;
        --bs-secondary-color:rgba(222, 226, 230, 0.75);
        --bs-secondary-color-rgb:222,226,230;
        --bs-secondary-bg:#343a40;
        --bs-secondary-bg-rgb:52,58,64;
        --bs-tertiary-color:rgba(222, 226, 230, 0.5);
        --bs-tertiary-color-rgb:222,226,230;
        --bs-tertiary-bg:#2b3035;
        --bs-tertiary-bg-rgb:43,48,53;
        --bs-primary-text-emphasis:#6ea8fe;
        --bs-secondary-text-emphasis:#a7acb1;
        --bs-success-text-emphasis:#75b798;
        --bs-info-text-emphasis:#6edff6;
        --bs-warning-text-emphasis:#ffda6a;
        --bs-danger-text-emphasis:#ea868f;
        --bs-light-text-emphasis:#f8f9fa;
        --bs-dark-text-emphasis:#dee2e6;
        --bs-primary-bg-subtle:#031633;
        --bs-secondary-bg-subtle:#161719;
        --bs-success-bg-subtle:#051b11;
        --bs-info-bg-subtle:#032830;
        --bs-warning-bg-subtle:#332701;
        --bs-danger-bg-subtle:#2c0b0e;
        --bs-light-bg-subtle:#343a40;
        --bs-dark-bg-subtle:#1a1d20;
        --bs-primary-border-subtle:#084298;
        --bs-secondary-border-subtle:#41464b;
        --bs-success-border-subtle:#0f5132;
        --bs-info-border-subtle:#087990;
        --bs-warning-border-subtle:#997404;
        --bs-danger-border-subtle:#842029;
        --bs-light-border-subtle:#495057;
        --bs-dark-border-subtle:#343a40;
        --bs-heading-color:inherit;
        --bs-link-color:#6ea8fe;
        --bs-link-hover-color:#8bb9fe;
        --bs-link-color-rgb:110,168,254;
        --bs-link-hover-color-rgb:139,185,254;
        --bs-code-color:#e685b5;
        --bs-highlight-color:#dee2e6;
        --bs-highlight-bg:#664d03;
        --bs-border-color:#495057;
        --bs-border-color-translucent:rgba(255, 255, 255, 0.15);
        --bs-form-valid-color:#75b798;
        --bs-form-valid-border-color:#75b798;
        --bs-form-invalid-color:#ea868f;
        --bs-form-invalid-border-color:#ea868f;
        /* Grensepakke tokens */
        --gp-bg: #0e1417;
        --gp-surface: #162026;
        --gp-surface-2: #1d2a31;
        --gp-border: #2c3c44;
        --gp-text: #e4ecef;
        --gp-muted: #a9b8be;
        --gp-link: #74c7e4;
        --gp-brand: #07788a;
        --gp-brand-hover: #066a7a;
        --gp-accent: #3cc3d4;
        --bs-body-bg: #0e1417;
        --bs-body-bg-rgb: 14,20,23;
        --bs-body-color: #e4ecef;
        --bs-body-color-rgb: 228,236,239;
        --bs-border-color: #2c3c44;
        --bs-link-color: #74c7e4;
        --bs-link-hover-color: #9ad6ec;
        --bs-secondary-color: #a9b8be;
        color-scheme: dark;
    }

    /* ---------- Page ---------- */
    :root:not([data-theme="light"]) body,
    :root:not([data-theme="light"]) .bg-light,
    :root:not([data-theme="light"]) .gp-gk-banner-small { background-color: var(--gp-bg) !important; color: var(--gp-text); }
    :root:not([data-theme="light"]) .bg-white { background-color: var(--gp-surface) !important; }
    :root:not([data-theme="light"]) h1, :root:not([data-theme="light"]) h2, :root:not([data-theme="light"]) h3, :root:not([data-theme="light"]) h4, :root:not([data-theme="light"]) h5, :root:not([data-theme="light"]) h6, :root:not([data-theme="light"]) .h1, :root:not([data-theme="light"]) .h2, :root:not([data-theme="light"]) .h3, :root:not([data-theme="light"]) .h4, :root:not([data-theme="light"]) .h5, :root:not([data-theme="light"]) .h6,
    :root:not([data-theme="light"]) .display-1, :root:not([data-theme="light"]) .display-2, :root:not([data-theme="light"]) .display-3, :root:not([data-theme="light"]) .display-4, :root:not([data-theme="light"]) .lead { color: var(--gp-text); }
    :root:not([data-theme="light"]) .text-muted, :root:not([data-theme="light"]) .text-body-secondary, :root:not([data-theme="light"]) .form-text, :root:not([data-theme="light"]) small.text-muted { color: var(--gp-muted) !important; }
    :root:not([data-theme="light"]) .text-dark, :root:not([data-theme="light"]) .text-black { color: var(--gp-text) !important; }
    :root:not([data-theme="light"]) .text-primary { color: var(--gp-link) !important; }
    :root:not([data-theme="light"]) .text-danger { color: #ff8a8a !important; }
    :root:not([data-theme="light"]) hr { border-color: var(--gp-border); opacity: 1; }

    /* ---------- Links (style.css forces #176c9c !important, ~2.9:1 on dark) ---------- */
    :root:not([data-theme="light"]) a, :root:not([data-theme="light"]) a:hover, :root:not([data-theme="light"]) a:hover .bi-arrow-right, :root:not([data-theme="light"]) .a-blue, :root:not([data-theme="light"]) .a-blue:hover, :root:not([data-theme="light"]) .a-blue:hover .bi-arrow-right { color: var(--gp-link) !important; }
    :root:not([data-theme="light"]) a:hover { color: #9ad6ec !important; }
    :root:not([data-theme="light"]) .a-white, :root:not([data-theme="light"]) .a-white:hover, :root:not([data-theme="light"]) .text-white, :root:not([data-theme="light"]) .hero-bg a.text-white { color: #fff !important; }

    /* ---------- Header / nav ---------- */
    :root:not([data-theme="light"]) .navbar { background-color: var(--gp-surface); color: var(--gp-link); box-shadow: 0 4px 10px rgba(0,0,0,.55); }
    :root:not([data-theme="light"]) .navbar .navbar-brand, :root:not([data-theme="light"]) .navbar .navbar-nav .nav-link, :root:not([data-theme="light"]) .navbar .nav-link { color: var(--gp-link) !important; }
    :root:not([data-theme="light"]) .navbar .navbar-nav .nav-link:hover { background-color: rgba(255,255,255,.06); }
    :root:not([data-theme="light"]) .navbar .navbar-nav .nav-link.active { background: var(--gp-surface-2); box-shadow: 0 2px 6px rgba(0,0,0,.5); color: #fff !important; }
    :root:not([data-theme="light"]) .navbar-toggler { border-color: var(--gp-border); }
    :root:not([data-theme="light"]) .navbar-toggler-icon { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28228, 236, 239, 0.85%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e"); }
    /* Logo: dark variant (light bridge arc, no plate). gp-theme.js also swaps src for browsers without content:url() on <img> */
    :root:not([data-theme="light"]) .navbar-brand img.logo, :root:not([data-theme="light"]) img.logo { content: url("../img/logo-dark.webp?v=20261018b"); }
    :root:not([data-theme="light"]) .dropdown-menu { background-color: var(--gp-surface-2); box-shadow: 0 6px 16px rgba(0,0,0,.6); }
    :root:not([data-theme="light"]) .dropdown-item { color: var(--gp-text) !important; }
    :root:not([data-theme="light"]) .dropdown-item:hover, :root:not([data-theme="light"]) .dropdown-item:focus { background-color: rgba(116,199,228,.14); color: #fff !important; }
    :root:not([data-theme="light"]) .dropdown-item.active { background-color: var(--gp-brand) !important; color: #fff !important; }

    /* ---------- Hero (index punkt 6) ---------- */
    :root:not([data-theme="light"]) .gp-hero6, :root:not([data-theme="light"]) .gp-gk-cta-wrap { background: var(--gp-surface); border-bottom-color: var(--gp-border); }
    :root:not([data-theme="light"]) .gp-hero6-title { color: var(--gp-text); }
    :root:not([data-theme="light"]) .gp-hero6-sub, :root:not([data-theme="light"]) .gp-hero6-login { color: var(--gp-muted); }
    :root:not([data-theme="light"]) .gp-hero6-trust li { background: var(--gp-surface-2); border-color: var(--gp-border); color: var(--gp-text); }
    :root:not([data-theme="light"]) .gp-hero6-trust i { color: var(--gp-accent); }
    :root:not([data-theme="light"]) .gp-hero6-google a, :root:not([data-theme="light"]) .gp-hero6-google a:hover { color: var(--gp-text) !important; }
    :root:not([data-theme="light"]) .gp-hero6-google a:hover, :root:not([data-theme="light"]) .gp-hero6-google a:focus-visible { background: #24343c; }
        /* hero.webp is a teal ellipse on light grey; the grey corners glare on dark. Same teal as a flat gradient (white text 5.6–8:1) */
    :root:not([data-theme="light"]) .hero-bg { background-color: #0f7184; background-image: linear-gradient(180deg, #0f7184 0%, #0a5866 100%) !important; }

    /* ---------- Buttons ---------- */
    :root:not([data-theme="light"]) .btn-primary { background-color: var(--gp-brand) !important; border-color: var(--gp-brand) !important; color: #fff !important; }
    :root:not([data-theme="light"]) .btn-primary:hover, :root:not([data-theme="light"]) .btn-primary:focus { background-color: var(--gp-brand-hover) !important; border-color: var(--gp-brand-hover) !important; }
    :root:not([data-theme="light"]) .btn-outline-secondary { color: var(--gp-text) !important; border-color: #5d6f77 !important; }
    :root:not([data-theme="light"]) .btn-outline-secondary:hover { background-color: var(--gp-surface-2) !important; }
    :root:not([data-theme="light"]) .btn-light, :root:not([data-theme="light"]) a.btn-light { background-color: #e4ecef !important; border-color: #e4ecef !important; color: #0b3d56 !important; }
    :root:not([data-theme="light"]) .btn:focus-visible { box-shadow: 0 0 0 .25rem rgba(116,199,228,.45) !important; }

    /* ---------- Cards ---------- */
    :root:not([data-theme="light"]) .card { background-color: var(--gp-surface); color: var(--gp-text); box-shadow: 0 2px 8px rgba(0,0,0,.55); --bs-card-bg: var(--gp-surface); --bs-card-color: var(--gp-text); --bs-card-cap-bg: var(--gp-surface-2); }
    /* Register teaser card: dark card + register-dark.webp (curve recoloured to the card colour) */
    :root:not([data-theme="light"]) .card-register { background-color: var(--gp-surface); color: var(--gp-text); box-shadow: 0 2px 8px rgba(0,0,0,.55); }
    :root:not([data-theme="light"]) .card-register h1, :root:not([data-theme="light"]) .card-register h2, :root:not([data-theme="light"]) .card-register h3, :root:not([data-theme="light"]) .card-register h4, :root:not([data-theme="light"]) .card-register h5, :root:not([data-theme="light"]) .card-register p { color: var(--gp-text); }
    :root:not([data-theme="light"]) .gp-feature-card:hover { box-shadow: 0 10px 22px rgba(0,0,0,.7); }
    :root:not([data-theme="light"]) .shadow-sm { box-shadow: 0 2px 6px rgba(0,0,0,.55) !important; }
    :root:not([data-theme="light"]) .border { border-color: var(--gp-border) !important; }
    /* Loyalty price box (price.php) */
    :root:not([data-theme="light"]) .loyalty-price-box { background-color: var(--gp-surface-2) !important; color: var(--gp-text) !important; border-color: var(--gp-border) !important; }

    /* ---------- Forms ---------- */
    :root:not([data-theme="light"]) .form-control, :root:not([data-theme="light"]) .form-select, :root:not([data-theme="light"]) .input-group-text {
        background-color: #0f191e; color: var(--gp-text); border-color: #6f848d;
    }
    :root:not([data-theme="light"]) .form-control::placeholder { color: #8796a0; opacity: 1; }
    :root:not([data-theme="light"]) .form-control:focus, :root:not([data-theme="light"]) .form-select:focus { background-color: #0f191e; color: #fff; border-color: var(--gp-accent); box-shadow: 0 0 0 .25rem rgba(60,195,212,.25); }
    :root:not([data-theme="light"]) .form-select { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23dee2e6' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e"); }
    :root:not([data-theme="light"]) .form-check-input { background-color: #0f191e; border-color: #6a7e87; }
    :root:not([data-theme="light"]) .form-check-input:checked { background-color: var(--gp-brand); border-color: var(--gp-brand); }
    :root:not([data-theme="light"]) .form-label, :root:not([data-theme="light"]) .form-check-label, :root:not([data-theme="light"]) label { color: var(--gp-text); }
    :root:not([data-theme="light"]) .form-control:disabled, :root:not([data-theme="light"]) .form-control[readonly] { background-color: var(--gp-surface-2); }
    :root:not([data-theme="light"]) input:-webkit-autofill { -webkit-text-fill-color: var(--gp-text); -webkit-box-shadow: 0 0 0 1000px #0f191e inset; }

    /* ---------- Tables (price list) ---------- */
    :root:not([data-theme="light"]) .table { --bs-table-bg: var(--gp-surface); --bs-table-color: var(--gp-text); --bs-table-border-color: var(--gp-border); --bs-table-striped-bg: #1a252b; --bs-table-hover-bg: #22313a; --bs-table-hover-color: #fff; color: var(--gp-text); }
    :root:not([data-theme="light"]) .table-light { --bs-table-bg: var(--gp-surface-2); --bs-table-color: var(--gp-text); --bs-table-border-color: var(--gp-border); }
    :root:not([data-theme="light"]) .table-stack tr { background-color: var(--gp-surface); border-color: var(--gp-border); }
    :root:not([data-theme="light"]) .table-stack > :not(caption) > * > * { border-bottom-color: var(--gp-border); }
    :root:not([data-theme="light"]) .table-stack th[scope="row"], :root:not([data-theme="light"]) .table-stack:not(.table-stack-compare) td:first-child { background-color: var(--gp-surface-2); }
    :root:not([data-theme="light"]) .table-stack td[data-label]::before { color: var(--gp-muted); }
    :root:not([data-theme="light"]) .table-stack-compare td.table-stack-gp { background-color: #12303a; --bs-table-bg-type: #12303a; --bs-table-accent-bg: #12303a; }
    :root:not([data-theme="light"]) .table-stack-compare td.table-stack-gp::before { color: var(--gp-accent); }

    /* ---------- Accordion (FAQ), list groups, alerts, badges ---------- */
    :root:not([data-theme="light"]) .accordion { --bs-accordion-bg: var(--gp-surface); --bs-accordion-color: var(--gp-text); --bs-accordion-border-color: var(--gp-border); --bs-accordion-btn-color: var(--gp-text); --bs-accordion-active-bg: #12303a; --bs-accordion-active-color: #fff; --bs-accordion-btn-focus-box-shadow: 0 0 0 .25rem rgba(60,195,212,.3);
        --bs-accordion-btn-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23e4ecef' stroke-linecap='round' stroke-linejoin='round'%3e%3cpath d='M2 5L8 11L14 5'/%3e%3c/svg%3e");
        --bs-accordion-btn-active-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%2374c7e4' stroke-linecap='round' stroke-linejoin='round'%3e%3cpath d='M2 5L8 11L14 5'/%3e%3c/svg%3e"); }
    :root:not([data-theme="light"]) .list-group { --bs-list-group-bg: var(--gp-surface); --bs-list-group-color: var(--gp-text); --bs-list-group-border-color: var(--gp-border); }
    :root:not([data-theme="light"]) .alert-info { --bs-alert-bg: #0f2c35; --bs-alert-color: #b8ecf7; --bs-alert-border-color: #1d5361; }
    :root:not([data-theme="light"]) .alert-success { --bs-alert-bg: #0f2a1d; --bs-alert-color: #b3e6c8; --bs-alert-border-color: #1f5137; }
    :root:not([data-theme="light"]) .alert-warning { --bs-alert-bg: #2d2408; --bs-alert-color: #ffe08a; --bs-alert-border-color: #5c4a10; }
    :root:not([data-theme="light"]) .alert-danger { --bs-alert-bg: #2f1214; --bs-alert-color: #ffb3b8; --bs-alert-border-color: #6b2a30; }
    :root:not([data-theme="light"]) .alert a { color: inherit !important; text-decoration: underline; }
    :root:not([data-theme="light"]) .badge.bg-secondary { background-color: #4b5b63 !important; color: #fff !important; }
    :root:not([data-theme="light"]) .badge.bg-light { background-color: var(--gp-surface-2) !important; color: var(--gp-text) !important; }
    :root:not([data-theme="light"]) .gp-hours-badge.bg-primary, :root:not([data-theme="light"]) .badge.bg-primary { background-color: var(--gp-brand) !important; color: #fff !important; }
    :root:not([data-theme="light"]) .badge.bg-success { background-color: #1f7a4d !important; color: #fff !important; }
    :root:not([data-theme="light"]) .badge.bg-warning { background-color: #e0b13a !important; color: #1b1400 !important; }
    /* 2026-10-20: amber highlight (t.ex. C/O-kundnummer på Mine pakker) – mörk text för WCAG AA */
    :root:not([data-theme="light"]) .bg-warning:not(.badge):not(.text-warning):not([class*="bg-opacity"]) { background-color: #e0b13a !important; color: #1b1400 !important; font-weight: 600; }
    :root:not([data-theme="light"]) .badge.bg-danger { background-color: #c0393f !important; color: #fff !important; }
    :root:not([data-theme="light"]) .badge.bg-info { background-color: #1aa3b8 !important; color: #04181c !important; }

    /* ---------- "Beställ från EU" photo band + footer ---------- */
    :root:not([data-theme="light"]) .almost-footer-bg { background-color: #1b2a33; }
    :root:not([data-theme="light"]) footer { background-color: var(--gp-surface); color: var(--gp-text); }
    :root:not([data-theme="light"]) .border-footer { border-top-color: var(--gp-surface); }
    :root:not([data-theme="light"]) footer .text-muted { color: var(--gp-muted) !important; }
    :root:not([data-theme="light"]) footer a.text-muted, :root:not([data-theme="light"]) .footer-links a { color: var(--gp-muted) !important; }
    :root:not([data-theme="light"]) .footer-links a:hover { color: var(--gp-link) !important; }
    :root:not([data-theme="light"]) .footer-contact-link { color: var(--gp-link) !important; }
    @media (max-width: 767.98px) {
        :root:not([data-theme="light"]) .footer-contact-link { background-color: var(--gp-surface-2); border-color: var(--gp-link); }
    }

    /* ---------- Misc ---------- */
    :root:not([data-theme="light"]) .modal-content { background-color: var(--gp-surface); color: var(--gp-text); }
    :root:not([data-theme="light"]) .btn-close { filter: invert(1) grayscale(100%) brightness(200%); }
    :root:not([data-theme="light"]) #gp-consent, :root:not([data-theme="light"]) #gp-consent .card { background-color: var(--gp-surface-2) !important; color: var(--gp-text) !important; }
    :root:not([data-theme="light"]) img.gp-gk-banner-img, :root:not([data-theme="light"]) .card-img-top, :root:not([data-theme="light"]) .card-img { filter: brightness(.92); }
    :root:not([data-theme="light"]) ::selection { background: #1d5361; color: #fff; }

    /* ---------- Dark photo variants (bottom/side curve recoloured to the dark card colour) ---------- */
    :root:not([data-theme="light"]) img[src$="/0001.webp"] { content: url("../img/0001-dark.webp"); }
    :root:not([data-theme="light"]) img[src$="/0002.webp"] { content: url("../img/0002-dark.webp"); }
    :root:not([data-theme="light"]) img[src$="/0003.webp"] { content: url("../img/0003-dark.webp"); }
    :root:not([data-theme="light"]) img[src$="/register.webp"] { content: url("../img/register-dark.webp"); }
    :root:not([data-theme="light"]) img[src$="/register-02.webp"] { content: url("../img/register-02-dark.webp"); }
    :root:not([data-theme="light"]) img[src$="/faq.webp"] { content: url("../img/faq-dark.webp"); }
    :root:not([data-theme="light"]) img[src$="/contact.webp"] { content: url("../img/contact-dark.webp"); }

}

/* ===== Forced dark (toggle) ===== */

:root[data-theme="dark"] {
    /* Bootstrap 5.3.3 dark tokens (copied from [data-bs-theme=dark]) */
    color-scheme:dark;
    --bs-body-color:#dee2e6;
    --bs-body-color-rgb:222,226,230;
    --bs-body-bg:#212529;
    --bs-body-bg-rgb:33,37,41;
    --bs-emphasis-color:#fff;
    --bs-emphasis-color-rgb:255,255,255;
    --bs-secondary-color:rgba(222, 226, 230, 0.75);
    --bs-secondary-color-rgb:222,226,230;
    --bs-secondary-bg:#343a40;
    --bs-secondary-bg-rgb:52,58,64;
    --bs-tertiary-color:rgba(222, 226, 230, 0.5);
    --bs-tertiary-color-rgb:222,226,230;
    --bs-tertiary-bg:#2b3035;
    --bs-tertiary-bg-rgb:43,48,53;
    --bs-primary-text-emphasis:#6ea8fe;
    --bs-secondary-text-emphasis:#a7acb1;
    --bs-success-text-emphasis:#75b798;
    --bs-info-text-emphasis:#6edff6;
    --bs-warning-text-emphasis:#ffda6a;
    --bs-danger-text-emphasis:#ea868f;
    --bs-light-text-emphasis:#f8f9fa;
    --bs-dark-text-emphasis:#dee2e6;
    --bs-primary-bg-subtle:#031633;
    --bs-secondary-bg-subtle:#161719;
    --bs-success-bg-subtle:#051b11;
    --bs-info-bg-subtle:#032830;
    --bs-warning-bg-subtle:#332701;
    --bs-danger-bg-subtle:#2c0b0e;
    --bs-light-bg-subtle:#343a40;
    --bs-dark-bg-subtle:#1a1d20;
    --bs-primary-border-subtle:#084298;
    --bs-secondary-border-subtle:#41464b;
    --bs-success-border-subtle:#0f5132;
    --bs-info-border-subtle:#087990;
    --bs-warning-border-subtle:#997404;
    --bs-danger-border-subtle:#842029;
    --bs-light-border-subtle:#495057;
    --bs-dark-border-subtle:#343a40;
    --bs-heading-color:inherit;
    --bs-link-color:#6ea8fe;
    --bs-link-hover-color:#8bb9fe;
    --bs-link-color-rgb:110,168,254;
    --bs-link-hover-color-rgb:139,185,254;
    --bs-code-color:#e685b5;
    --bs-highlight-color:#dee2e6;
    --bs-highlight-bg:#664d03;
    --bs-border-color:#495057;
    --bs-border-color-translucent:rgba(255, 255, 255, 0.15);
    --bs-form-valid-color:#75b798;
    --bs-form-valid-border-color:#75b798;
    --bs-form-invalid-color:#ea868f;
    --bs-form-invalid-border-color:#ea868f;
    /* Grensepakke tokens */
    --gp-bg: #0e1417;
    --gp-surface: #162026;
    --gp-surface-2: #1d2a31;
    --gp-border: #2c3c44;
    --gp-text: #e4ecef;
    --gp-muted: #a9b8be;
    --gp-link: #74c7e4;
    --gp-brand: #07788a;
    --gp-brand-hover: #066a7a;
    --gp-accent: #3cc3d4;
    --bs-body-bg: #0e1417;
    --bs-body-bg-rgb: 14,20,23;
    --bs-body-color: #e4ecef;
    --bs-body-color-rgb: 228,236,239;
    --bs-border-color: #2c3c44;
    --bs-link-color: #74c7e4;
    --bs-link-hover-color: #9ad6ec;
    --bs-secondary-color: #a9b8be;
    color-scheme: dark;
}

/* ---------- Page ---------- */
:root[data-theme="dark"] body,
:root[data-theme="dark"] .bg-light,
:root[data-theme="dark"] .gp-gk-banner-small { background-color: var(--gp-bg) !important; color: var(--gp-text); }
:root[data-theme="dark"] .bg-white { background-color: var(--gp-surface) !important; }
:root[data-theme="dark"] h1, :root[data-theme="dark"] h2, :root[data-theme="dark"] h3, :root[data-theme="dark"] h4, :root[data-theme="dark"] h5, :root[data-theme="dark"] h6, :root[data-theme="dark"] .h1, :root[data-theme="dark"] .h2, :root[data-theme="dark"] .h3, :root[data-theme="dark"] .h4, :root[data-theme="dark"] .h5, :root[data-theme="dark"] .h6,
:root[data-theme="dark"] .display-1, :root[data-theme="dark"] .display-2, :root[data-theme="dark"] .display-3, :root[data-theme="dark"] .display-4, :root[data-theme="dark"] .lead { color: var(--gp-text); }
:root[data-theme="dark"] .text-muted, :root[data-theme="dark"] .text-body-secondary, :root[data-theme="dark"] .form-text, :root[data-theme="dark"] small.text-muted { color: var(--gp-muted) !important; }
:root[data-theme="dark"] .text-dark, :root[data-theme="dark"] .text-black { color: var(--gp-text) !important; }
:root[data-theme="dark"] .text-primary { color: var(--gp-link) !important; }
:root[data-theme="dark"] .text-danger { color: #ff8a8a !important; }
:root[data-theme="dark"] hr { border-color: var(--gp-border); opacity: 1; }

/* ---------- Links (style.css forces #176c9c !important, ~2.9:1 on dark) ---------- */
:root[data-theme="dark"] a, :root[data-theme="dark"] a:hover, :root[data-theme="dark"] a:hover .bi-arrow-right, :root[data-theme="dark"] .a-blue, :root[data-theme="dark"] .a-blue:hover, :root[data-theme="dark"] .a-blue:hover .bi-arrow-right { color: var(--gp-link) !important; }
:root[data-theme="dark"] a:hover { color: #9ad6ec !important; }
:root[data-theme="dark"] .a-white, :root[data-theme="dark"] .a-white:hover, :root[data-theme="dark"] .text-white, :root[data-theme="dark"] .hero-bg a.text-white { color: #fff !important; }

/* ---------- Header / nav ---------- */
:root[data-theme="dark"] .navbar { background-color: var(--gp-surface); color: var(--gp-link); box-shadow: 0 4px 10px rgba(0,0,0,.55); }
:root[data-theme="dark"] .navbar .navbar-brand, :root[data-theme="dark"] .navbar .navbar-nav .nav-link, :root[data-theme="dark"] .navbar .nav-link { color: var(--gp-link) !important; }
:root[data-theme="dark"] .navbar .navbar-nav .nav-link:hover { background-color: rgba(255,255,255,.06); }
:root[data-theme="dark"] .navbar .navbar-nav .nav-link.active { background: var(--gp-surface-2); box-shadow: 0 2px 6px rgba(0,0,0,.5); color: #fff !important; }
:root[data-theme="dark"] .navbar-toggler { border-color: var(--gp-border); }
:root[data-theme="dark"] .navbar-toggler-icon { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28228, 236, 239, 0.85%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e"); }
/* Logo: dark variant (light bridge arc, no plate). gp-theme.js also swaps src for browsers without content:url() on <img> */
:root[data-theme="dark"] .navbar-brand img.logo, :root[data-theme="dark"] img.logo { content: url("../img/logo-dark.webp?v=20261018b"); }
:root[data-theme="dark"] .dropdown-menu { background-color: var(--gp-surface-2); box-shadow: 0 6px 16px rgba(0,0,0,.6); }
:root[data-theme="dark"] .dropdown-item { color: var(--gp-text) !important; }
:root[data-theme="dark"] .dropdown-item:hover, :root[data-theme="dark"] .dropdown-item:focus { background-color: rgba(116,199,228,.14); color: #fff !important; }
:root[data-theme="dark"] .dropdown-item.active { background-color: var(--gp-brand) !important; color: #fff !important; }

/* ---------- Hero (index punkt 6) ---------- */
:root[data-theme="dark"] .gp-hero6, :root[data-theme="dark"] .gp-gk-cta-wrap { background: var(--gp-surface); border-bottom-color: var(--gp-border); }
:root[data-theme="dark"] .gp-hero6-title { color: var(--gp-text); }
:root[data-theme="dark"] .gp-hero6-sub, :root[data-theme="dark"] .gp-hero6-login { color: var(--gp-muted); }
:root[data-theme="dark"] .gp-hero6-trust li { background: var(--gp-surface-2); border-color: var(--gp-border); color: var(--gp-text); }
:root[data-theme="dark"] .gp-hero6-trust i { color: var(--gp-accent); }
:root[data-theme="dark"] .gp-hero6-google a, :root[data-theme="dark"] .gp-hero6-google a:hover { color: var(--gp-text) !important; }
:root[data-theme="dark"] .gp-hero6-google a:hover, :root[data-theme="dark"] .gp-hero6-google a:focus-visible { background: #24343c; }
    /* hero.webp is a teal ellipse on light grey; the grey corners glare on dark. Same teal as a flat gradient (white text 5.6–8:1) */
:root[data-theme="dark"] .hero-bg { background-color: #0f7184; background-image: linear-gradient(180deg, #0f7184 0%, #0a5866 100%) !important; }

/* ---------- Buttons ---------- */
:root[data-theme="dark"] .btn-primary { background-color: var(--gp-brand) !important; border-color: var(--gp-brand) !important; color: #fff !important; }
:root[data-theme="dark"] .btn-primary:hover, :root[data-theme="dark"] .btn-primary:focus { background-color: var(--gp-brand-hover) !important; border-color: var(--gp-brand-hover) !important; }
:root[data-theme="dark"] .btn-outline-secondary { color: var(--gp-text) !important; border-color: #5d6f77 !important; }
:root[data-theme="dark"] .btn-outline-secondary:hover { background-color: var(--gp-surface-2) !important; }
:root[data-theme="dark"] .btn-light, :root[data-theme="dark"] a.btn-light { background-color: #e4ecef !important; border-color: #e4ecef !important; color: #0b3d56 !important; }
:root[data-theme="dark"] .btn:focus-visible { box-shadow: 0 0 0 .25rem rgba(116,199,228,.45) !important; }

/* ---------- Cards ---------- */
:root[data-theme="dark"] .card { background-color: var(--gp-surface); color: var(--gp-text); box-shadow: 0 2px 8px rgba(0,0,0,.55); --bs-card-bg: var(--gp-surface); --bs-card-color: var(--gp-text); --bs-card-cap-bg: var(--gp-surface-2); }
/* Register teaser card: dark card + register-dark.webp (curve recoloured to the card colour) */
:root[data-theme="dark"] .card-register { background-color: var(--gp-surface); color: var(--gp-text); box-shadow: 0 2px 8px rgba(0,0,0,.55); }
:root[data-theme="dark"] .card-register h1, :root[data-theme="dark"] .card-register h2, :root[data-theme="dark"] .card-register h3, :root[data-theme="dark"] .card-register h4, :root[data-theme="dark"] .card-register h5, :root[data-theme="dark"] .card-register p { color: var(--gp-text); }
:root[data-theme="dark"] .gp-feature-card:hover { box-shadow: 0 10px 22px rgba(0,0,0,.7); }
:root[data-theme="dark"] .shadow-sm { box-shadow: 0 2px 6px rgba(0,0,0,.55) !important; }
:root[data-theme="dark"] .border { border-color: var(--gp-border) !important; }
/* Loyalty price box (price.php) */
:root[data-theme="dark"] .loyalty-price-box { background-color: var(--gp-surface-2) !important; color: var(--gp-text) !important; border-color: var(--gp-border) !important; }

/* ---------- Forms ---------- */
:root[data-theme="dark"] .form-control, :root[data-theme="dark"] .form-select, :root[data-theme="dark"] .input-group-text {
    background-color: #0f191e; color: var(--gp-text); border-color: #6f848d;
}
:root[data-theme="dark"] .form-control::placeholder { color: #8796a0; opacity: 1; }
:root[data-theme="dark"] .form-control:focus, :root[data-theme="dark"] .form-select:focus { background-color: #0f191e; color: #fff; border-color: var(--gp-accent); box-shadow: 0 0 0 .25rem rgba(60,195,212,.25); }
:root[data-theme="dark"] .form-select { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23dee2e6' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e"); }
:root[data-theme="dark"] .form-check-input { background-color: #0f191e; border-color: #6a7e87; }
:root[data-theme="dark"] .form-check-input:checked { background-color: var(--gp-brand); border-color: var(--gp-brand); }
:root[data-theme="dark"] .form-label, :root[data-theme="dark"] .form-check-label, :root[data-theme="dark"] label { color: var(--gp-text); }
:root[data-theme="dark"] .form-control:disabled, :root[data-theme="dark"] .form-control[readonly] { background-color: var(--gp-surface-2); }
:root[data-theme="dark"] input:-webkit-autofill { -webkit-text-fill-color: var(--gp-text); -webkit-box-shadow: 0 0 0 1000px #0f191e inset; }

/* ---------- Tables (price list) ---------- */
:root[data-theme="dark"] .table { --bs-table-bg: var(--gp-surface); --bs-table-color: var(--gp-text); --bs-table-border-color: var(--gp-border); --bs-table-striped-bg: #1a252b; --bs-table-hover-bg: #22313a; --bs-table-hover-color: #fff; color: var(--gp-text); }
:root[data-theme="dark"] .table-light { --bs-table-bg: var(--gp-surface-2); --bs-table-color: var(--gp-text); --bs-table-border-color: var(--gp-border); }
:root[data-theme="dark"] .table-stack tr { background-color: var(--gp-surface); border-color: var(--gp-border); }
:root[data-theme="dark"] .table-stack > :not(caption) > * > * { border-bottom-color: var(--gp-border); }
:root[data-theme="dark"] .table-stack th[scope="row"], :root[data-theme="dark"] .table-stack:not(.table-stack-compare) td:first-child { background-color: var(--gp-surface-2); }
:root[data-theme="dark"] .table-stack td[data-label]::before { color: var(--gp-muted); }
:root[data-theme="dark"] .table-stack-compare td.table-stack-gp { background-color: #12303a; --bs-table-bg-type: #12303a; --bs-table-accent-bg: #12303a; }
:root[data-theme="dark"] .table-stack-compare td.table-stack-gp::before { color: var(--gp-accent); }

/* ---------- Accordion (FAQ), list groups, alerts, badges ---------- */
:root[data-theme="dark"] .accordion { --bs-accordion-bg: var(--gp-surface); --bs-accordion-color: var(--gp-text); --bs-accordion-border-color: var(--gp-border); --bs-accordion-btn-color: var(--gp-text); --bs-accordion-active-bg: #12303a; --bs-accordion-active-color: #fff; --bs-accordion-btn-focus-box-shadow: 0 0 0 .25rem rgba(60,195,212,.3);
    --bs-accordion-btn-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23e4ecef' stroke-linecap='round' stroke-linejoin='round'%3e%3cpath d='M2 5L8 11L14 5'/%3e%3c/svg%3e");
    --bs-accordion-btn-active-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%2374c7e4' stroke-linecap='round' stroke-linejoin='round'%3e%3cpath d='M2 5L8 11L14 5'/%3e%3c/svg%3e"); }
:root[data-theme="dark"] .list-group { --bs-list-group-bg: var(--gp-surface); --bs-list-group-color: var(--gp-text); --bs-list-group-border-color: var(--gp-border); }
:root[data-theme="dark"] .alert-info { --bs-alert-bg: #0f2c35; --bs-alert-color: #b8ecf7; --bs-alert-border-color: #1d5361; }
:root[data-theme="dark"] .alert-success { --bs-alert-bg: #0f2a1d; --bs-alert-color: #b3e6c8; --bs-alert-border-color: #1f5137; }
:root[data-theme="dark"] .alert-warning { --bs-alert-bg: #2d2408; --bs-alert-color: #ffe08a; --bs-alert-border-color: #5c4a10; }
:root[data-theme="dark"] .alert-danger { --bs-alert-bg: #2f1214; --bs-alert-color: #ffb3b8; --bs-alert-border-color: #6b2a30; }
:root[data-theme="dark"] .alert a { color: inherit !important; text-decoration: underline; }
:root[data-theme="dark"] .badge.bg-secondary { background-color: #4b5b63 !important; color: #fff !important; }
:root[data-theme="dark"] .badge.bg-light { background-color: var(--gp-surface-2) !important; color: var(--gp-text) !important; }
:root[data-theme="dark"] .gp-hours-badge.bg-primary, :root[data-theme="dark"] .badge.bg-primary { background-color: var(--gp-brand) !important; color: #fff !important; }
:root[data-theme="dark"] .badge.bg-success { background-color: #1f7a4d !important; color: #fff !important; }
:root[data-theme="dark"] .badge.bg-warning { background-color: #e0b13a !important; color: #1b1400 !important; }
/* 2026-10-20: amber highlight (C/O-kundnummer) – mörk text för WCAG AA */
:root[data-theme="dark"] .bg-warning:not(.badge):not(.text-warning):not([class*="bg-opacity"]) { background-color: #e0b13a !important; color: #1b1400 !important; font-weight: 600; }
:root[data-theme="dark"] .badge.bg-danger { background-color: #c0393f !important; color: #fff !important; }
:root[data-theme="dark"] .badge.bg-info { background-color: #1aa3b8 !important; color: #04181c !important; }

/* ---------- "Beställ från EU" photo band + footer ---------- */
:root[data-theme="dark"] .almost-footer-bg { background-color: #1b2a33; }
:root[data-theme="dark"] footer { background-color: var(--gp-surface); color: var(--gp-text); }
:root[data-theme="dark"] .border-footer { border-top-color: var(--gp-surface); }
:root[data-theme="dark"] footer .text-muted { color: var(--gp-muted) !important; }
:root[data-theme="dark"] footer a.text-muted, :root[data-theme="dark"] .footer-links a { color: var(--gp-muted) !important; }
:root[data-theme="dark"] .footer-links a:hover { color: var(--gp-link) !important; }
:root[data-theme="dark"] .footer-contact-link { color: var(--gp-link) !important; }
@media (max-width: 767.98px) {
    :root[data-theme="dark"] .footer-contact-link { background-color: var(--gp-surface-2); border-color: var(--gp-link); }
}

/* ---------- Misc ---------- */
:root[data-theme="dark"] .modal-content { background-color: var(--gp-surface); color: var(--gp-text); }
:root[data-theme="dark"] .btn-close { filter: invert(1) grayscale(100%) brightness(200%); }
:root[data-theme="dark"] #gp-consent, :root[data-theme="dark"] #gp-consent .card { background-color: var(--gp-surface-2) !important; color: var(--gp-text) !important; }
:root[data-theme="dark"] img.gp-gk-banner-img, :root[data-theme="dark"] .card-img-top, :root[data-theme="dark"] .card-img { filter: brightness(.92); }
:root[data-theme="dark"] ::selection { background: #1d5361; color: #fff; }

/* ---------- Dark photo variants (bottom/side curve recoloured to the dark card colour) ---------- */
:root[data-theme="dark"] img[src$="/0001.webp"] { content: url("../img/0001-dark.webp"); }
:root[data-theme="dark"] img[src$="/0002.webp"] { content: url("../img/0002-dark.webp"); }
:root[data-theme="dark"] img[src$="/0003.webp"] { content: url("../img/0003-dark.webp"); }
:root[data-theme="dark"] img[src$="/register.webp"] { content: url("../img/register-dark.webp"); }
:root[data-theme="dark"] img[src$="/register-02.webp"] { content: url("../img/register-02-dark.webp"); }
:root[data-theme="dark"] img[src$="/faq.webp"] { content: url("../img/faq-dark.webp"); }
:root[data-theme="dark"] img[src$="/contact.webp"] { content: url("../img/contact-dark.webp"); }

/* 2026-10-20: sticky bars (Albin) – same rules for auto (OS dark) and forced dark */
@media (prefers-color-scheme: dark) {
    /* nettbutikker.php: sticky search/filter bar (inline style has background:#f4f4f4) */
    :root:not([data-theme="light"]) .nbd-toolbar { background: var(--gp-bg); box-shadow: 0 8px 12px -10px rgba(0,0,0,.8); }
    :root:not([data-theme="light"]) .nbd-search-icon { color: #8796a0; }
    :root:not([data-theme="light"]) .nbd-chip { background: var(--gp-surface); color: var(--gp-link); border-color: #3f8da0; }
    :root:not([data-theme="light"]) .nbd-chip:hover { background: rgba(116,199,228,.14); color: #fff; }
    :root:not([data-theme="light"]) .nbd-chip:focus-visible { outline: 2px solid var(--gp-accent); outline-offset: 2px; }
    :root:not([data-theme="light"]) .nbd-chip.active, :root:not([data-theme="light"]) .nbd-chip.active:hover { background: var(--gp-brand); border-color: var(--gp-accent); color: #fff; }
    /* my-parcels.php: sticky tab bar (inline style has background:#fff) */
    :root:not([data-theme="light"]) .mp-tabs { background: var(--gp-surface); box-shadow: 0 2px 10px rgba(0,0,0,.6); }
    :root:not([data-theme="light"]) .mp-tabs .nav-link { color: var(--gp-link); }
    :root:not([data-theme="light"]) .mp-tabs .nav-link:hover { background: rgba(116,199,228,.12); color: #fff; }
    :root:not([data-theme="light"]) .mp-tabs .nav-link.active { background: var(--gp-brand); color: #fff; }
}
/* nettbutikker.php: sticky search/filter bar (inline style has background:#f4f4f4) */
:root[data-theme="dark"] .nbd-toolbar { background: var(--gp-bg); box-shadow: 0 8px 12px -10px rgba(0,0,0,.8); }
:root[data-theme="dark"] .nbd-search-icon { color: #8796a0; }
:root[data-theme="dark"] .nbd-chip { background: var(--gp-surface); color: var(--gp-link); border-color: #3f8da0; }
:root[data-theme="dark"] .nbd-chip:hover { background: rgba(116,199,228,.14); color: #fff; }
:root[data-theme="dark"] .nbd-chip:focus-visible { outline: 2px solid var(--gp-accent); outline-offset: 2px; }
:root[data-theme="dark"] .nbd-chip.active, :root[data-theme="dark"] .nbd-chip.active:hover { background: var(--gp-brand); border-color: var(--gp-accent); color: #fff; }
/* my-parcels.php: sticky tab bar (inline style has background:#fff) */
:root[data-theme="dark"] .mp-tabs { background: var(--gp-surface); box-shadow: 0 2px 10px rgba(0,0,0,.6); }
:root[data-theme="dark"] .mp-tabs .nav-link { color: var(--gp-link); }
:root[data-theme="dark"] .mp-tabs .nav-link:hover { background: rgba(116,199,228,.12); color: #fff; }
:root[data-theme="dark"] .mp-tabs .nav-link.active { background: var(--gp-brand); color: #fff; }