/* Lys teal (#E8F2F5): lys bakgrunn overalt, lys banner/header, minimalt mørkt */

html[data-ui="helsedir-lys-teal"] {
    color-scheme: light;

    /* Brand: medium teal, unngå mørk navy */
    --brand-primary: #047FA4;
    --brand-primary-mid: #2a9bc4;
    --brand-primary-dark: #025169;
    --accent: #047FA4;
    --accent-dark: #025169;

    /* Surfaces */
    --surface: #ffffff;
    --surface-muted: #f4f9fb;
    --body-background: #E8F2F5;

    /* Text */
    --text-primary: #1f3a42;
    --text-muted: #4b7a8a;
    --text-heading: #025169;

    /* Borders */
    --border-default: #a8cdd8;
    --border-subtle: #cce3eb;

    /* Header: lys teal, mørk tekst */
    --header-background: #E8F2F5;
    --header-text: #025169;
    --header-subtitle: rgba(2, 81, 105, 0.72);
    --header-stripe-width: 4px;
    --header-stripe-color: #047FA4;

    /* Nav: mørk tekst på lys bakgrunn */
    --nav-border-top: rgba(2, 81, 105, 0.12);
    --nav-tab-color: rgba(2, 81, 105, 0.78);
    --nav-tab-hover-bg: rgba(2, 81, 105, 0.08);
    --nav-tab-active-bg: transparent;
    --nav-tab-active-line: #047FA4;
    --nav-tab-active-shadow: inset 0 -3px 0 #047FA4;

    /* Logo */
    --logo-ntnu-filter: none;

    /* Info / cards */
    --info-tint-from: #E8F2F5;
    --info-tint-to: #f4f9fb;
    --info-border: #a8cdd8;
    --card-border-color: #a8cdd8;
    --card-top-stripe-color: #047FA4;

    /* Shadows */
    --shadow-sm: 0 1px 2px rgba(2, 81, 105, 0.05);
    --shadow-md: 0 4px 6px rgba(2, 81, 105, 0.08);
    --shadow-lg: 0 10px 18px rgba(2, 81, 105, 0.11);

    /* Footer */
    --footer-shadow: 0 -2px 8px rgba(2, 81, 105, 0.06);
    --footer-background: #E8F2F5;
    --footer-border-top-color: #a8cdd8;
    --footer-border-top-width: 3px;

    /* Focus / controls */
    --focus-ring: #047FA4;
    --focus-ring-soft: rgba(30, 122, 150, 0.18);
    --control-focus: #047FA4;
    --control-focus-soft: rgba(30, 122, 150, 0.16);

    /* Banner */
    --theme-banner-from: #cde8f0;
    --theme-banner-to: #E8F2F5;

    /* reuse-search icon: lys teal sirkel, mørk teal figur */
    --icon-reuse-bg: #E8F2F5;
    --icon-reuse-fg: #047FA4;
    --icon-reuse-stroke: #047FA4;

    /* FRISK aliases */
    --frisk-white: #ffffff;
    --frisk-logoblå-1: #025169;
    --frisk-logoblå-2: #047FA4;
    --frisk-neutral-light: #E8F2F5;
    --frisk-neutral-medium: #4b7a8a;
    --frisk-neutral-dark: #1f3a42;
    --frisk-blue-light: #E8F2F5;
    --frisk-blue-soft: #f4f9fb;
    --frisk-blue-border: #a8cdd8;
    --frisk-teal: #047FA4;
    --frisk-teal-light: #E8F2F5;
    --frisk-gray-50: #f4f9fb;
    --frisk-gray-100: #E8F2F5;
    --frisk-gray-700: #1f3a42;
    --frisk-shadow-md: 0 4px 6px rgba(2, 81, 105, 0.08);
    --frisk-shadow-lg: 0 10px 18px rgba(2, 81, 105, 0.11);
}

/* ── Header: force lys teal + mørk tekst ── */
html[data-ui="helsedir-lys-teal"] .header {
    background: #E8F2F5;
    box-shadow: 0 2px 8px rgba(2, 81, 105, 0.1);
    border-top: var(--header-stripe-width) solid var(--header-stripe-color);
}

