/*
 * Lagerboks – samtykkebanner. «Godta alle» og «Avvis alle» har bevisst samme utseende.
 * Alt er avgrenset med ID slik at temaet (Jupiter) og sidens egne stiler ikke slår gjennom.
 */
.lgbx-consent[hidden],
.lgbx-consent-reopen[hidden],
.lgbx-consent [hidden] { display: none !important; }

#lgbx-consent,
#lgbx-consent-reopen,
.lgbx-cookie-overview {
    --lgbx-blue: #0077b6;
    --lgbx-blue-dark: #005f92;
    --lgbx-blue-soft: #e8f6fc;
    --lgbx-accent: #009edb;
    --lgbx-ink: #14191f;
    --lgbx-text: #4a5561;
    --lgbx-line: #e4e9ee;
}

/* ── Kortet ─────────────────────────────────────── */

#lgbx-consent {
    position: fixed;
    left: 24px;
    bottom: 24px;
    z-index: 2147483000;
    width: calc(100% - 48px);
    max-width: 440px;
    margin: 0;
    padding: 0;
    /*
     * Systemskrift: sidens Open Sans finnes bare i vanlig vekt, og kunstig fet skrift blir utydelig.
     * !important fordi «Use Any Font» setter Open Sans med !important på h2, p og a.
     */
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.55;
    color: var(--lgbx-text);
    text-align: left;
}

#lgbx-consent *,
#lgbx-consent *::before,
#lgbx-consent *::after {
    box-sizing: border-box;
    font-family: inherit !important;
    letter-spacing: normal;
    text-transform: none;
}

#lgbx-consent svg {
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

#lgbx-consent .lgbx-consent__box {
    max-height: calc(100vh - 48px);
    overflow-y: auto;
    padding: 24px;
    background: #fff;
    border: 1px solid rgba(20, 25, 31, 0.06);
    border-radius: 14px;
    box-shadow: 0 1px 3px rgba(20, 25, 31, 0.06), 0 16px 48px rgba(20, 25, 31, 0.18);
    animation: lgbx-consent-in 0.32s cubic-bezier(0.2, 0.8, 0.2, 1);
}

#lgbx-consent .lgbx-consent__head {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 0 0 12px;
}

#lgbx-consent .lgbx-consent__icon {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: var(--lgbx-blue-soft);
    color: var(--lgbx-accent);
}

#lgbx-consent .lgbx-consent__icon svg { width: 20px; height: 20px; }

#lgbx-consent .lgbx-consent__title {
    margin: 0;
    padding: 0;
    border: 0;
    background: none;
    font-size: 17px;
    font-weight: 700;
    line-height: 1.3;
    color: var(--lgbx-ink);
}

#lgbx-consent .lgbx-consent__text {
    margin: 0 0 20px;
    padding: 0;
    font-size: 14px;
    line-height: 1.6;
    color: var(--lgbx-text);
}

/* ── Tilpass: kategorier med brytere ────────────── */

#lgbx-consent .lgbx-consent__choices {
    margin: -4px 0 20px;
    border-top: 1px solid var(--lgbx-line);
}

#lgbx-consent .lgbx-consent__choice {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin: 0;
    padding: 12px 0;
    border-bottom: 1px solid var(--lgbx-line);
    font-size: 14px;
    font-weight: 400;
    cursor: pointer;
}

#lgbx-consent .lgbx-consent__choice--fixed { cursor: default; }

#lgbx-consent .lgbx-consent__choice-text {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

#lgbx-consent .lgbx-consent__choice-title {
    font-size: 14px;
    font-weight: 600;
    line-height: 1.35;
    color: var(--lgbx-ink);
}

#lgbx-consent .lgbx-consent__choice-desc {
    font-size: 13px;
    line-height: 1.45;
    color: var(--lgbx-text);
}

#lgbx-consent .lgbx-consent__always {
    flex: 0 0 auto;
    font-size: 12px;
    font-weight: 600;
    color: #6b7682;
    white-space: nowrap;
}

#lgbx-consent .lgbx-consent__switch {
    -webkit-appearance: none;
    appearance: none;
    position: relative;
    display: inline-block;
    flex: 0 0 auto;
    width: 42px;
    height: 24px;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 999px;
    background: #c3ccd5;
    opacity: 1;
    visibility: visible;
    cursor: pointer;
    transition: background-color 0.18s ease;
}

#lgbx-consent .lgbx-consent__switch::before {
    content: "";
    position: absolute;
    top: 3px;
    left: 3px;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 1px 3px rgba(20, 25, 31, 0.3);
    transition: transform 0.18s ease;
}

#lgbx-consent .lgbx-consent__switch:checked { background: var(--lgbx-blue); }
#lgbx-consent .lgbx-consent__switch:checked::before { transform: translateX(18px); }
#lgbx-consent .lgbx-consent__switch:focus-visible { outline: 2px solid var(--lgbx-blue); outline-offset: 2px; }

/* ── Knapper ────────────────────────────────────── */

#lgbx-consent .lgbx-consent__actions {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

#lgbx-consent .lgbx-consent__pair {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}