html[data-ui="helsedir-lys-teal"] .header-title-link {
    color: #025169;
}

html[data-ui="helsedir-lys-teal"] .header-subtitle {
    color: rgba(2, 81, 105, 0.72);
}

/* ── Cards ── */
html[data-ui="helsedir-lys-teal"] .frisk-card.card {
    background: #ffffff;
    color: var(--text-primary);
    border-color: var(--border-default);
    border-top-color: var(--card-top-stripe-color);
    box-shadow: var(--shadow-md);
}

html[data-ui="helsedir-lys-teal"] .frisk-card .card-title {
    color: var(--text-heading);
}

/* ── Index sections ── */
html[data-ui="helsedir-lys-teal"] .index-section {
    background: #ffffff;
    border-color: var(--border-subtle);
    border-top-color: var(--accent);
}

html[data-ui="helsedir-lys-teal"] .index-section:hover {
    box-shadow: 0 6px 12px rgba(2, 81, 105, 0.1);
    border-color: var(--border-default);
}

html[data-ui="helsedir-lys-teal"] .index-section-title {
    color: var(--text-heading);
}

html[data-ui="helsedir-lys-teal"] .index-section-desc {
    color: var(--text-muted);
}

/* ── Buttons ── */
html[data-ui="helsedir-lys-teal"] .btn,
html[data-ui="helsedir-lys-teal"] .btn-secondary {
    background: var(--brand-primary);
    color: #ffffff;
    border-color: var(--brand-primary-dark);
}

html[data-ui="helsedir-lys-teal"] .btn:hover,
html[data-ui="helsedir-lys-teal"] .btn-secondary:hover {
    background: var(--brand-primary-dark);
    color: #ffffff;
}

/* ── Info cards ── */
html[data-ui="helsedir-lys-teal"] .info-card-blue {
    background: linear-gradient(135deg, #E8F2F5 0%, #f4f9fb 100%);
    border-color: var(--border-default);
    border-left-color: var(--brand-primary);
    color: var(--text-primary);
}

/* ── Dataset stats ── */
html[data-ui="helsedir-lys-teal"] .dataset-stat {
    background: #ffffff;
    border-color: var(--border-subtle);
}

html[data-ui="helsedir-lys-teal"] .dataset-stat-label {
    color: var(--text-muted);
}

html[data-ui="helsedir-lys-teal"] .dataset-stat-value {
    color: var(--text-heading);
}

/* ── Viz controls ── */
html[data-ui="helsedir-lys-teal"] .viz-controls-card {
    background: #ffffff;
    border-color: var(--border-default);
    color: var(--text-primary);
}

html[data-ui="helsedir-lys-teal"] .viz-controls-card .viz-controls-title {
    color: var(--text-heading);
}

html[data-ui="helsedir-lys-teal"] .viz-controls-card .viz-section-title,
html[data-ui="helsedir-lys-teal"] .viz-controls-card .viz-section-desc,
html[data-ui="helsedir-lys-teal"] .viz-controls-card .viz-controls-desc {
    color: var(--text-muted);
}

html[data-ui="helsedir-lys-teal"] .viz-controls-card .viz-section + .viz-section {
    border-top-color: var(--border-subtle);
}

html[data-ui="helsedir-lys-teal"] .viz-controls-card .viz-field label {
    color: var(--text-primary);
}

html[data-ui="helsedir-lys-teal"] .viz-controls-card .viz-btn-update {
    background: var(--brand-primary);
    color: #ffffff;
}

html[data-ui="helsedir-lys-teal"] .viz-controls-card .viz-btn-update:hover {
    background: var(--brand-primary-dark);
}

html[data-ui="helsedir-lys-teal"] .viz-graph-container {
    background: #f4f9fb;
    border-color: var(--border-default);
}

html[data-ui="helsedir-lys-teal"] .viz-graph-setting-label,
html[data-ui="helsedir-lys-teal"] .viz-legend-item,
html[data-ui="helsedir-lys-teal"] .precomputed-legend-item {
    color: var(--text-primary);
}

/* ── Form inputs & selects ── */
html[data-ui="helsedir-lys-teal"] .viz-native-select,
html[data-ui="helsedir-lys-teal"] .viz-graph-num,
html[data-ui="helsedir-lys-teal"] .viz-controls-card input[type="number"],
html[data-ui="helsedir-lys-teal"] .viz-controls-card #viz-category-select {
    background-color: #ffffff;
    color: var(--text-primary);
    border-color: var(--border-default);
}

html[data-ui="helsedir-lys-teal"] .viz-native-select:hover {
    border-color: var(--brand-primary);
}

html[data-ui="helsedir-lys-teal"] .viz-native-select:focus,
html[data-ui="helsedir-lys-teal"] .viz-graph-num:focus,
html[data-ui="helsedir-lys-teal"] .viz-controls-card input[type="number"]:focus,
html[data-ui="helsedir-lys-teal"] .viz-controls-card #viz-category-select:focus {
    border-color: var(--brand-primary);
    box-shadow: 0 0 0 2px var(--focus-ring-soft);
}

/* ── Search result box ── */
html[data-ui="helsedir-lys-teal"] .search-result-content-box {
    background: #f4f9fb;
    border-color: var(--border-default);
}

html[data-ui="helsedir-lys-teal"] .search-result-content-text {
    color: var(--text-primary);
}

/* ── Export buttons ── */
html[data-ui="helsedir-lys-teal"] .export-buttons button:nth-child(3) {
    background-color: color-mix(in srgb, #047FA4 10%, #ffffff);
    color: var(--brand-primary-dark);
}

html[data-ui="helsedir-lys-teal"] .export-buttons button:nth-child(4) {
    background-color: #ffffff;
    color: var(--brand-primary);
    border-color: var(--border-default);
}

/* ── Section divider ── */
html[data-ui="helsedir-lys-teal"] .section-divider::before {
    background: var(--brand-primary);
}

/* ── Footer ── */
html[data-ui="helsedir-lys-teal"] .footer {
    background: var(--footer-background);
    border-top-color: var(--footer-border-top-color);
}

html[data-ui="helsedir-lys-teal"] .footer-text,
html[data-ui="helsedir-lys-teal"] .footer-disclaimer {
    color: var(--text-muted);
}

/* ── Tailwind helsedir-* overrides ── */
html[data-ui="helsedir-lys-teal"] .bg-white {
    background-color: #ffffff !important;
}

html[data-ui="helsedir-lys-teal"] .bg-helsedir-blue,
html[data-ui="helsedir-lys-teal"] .bg-helsedir-blue-dark,
html[data-ui="helsedir-lys-teal"] .bg-helsedir-cherry {
    background-color: #047FA4 !important;
}

html[data-ui="helsedir-lys-teal"] .hover\:bg-helsedir-blue-dark:hover,
html[data-ui="helsedir-lys-teal"] .hover\:bg-helsedir-blue:hover {
    background-color: #025169 !important;
}

html[data-ui="helsedir-lys-teal"] .text-helsedir-blue,
html[data-ui="helsedir-lys-teal"] .text-helsedir-blue-dark {
    color: #025169 !important;
}

html[data-ui="helsedir-lys-teal"] .border-helsedir-blue,
html[data-ui="helsedir-lys-teal"] .border-helsedir-blue-dark {
    border-color: #047FA4 !important;
}

html[data-ui="helsedir-lys-teal"] .bg-helsedir-blue-light,
html[data-ui="helsedir-lys-teal"] .bg-helsedir-cherry-light {
    background-color: #E8F2F5 !important;
}

html[data-ui="helsedir-lys-teal"] .bg-helsedir-neutral-light {
    background-color: #E8F2F5 !important;
}

/* ── Scrollbar ── */
html[data-ui="helsedir-lys-teal"] ::-webkit-scrollbar-track {
    background: #E8F2F5;
}

html[data-ui="helsedir-lys-teal"] ::-webkit-scrollbar-thumb {
    background: #a8cdd8;
}

html[data-ui="helsedir-lys-teal"] ::-webkit-scrollbar-thumb:hover {
    background: #047FA4;
}