#lgbx-consent .lgbx-consent__btn {
    -webkit-appearance: none;
    appearance: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 44px;
    margin: 0;
    padding: 10px 16px;
    border: 1.5px solid var(--lgbx-blue);
    border-radius: 8px;
    background: var(--lgbx-blue);
    box-shadow: none;
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.2;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
    transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

#lgbx-consent .lgbx-consent__btn:hover {
    background: var(--lgbx-blue-dark);
    border-color: var(--lgbx-blue-dark);
    color: #fff;
}

#lgbx-consent .lgbx-consent__btn--outline {
    background: #fff;
    color: var(--lgbx-blue);
}

#lgbx-consent .lgbx-consent__btn--outline:hover {
    background: var(--lgbx-blue-soft);
    border-color: var(--lgbx-blue);
    color: var(--lgbx-blue-dark);
}

#lgbx-consent .lgbx-consent__btn:focus-visible,
#lgbx-consent .lgbx-consent__link:focus-visible {
    outline: 2px solid var(--lgbx-blue);
    outline-offset: 2px;
}

/* ── Bunnlinje: Tilpass og personvern ───────────── */

#lgbx-consent .lgbx-consent__foot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin: 14px 0 0;
}

/* Prisberegner-siden gjør lenker små og blokkformede; overstyres her. */
#lgbx-consent .lgbx-consent__link {
    -webkit-appearance: none;
    appearance: none;
    display: inline-flex;
    align-items: center;
    gap: 2px;
    min-height: 0;
    margin: 0;
    padding: 4px 0;
    border: 0;
    border-radius: 4px;
    background: none;
    box-shadow: none;
    color: var(--lgbx-blue);
    font-size: 13px;
    font-weight: 600;
    line-height: 1.3;
    text-decoration: none;
    cursor: pointer;
}

#lgbx-consent .lgbx-consent__link svg { width: 16px; height: 16px; }
#lgbx-consent .lgbx-consent__link:hover { color: var(--lgbx-blue-dark); text-decoration: underline; }

#lgbx-consent .lgbx-consent__link--muted {
    color: var(--lgbx-text);
    font-weight: 400;
    text-decoration: underline;
    text-underline-offset: 2px;
}

#lgbx-consent .lgbx-consent__link--muted:hover { color: var(--lgbx-ink); }

/* ── Knappen for å endre valget senere ──────────── */

#lgbx-consent-reopen {
    -webkit-appearance: none;
    appearance: none;
    position: fixed;
    left: 16px;
    bottom: 16px;
    z-index: 2147482000;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    margin: 0;
    padding: 0;
    border: 1px solid rgba(20, 25, 31, 0.08);
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 4px 14px rgba(20, 25, 31, 0.16);
    color: var(--lgbx-accent);
    cursor: pointer;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

#lgbx-consent-reopen svg {
    width: 22px;
    height: 22px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

#lgbx-consent-reopen:hover { transform: translateY(-1px); box-shadow: 0 6px 18px rgba(20, 25, 31, 0.22); }
#lgbx-consent-reopen:focus-visible { outline: 2px solid var(--lgbx-blue); outline-offset: 2px; }

/* ── Cookie-oversikten (kortkode på personvernsiden) ── */

.lgbx-cookie-table { width: 100%; margin: 0 0 24px; border-collapse: collapse; font-size: 14px; }
.lgbx-cookie-table th,
.lgbx-cookie-table td { padding: 8px 12px; border-bottom: 1px solid var(--lgbx-line); text-align: left; vertical-align: top; }
.lgbx-cookie-table th { background: #f5f7f9; font-weight: 600; }

.lgbx-cookie-overview .lgbx-cookie-overview__btn {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    padding: 10px 20px;
    border: 0;
    border-radius: 8px;
    background: var(--lgbx-blue);
    color: #fff;
    font: inherit;
    font-weight: 600;
    cursor: pointer;
}

.lgbx-cookie-overview .lgbx-cookie-overview__btn:hover { background: var(--lgbx-blue-dark); }

/* ── Mobil: ark fra bunnen ──────────────────────── */

@media (max-width: 600px) {
    #lgbx-consent {
        left: 0;
        right: 0;
        bottom: 0;
        width: 100%;
        max-width: none;
    }

    #lgbx-consent .lgbx-consent__box {
        max-height: 88vh;
        padding: 20px 20px calc(20px + env(safe-area-inset-bottom, 0px));
        border-width: 1px 0 0;
        border-radius: 16px 16px 0 0;
        box-shadow: 0 -8px 32px rgba(20, 25, 31, 0.2);
    }
}

/* Prisberegneren har en fast chat-linje nederst på mobil; løft knappen over den. */
@media (max-width: 768px) {
    body:has(.lgbx-chat) #lgbx-consent-reopen { bottom: 84px; }
}

@keyframes lgbx-consent-in {
    from { opacity: 0; transform: translateY(12px); }
    to { opacity: 1; transform: none; }
}

@media (prefers-reduced-motion: reduce) {
    #lgbx-consent .lgbx-consent__box { animation: none; }
    #lgbx-consent .lgbx-consent__switch,
    #lgbx-consent .lgbx-consent__switch::before,
    #lgbx-consent-reopen { transition: none; }
}
