/* SPDX-License-Identifier: AGPL-3.0-or-later */
/* Adaptations neurodivergence / confort d’affichage (polices, axes, ambiances). */

.sc-skip-link {
    position: absolute;
    left: 1rem;
    top: -100px;
    z-index: 100;
    padding: 0.75rem 1rem;
    border-radius: 0.5rem;
    background: #1a3642;
    color: #fff;
    font-weight: 700;
    text-decoration: none;
}

.sc-skip-link:focus {
    top: 1rem;
    outline: 2px solid #65bca3;
    outline-offset: 2px;
}

@font-face {
    font-family: 'Atkinson Hyperlegible';
    src: url('../fonts/atkinson-hyperlegible/latin-400-normal.woff2') format('woff2');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Atkinson Hyperlegible';
    src: url('../fonts/atkinson-hyperlegible/latin-700-normal.woff2') format('woff2');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'OpenDyslexic';
    src: url('../fonts/opendyslexic/latin-400-normal.woff2') format('woff2');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'OpenDyslexic';
    src: url('../fonts/opendyslexic/latin-700-normal.woff2') format('woff2');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Lexend';
    src: url('../fonts/lexend/latin-400-normal.woff2') format('woff2');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Lexend';
    src: url('../fonts/lexend/latin-700-normal.woff2') format('woff2');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

html.sc-nd-font-atkinson,
html.sc-nd-font-atkinson body {
    font-family: 'Atkinson Hyperlegible', ui-sans-serif, system-ui, sans-serif;
}

html.sc-nd-font-opendyslexic,
html.sc-nd-font-opendyslexic body {
    font-family: 'OpenDyslexic', ui-sans-serif, system-ui, sans-serif;
}

html.sc-nd-font-lexend,
html.sc-nd-font-lexend body {
    font-family: 'Lexend', ui-sans-serif, system-ui, sans-serif;
}

html.sc-nd-font-arial,
html.sc-nd-font-arial body {
    font-family: Arial, Helvetica, sans-serif;
}

html.sc-nd-font-verdana,
html.sc-nd-font-verdana body {
    font-family: Verdana, Geneva, sans-serif;
}

.sc-font-preview-default,
.sc-font-preview-default * {
    font-family: ui-sans-serif, system-ui, sans-serif !important;
    font-synthesis: none;
}

.sc-font-preview-atkinson,
.sc-font-preview-atkinson * {
    font-family: 'Atkinson Hyperlegible', ui-sans-serif, system-ui, sans-serif !important;
    font-synthesis: none;
}

.sc-font-preview-opendyslexic,
.sc-font-preview-opendyslexic * {
    font-family: 'OpenDyslexic', ui-sans-serif, system-ui, sans-serif !important;
    font-synthesis: none;
}

.sc-font-preview-lexend,
.sc-font-preview-lexend * {
    font-family: 'Lexend', ui-sans-serif, system-ui, sans-serif !important;
    font-synthesis: none;
}

.sc-font-preview-arial,
.sc-font-preview-arial * {
    font-family: Arial, Helvetica, sans-serif !important;
    font-synthesis: none;
}

.sc-font-preview-verdana,
.sc-font-preview-verdana * {
    font-family: Verdana, Geneva, sans-serif !important;
    font-synthesis: none;
}

#interface-comfort .sc-font-preview-sample {
    font-weight: 400;
    line-height: 1.5;
    letter-spacing: normal;
}

#interface-comfort .sc-comfort-font-live-preview {
    margin-top: 0.75rem;
    padding: 0.75rem 1rem;
    border-radius: 0.5rem;
    border: 1px solid #e5e7eb;
    background: #f8fafc;
    font-weight: 400;
    font-size: 1rem;
    line-height: 1.55;
    color: #1f2937;
}

html.sc-nd-reading {
    font-size: 112.5%;
    line-height: 1.65;
    letter-spacing: 0.02em;
}

html.sc-nd-reading body {
    line-height: 1.65;
}

html.sc-nd-reading i,
html.sc-nd-reading em {
    font-style: normal;
    font-weight: 600;
}

html.sc-nd-focus .sc-alert-alive > .sc-accent-bar,
html.sc-nd-focus .sc-flow-in,
html.sc-nd-focus .sc-flow-stagger > .sc-flow-in {
    animation: none !important;
    opacity: 1 !important;
    transform: none !important;
}

html.sc-nd-sensory {
    --sc-motion-duration-instant: 0ms;
    --sc-motion-duration-quick: 0ms;
    --sc-accordion-duration: 0ms;
    --sc-motion-duration-flow: 0ms;
}

html.sc-nd-sensory body {
    background-color: #f7f8f7;
}

html.sc-nd-sensory .sc-alert-alive > .sc-accent-bar,
html.sc-nd-sensory .sc-flow-in,
html.sc-nd-sensory .sc-flow-stagger > .sc-flow-in,
html.sc-nd-sensory .sc-card-lift:hover,
html.sc-nd-sensory .sc-saved-flash {
    animation: none !important;
    transition: none !important;
}

@media (hover: hover) and (pointer: fine) {
    html.sc-nd-sensory .pfmp-hover-panel.pfmp-hover-panel-active .pfmp-collapsible.is-collapsed {
        max-height: 0;
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
    }

    html.sc-nd-sensory .pfmp-company-group.pfmp-company-hover .pfmp-company-details {
        max-height: 0;
        opacity: 0;
    }
}

html.sc-nd-motor a,
html.sc-nd-motor button,
html.sc-nd-motor [type='submit'],
html.sc-nd-motor [type='button'],
html.sc-nd-motor .sc-chip-lift,
html.sc-nd-motor select,
html.sc-nd-motor input:not([type='hidden']),
html.sc-nd-motor textarea {
    min-height: 3rem;
}

html.sc-nd-motor input:not([type='checkbox']):not([type='radio']):not([type='hidden']),
html.sc-nd-motor select,
html.sc-nd-motor textarea {
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
    font-size: 1.05rem;
}

/* Ambiances confort d’affichage — fond blanc, cadres et boutons colorés */
.sc-comfort-theme-swatch,
.sc-student-theme-swatch {
    flex-shrink: 0;
    width: 1.75rem;
    height: 1.75rem;
    margin-top: 0.125rem;
    border-radius: 0.5rem;
    border: 1px solid rgba(26, 54, 66, 0.18);
}
.sc-comfort-theme-swatch--grey,
.sc-student-theme-swatch--grey { background-color: #dde3e6; }
.sc-comfort-theme-swatch--peach,
.sc-student-theme-swatch--peach { background-color: #FFBE98; }
.sc-comfort-theme-swatch--magenta,
.sc-student-theme-swatch--magenta { background-color: #BB2649; }
.sc-comfort-theme-swatch--peri,
.sc-student-theme-swatch--peri { background-color: #6667AB; }
.sc-comfort-theme-swatch--mandarine,
.sc-student-theme-swatch--mandarine { background-color: #F18D3A; }
.sc-comfort-theme-swatch--sage,
.sc-student-theme-swatch--sage { background-color: #8FA87A; }
.sc-comfort-theme-swatch--coral,
.sc-student-theme-swatch--coral { background-color: #FF6F61; }

/* Curseur saturation — trait horizontal lisible */
.sc-comfort-saturation-range {
    --sc-comfort-range-track: #e2e8f0;
    --sc-comfort-range-fill: #6366f1;
    --sc-comfort-range-thumb: #4338ca;
    width: 100%;
    height: 1.75rem;
    margin: 0;
    background: transparent;
    cursor: pointer;
    -webkit-appearance: none;
    appearance: none;
}

.sc-comfort-saturation-range:focus {
    outline: none;
}

.sc-comfort-saturation-range:focus-visible::-webkit-slider-thumb {
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.35), 0 1px 3px rgba(15, 23, 42, 0.25);
}

.sc-comfort-saturation-range:focus-visible::-moz-range-thumb {
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.35), 0 1px 3px rgba(15, 23, 42, 0.25);
}

.sc-comfort-saturation-range::-webkit-slider-runnable-track {
    height: 0.375rem;
    border-radius: 9999px;
    background: linear-gradient(
        to right,
        var(--sc-comfort-range-fill) 0,
        var(--sc-comfort-range-fill) var(--sc-comfort-range-progress, 50%),
        var(--sc-comfort-range-track) var(--sc-comfort-range-progress, 50%),
        var(--sc-comfort-range-track) 100%
    );
}

.sc-comfort-saturation-range::-webkit-slider-thumb {
    -webkit-appearance: none;
    width: 2rem;
    height: 0.3125rem;
    margin-top: -0.125rem;
    border: none;
    border-radius: 9999px;
    background: var(--sc-comfort-range-thumb);
    box-shadow: 0 0 0 2px #ffffff, 0 1px 3px rgba(15, 23, 42, 0.28);
    cursor: grab;
}

.sc-comfort-saturation-range:active::-webkit-slider-thumb {
    cursor: grabbing;
}

.sc-comfort-saturation-range::-moz-range-track {
    height: 0.375rem;
    border-radius: 9999px;
    background: var(--sc-comfort-range-track);
}

.sc-comfort-saturation-range::-moz-range-progress {
    height: 0.375rem;
    border-radius: 9999px 0 0 9999px;
    background: var(--sc-comfort-range-fill);
}

.sc-comfort-saturation-range::-moz-range-thumb {
    width: 2rem;
    height: 0.3125rem;
    border: none;
    border-radius: 9999px;
    background: var(--sc-comfort-range-thumb);
    box-shadow: 0 0 0 2px #ffffff, 0 1px 3px rgba(15, 23, 42, 0.28);
    cursor: grab;
}

#interface-comfort {
    --sc-comfort-saturation: 100;
}

#interface-comfort .sc-comfort-theme-swatch {
    filter: saturate(calc(var(--sc-comfort-saturation, 100) * 1%));
    transition: filter 80ms linear;
}

@media (prefers-reduced-motion: reduce) {
    #interface-comfort .sc-comfort-theme-swatch {
        transition: none;
    }
}

.sc-comfort-saturation-block {
    --sc-comfort-saturation: 100;
    --sc-comfort-anchor: #cbd5e1;
    --sc-comfort-border: #94a3b8;
    --sc-comfort-btn-bg: #4338ca;
}

.sc-comfort-live-preview {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-top: 0.75rem;
}

.sc-comfort-live-preview__chip {
    display: inline-flex;
    align-items: center;
    min-height: 2.25rem;
    padding: 0.375rem 0.75rem;
    border-radius: 0.5rem;
    border: 1px solid #e5e7eb;
    font-size: 0.75rem;
    font-weight: 600;
    line-height: 1.2;
}

.sc-comfort-saturation-block .sc-comfort-live-preview__chip--frame {
    background: #ffffff;
    border-width: 2px;
    border-style: solid;
    border-color: color-mix(in srgb, var(--sc-comfort-border) 55%, #e5e7eb);
    filter: saturate(calc(var(--sc-comfort-saturation) * 1%));
}

.sc-comfort-saturation-block .sc-comfort-live-preview__chip--accent {
    background-color: var(--sc-comfort-anchor);
    border-color: color-mix(in srgb, var(--sc-comfort-border) 45%, transparent);
    filter: saturate(calc(var(--sc-comfort-saturation) * 1%));
}

.sc-comfort-saturation-block .sc-comfort-live-preview__chip--btn {
    color: #ffffff;
    background-color: var(--sc-comfort-btn-bg);
    border-color: transparent;
    filter: saturate(calc(var(--sc-comfort-saturation) * 1.35 * 1%));
}

.sc-comfort-live-preview.sc-comfort-theme-grey {
    --sc-comfort-anchor: #7b8890;
    --sc-comfort-border: #7b8890;
    --sc-comfort-nav: #dde3e6;
    --sc-comfort-btn-bg: #4338ca;
}

.sc-comfort-live-preview.sc-comfort-theme-peach {
    --sc-comfort-anchor: #FFBE98;
    --sc-comfort-border: #E08B5C;
    --sc-comfort-btn-bg: color-mix(in srgb, #E08B5C 68%, #111827);
}

.sc-comfort-live-preview.sc-comfort-theme-magenta {
    --sc-comfort-anchor: #BB2649;
    --sc-comfort-border: #BB2649;
    --sc-comfort-btn-bg: color-mix(in srgb, #BB2649 68%, #111827);
}

.sc-comfort-live-preview.sc-comfort-theme-peri {
    --sc-comfort-anchor: #6667AB;
    --sc-comfort-border: #6667AB;
    --sc-comfort-btn-bg: color-mix(in srgb, #6667AB 68%, #111827);
}

.sc-comfort-live-preview.sc-comfort-theme-mandarine {
    --sc-comfort-anchor: #F18D3A;
    --sc-comfort-border: #D56B12;
    --sc-comfort-btn-bg: color-mix(in srgb, #D56B12 68%, #111827);
}

.sc-comfort-live-preview.sc-comfort-theme-sage {
    --sc-comfort-anchor: #8FA87A;
    --sc-comfort-border: #5A7350;
    --sc-comfort-btn-bg: color-mix(in srgb, #5A7350 68%, #111827);
}

.sc-comfort-live-preview.sc-comfort-theme-coral {
    --sc-comfort-anchor: #FF6F61;
    --sc-comfort-border: #E85A4F;
    --sc-comfort-btn-bg: color-mix(in srgb, #E85A4F 68%, #111827);
}

html.sc-comfort-theme-peach,
html.sc-student-theme-peach {
    --sc-comfort-anchor: #FFBE98;
    --sc-comfort-border: #E08B5C;
    --sc-comfort-nav: #FFE3D2;
    --sc-student-theme-anchor: #FFBE98;
    --sc-student-theme-nav: #FFE3D2;
    --sc-student-theme-border: #E08B5C;
}
html.sc-comfort-theme-magenta,
html.sc-student-theme-magenta {
    --sc-comfort-anchor: #BB2649;
    --sc-comfort-border: #BB2649;
    --sc-comfort-nav: #F8D5DE;
    --sc-student-theme-anchor: #BB2649;
    --sc-student-theme-nav: #F8D5DE;
    --sc-student-theme-border: #BB2649;
}
html.sc-comfort-theme-peri,
html.sc-student-theme-peri {
    --sc-comfort-anchor: #6667AB;
    --sc-comfort-border: #6667AB;
    --sc-comfort-nav: #E4E3F4;
    --sc-student-theme-anchor: #6667AB;
    --sc-student-theme-nav: #E4E3F4;
    --sc-student-theme-border: #6667AB;
}
html.sc-comfort-theme-mandarine,
html.sc-student-theme-mandarine {
    --sc-comfort-anchor: #F18D3A;
    --sc-comfort-border: #D56B12;
    --sc-comfort-nav: #FFE4C8;
    --sc-student-theme-anchor: #F18D3A;
    --sc-student-theme-nav: #FFE4C8;
    --sc-student-theme-border: #D56B12;
}
html.sc-comfort-theme-sage,
html.sc-student-theme-sage {
    --sc-comfort-anchor: #8FA87A;
    --sc-comfort-border: #5A7350;
    --sc-comfort-nav: #D4E2C8;
    --sc-student-theme-anchor: #8FA87A;
    --sc-student-theme-nav: #D4E2C8;
    --sc-student-theme-border: #5A7350;
}
html.sc-comfort-theme-coral,
html.sc-student-theme-coral {
    --sc-comfort-anchor: #FF6F61;
    --sc-comfort-border: #E85A4F;
    --sc-comfort-nav: #FFE0DC;
    --sc-student-theme-anchor: #FF6F61;
    --sc-student-theme-nav: #FFE0DC;
    --sc-student-theme-border: #E85A4F;
}

html:is(
    .sc-comfort-theme-peach,
    .sc-comfort-theme-magenta,
    .sc-comfort-theme-peri,
    .sc-comfort-theme-mandarine,
    .sc-comfort-theme-sage,
    .sc-comfort-theme-coral,
    .sc-student-theme-peach,
    .sc-student-theme-magenta,
    .sc-student-theme-peri,
    .sc-student-theme-mandarine,
    .sc-student-theme-sage,
    .sc-student-theme-coral
) {
    /* Fond page clair UNIQUEMENT hors mode sombre — sinon texte remappé clair sur blanc. */
    --sc-comfort-btn-bg: color-mix(in srgb, var(--sc-comfort-border) 68%, #111827);
    --sc-comfort-btn-hover: color-mix(in srgb, var(--sc-comfort-border) 78%, #111827);
    --sc-nav-student-bg: var(--sc-comfort-nav);
    --sc-nav-student-border: var(--sc-comfort-border);
    --sc-nav-teacher-bg: var(--sc-comfort-nav);
    --sc-nav-teacher-border: var(--sc-comfort-border);
    --sc-nav-pp-bg: var(--sc-comfort-nav);
    --sc-nav-pp-border: var(--sc-comfort-border);
    --sc-nav-prof-pro-bg: var(--sc-comfort-nav);
    --sc-nav-prof-pro-border: var(--sc-comfort-border);
    --sc-nav-referent-bg: var(--sc-comfort-nav);
    --sc-nav-referent-border: var(--sc-comfort-border);
    --sc-nav-ddfpt-bg: var(--sc-comfort-nav);
    --sc-nav-ddfpt-border: var(--sc-comfort-border);
    --sc-nav-direction-bg: var(--sc-comfort-nav);
    --sc-nav-direction-border: var(--sc-comfort-border);
    --sc-nav-admin-bg: var(--sc-comfort-nav);
    --sc-nav-admin-border: var(--sc-comfort-border);
    --sc-nav-delegate-bg: var(--sc-comfort-nav);
    --sc-nav-delegate-border: var(--sc-comfort-border);
}

html.sc-theme-light:is(
    .sc-comfort-theme-peach,
    .sc-comfort-theme-magenta,
    .sc-comfort-theme-peri,
    .sc-comfort-theme-mandarine,
    .sc-comfort-theme-sage,
    .sc-comfort-theme-coral,
    .sc-student-theme-peach,
    .sc-student-theme-magenta,
    .sc-student-theme-peri,
    .sc-student-theme-mandarine,
    .sc-student-theme-sage,
    .sc-student-theme-coral
) {
    --sc-page-bg: #ffffff;
}

/* Cadres — barres latérales et bordures de cartes */
html:is(
    .sc-comfort-theme-peach,
    .sc-comfort-theme-magenta,
    .sc-comfort-theme-peri,
    .sc-comfort-theme-mandarine,
    .sc-comfort-theme-sage,
    .sc-comfort-theme-coral,
    .sc-student-theme-peach,
    .sc-student-theme-magenta,
    .sc-student-theme-peri,
    .sc-student-theme-mandarine,
    .sc-student-theme-sage,
    .sc-student-theme-coral
) .sc-accent-bar {
    background-color: var(--sc-comfort-anchor);
    filter: saturate(calc(var(--sc-comfort-saturation, 100) * 1%));
}

/* Pas de filter sur les cartes : filter crée un containing block et clippe
   les CTA fixed (ex. « Enregistrer mon affichage » dans #interface-comfort). */
html:is(
    .sc-comfort-theme-peach,
    .sc-comfort-theme-magenta,
    .sc-comfort-theme-peri,
    .sc-comfort-theme-mandarine,
    .sc-comfort-theme-sage,
    .sc-comfort-theme-coral,
    .sc-student-theme-peach,
    .sc-student-theme-magenta,
    .sc-student-theme-peri,
    .sc-student-theme-mandarine,
    .sc-student-theme-sage,
    .sc-student-theme-coral
) .rounded-xl.border.border-gray-200,
html:is(
    .sc-comfort-theme-peach,
    .sc-comfort-theme-magenta,
    .sc-comfort-theme-peri,
    .sc-comfort-theme-mandarine,
    .sc-comfort-theme-sage,
    .sc-comfort-theme-coral,
    .sc-student-theme-peach,
    .sc-student-theme-magenta,
    .sc-student-theme-peri,
    .sc-student-theme-mandarine,
    .sc-student-theme-sage,
    .sc-student-theme-coral
) .rounded-lg.border.border-gray-200 {
    border-color: color-mix(in srgb, var(--sc-comfort-border) 42%, #e5e7eb);
}

/* Boutons principaux — couleur dédiée, sans filter (évite de casser position:fixed) */
html:is(
    .sc-comfort-theme-peach,
    .sc-comfort-theme-magenta,
    .sc-comfort-theme-peri,
    .sc-comfort-theme-mandarine,
    .sc-comfort-theme-sage,
    .sc-comfort-theme-coral,
    .sc-student-theme-peach,
    .sc-student-theme-magenta,
    .sc-student-theme-peri,
    .sc-student-theme-mandarine,
    .sc-student-theme-sage,
    .sc-student-theme-coral
) .bg-indigo-600 {
    background-color: var(--sc-comfort-btn-bg);
}

html:is(
    .sc-comfort-theme-peach,
    .sc-comfort-theme-magenta,
    .sc-comfort-theme-peri,
    .sc-comfort-theme-mandarine,
    .sc-comfort-theme-sage,
    .sc-comfort-theme-coral,
    .sc-student-theme-peach,
    .sc-student-theme-magenta,
    .sc-student-theme-peri,
    .sc-student-theme-mandarine,
    .sc-student-theme-sage,
    .sc-student-theme-coral
) .hover\:bg-indigo-700:hover {
    background-color: var(--sc-comfort-btn-hover);
}

/* Chrome navigation — tous les rôles (élève, enseignant, PP, …) */
html:is(
    .sc-comfort-theme-peach,
    .sc-comfort-theme-magenta,
    .sc-comfort-theme-peri,
    .sc-comfort-theme-mandarine,
    .sc-comfort-theme-sage,
    .sc-comfort-theme-coral,
    .sc-student-theme-peach,
    .sc-student-theme-magenta,
    .sc-student-theme-peri,
    .sc-student-theme-mandarine,
    .sc-student-theme-sage,
    .sc-student-theme-coral
) .sc-accent-bar--stgab-grey {
    background-color: var(--sc-comfort-anchor);
}

html:is(
    .sc-comfort-theme-peach,
    .sc-comfort-theme-magenta,
    .sc-comfort-theme-peri,
    .sc-comfort-theme-mandarine,
    .sc-comfort-theme-sage,
    .sc-comfort-theme-coral,
    .sc-student-theme-peach,
    .sc-student-theme-magenta,
    .sc-student-theme-peri,
    .sc-student-theme-mandarine,
    .sc-student-theme-sage,
    .sc-student-theme-coral
) .bg-stgab-grey-soft {
    background-color: var(--sc-comfort-nav);
}

html:is(
    .sc-comfort-theme-peach,
    .sc-comfort-theme-magenta,
    .sc-comfort-theme-peri,
    .sc-comfort-theme-mandarine,
    .sc-comfort-theme-sage,
    .sc-comfort-theme-coral,
    .sc-student-theme-peach,
    .sc-student-theme-magenta,
    .sc-student-theme-peri,
    .sc-student-theme-mandarine,
    .sc-student-theme-sage,
    .sc-student-theme-coral
) .bg-stgab-grey\/20 {
    background-color: color-mix(in srgb, var(--sc-comfort-anchor) 28%, white);
}

html:is(
    .sc-comfort-theme-peach,
    .sc-comfort-theme-magenta,
    .sc-comfort-theme-peri,
    .sc-comfort-theme-mandarine,
    .sc-comfort-theme-sage,
    .sc-comfort-theme-coral,
    .sc-student-theme-peach,
    .sc-student-theme-magenta,
    .sc-student-theme-peri,
    .sc-student-theme-mandarine,
    .sc-student-theme-sage,
    .sc-student-theme-coral
) .hover\:bg-stgab-grey\/15:hover {
    background-color: color-mix(in srgb, var(--sc-comfort-anchor) 18%, white);
}

html:is(
    .sc-comfort-theme-peach,
    .sc-comfort-theme-magenta,
    .sc-comfort-theme-peri,
    .sc-comfort-theme-mandarine,
    .sc-comfort-theme-sage,
    .sc-comfort-theme-coral,
    .sc-student-theme-peach,
    .sc-student-theme-magenta,
    .sc-student-theme-peri,
    .sc-student-theme-mandarine,
    .sc-student-theme-sage,
    .sc-student-theme-coral
) [class*="border-stgab-grey/"] {
    border-color: color-mix(in srgb, var(--sc-comfort-border) 35%, transparent);
}

html:is(
    .sc-comfort-theme-peach,
    .sc-comfort-theme-magenta,
    .sc-comfort-theme-peri,
    .sc-comfort-theme-mandarine,
    .sc-comfort-theme-sage,
    .sc-comfort-theme-coral,
    .sc-student-theme-peach,
    .sc-student-theme-magenta,
    .sc-student-theme-peri,
    .sc-student-theme-mandarine,
    .sc-student-theme-sage,
    .sc-student-theme-coral
) [class*="sc-nav-logo-accent--"],
html:is(
    .sc-comfort-theme-peach,
    .sc-comfort-theme-magenta,
    .sc-comfort-theme-peri,
    .sc-comfort-theme-mandarine,
    .sc-comfort-theme-sage,
    .sc-comfort-theme-coral,
    .sc-student-theme-peach,
    .sc-student-theme-magenta,
    .sc-student-theme-peri,
    .sc-student-theme-mandarine,
    .sc-student-theme-sage,
    .sc-student-theme-coral
) [class*="sc-nav-user-text--"],
html:is(
    .sc-comfort-theme-peach,
    .sc-comfort-theme-magenta,
    .sc-comfort-theme-peri,
    .sc-comfort-theme-mandarine,
    .sc-comfort-theme-sage,
    .sc-comfort-theme-coral,
    .sc-student-theme-peach,
    .sc-student-theme-magenta,
    .sc-student-theme-peri,
    .sc-student-theme-mandarine,
    .sc-student-theme-sage,
    .sc-student-theme-coral
) [class*="sc-nav-mobile-btn--"],
html:is(
    .sc-comfort-theme-peach,
    .sc-comfort-theme-magenta,
    .sc-comfort-theme-peri,
    .sc-comfort-theme-mandarine,
    .sc-comfort-theme-sage,
    .sc-comfort-theme-coral,
    .sc-student-theme-peach,
    .sc-student-theme-magenta,
    .sc-student-theme-peri,
    .sc-student-theme-mandarine,
    .sc-student-theme-sage,
    .sc-student-theme-coral
) [class*="sc-nav-section--"] {
    color: var(--sc-comfort-border);
}

html:is(
    .sc-comfort-theme-peach,
    .sc-comfort-theme-magenta,
    .sc-comfort-theme-peri,
    .sc-comfort-theme-mandarine,
    .sc-comfort-theme-sage,
    .sc-comfort-theme-coral,
    .sc-student-theme-peach,
    .sc-student-theme-magenta,
    .sc-student-theme-peri,
    .sc-student-theme-mandarine,
    .sc-student-theme-sage,
    .sc-student-theme-coral
) [class*="sc-nav-avatar--"] {
    background: color-mix(in srgb, var(--sc-comfort-anchor) 38%, white);
    color: var(--sc-comfort-border);
    border-color: color-mix(in srgb, var(--sc-comfort-border) 48%, transparent);
}

html:is(
    .sc-comfort-theme-peach,
    .sc-comfort-theme-magenta,
    .sc-comfort-theme-peri,
    .sc-comfort-theme-mandarine,
    .sc-comfort-theme-sage,
    .sc-comfort-theme-coral,
    .sc-student-theme-peach,
    .sc-student-theme-magenta,
    .sc-student-theme-peri,
    .sc-student-theme-mandarine,
    .sc-student-theme-sage,
    .sc-student-theme-coral
) :is(
    .sc-nav-badge--student,
    .sc-nav-badge--teacher,
    .sc-nav-badge--pp,
    .sc-nav-badge--prof-pro,
    .sc-nav-badge--referent,
    .sc-nav-badge--ddfpt,
    .sc-nav-badge--direction,
    .sc-nav-badge--admin,
    .sc-nav-badge--delegate
) {
    background: color-mix(in srgb, var(--sc-comfort-anchor) 32%, white);
    color: var(--stgab-navy-dark);
    border-color: color-mix(in srgb, var(--sc-comfort-border) 42%, transparent);
}

html:is(
    .sc-comfort-theme-peach,
    .sc-comfort-theme-magenta,
    .sc-comfort-theme-peri,
    .sc-comfort-theme-mandarine,
    .sc-comfort-theme-sage,
    .sc-comfort-theme-coral,
    .sc-student-theme-peach,
    .sc-student-theme-magenta,
    .sc-student-theme-peri,
    .sc-student-theme-mandarine,
    .sc-student-theme-sage,
    .sc-student-theme-coral
) [class*="sc-nav-user-pill--"] {
    background: color-mix(in srgb, var(--sc-comfort-anchor) 22%, white);
    border-color: color-mix(in srgb, var(--sc-comfort-border) 42%, transparent);
}

html:is(
    .sc-comfort-theme-peach,
    .sc-comfort-theme-magenta,
    .sc-comfort-theme-peri,
    .sc-comfort-theme-mandarine,
    .sc-comfort-theme-sage,
    .sc-comfort-theme-coral,
    .sc-student-theme-peach,
    .sc-student-theme-magenta,
    .sc-student-theme-peri,
    .sc-student-theme-mandarine,
    .sc-student-theme-sage,
    .sc-student-theme-coral
) .sc-nav-bar .sc-nav-link--idle:hover {
    border-color: color-mix(in srgb, var(--sc-comfort-border) 55%, transparent);
}

html:is(
    .sc-comfort-theme-peach,
    .sc-comfort-theme-magenta,
    .sc-comfort-theme-peri,
    .sc-comfort-theme-mandarine,
    .sc-comfort-theme-sage,
    .sc-comfort-theme-coral,
    .sc-student-theme-peach,
    .sc-student-theme-magenta,
    .sc-student-theme-peri,
    .sc-student-theme-mandarine,
    .sc-student-theme-sage,
    .sc-student-theme-coral
) [class*="sc-nav-mobile-btn--"]:hover {
    background: color-mix(in srgb, var(--sc-comfort-anchor) 22%, white);
}

html:is(
    .sc-comfort-theme-peach,
    .sc-comfort-theme-magenta,
    .sc-comfort-theme-peri,
    .sc-comfort-theme-mandarine,
    .sc-comfort-theme-sage,
    .sc-comfort-theme-coral,
    .sc-student-theme-peach,
    .sc-student-theme-magenta,
    .sc-student-theme-peri,
    .sc-student-theme-mandarine,
    .sc-student-theme-sage,
    .sc-student-theme-coral
) [class*="sc-nav-mobile-home--"] {
    color: var(--stgab-navy-dark);
    background: color-mix(in srgb, var(--sc-comfort-anchor) 28%, white);
    border-color: var(--sc-comfort-border);
}

html:is(
    .sc-comfort-theme-peach,
    .sc-comfort-theme-magenta,
    .sc-comfort-theme-peri,
    .sc-comfort-theme-mandarine,
    .sc-comfort-theme-sage,
    .sc-comfort-theme-coral,
    .sc-student-theme-peach,
    .sc-student-theme-magenta,
    .sc-student-theme-peri,
    .sc-student-theme-mandarine,
    .sc-student-theme-sage,
    .sc-student-theme-coral
) [class*="sc-site-footer--"] {
    background-color: color-mix(in srgb, var(--sc-comfort-nav) 55%, white);
    border-top-color: color-mix(in srgb, var(--sc-comfort-border) 35%, transparent);
    color: var(--stgab-navy-muted);
}

/* Calme gris — bandeau de tous les rôles (pas le rose/rouge enseignant). */
html.sc-comfort-theme-grey {
    --sc-comfort-anchor: var(--stgab-grey);
    --sc-comfort-border: var(--stgab-grey);
    --sc-comfort-nav: #dde3e6;
    --sc-nav-student-bg: var(--sc-comfort-nav);
    --sc-nav-student-border: var(--sc-comfort-border);
    --sc-nav-teacher-bg: var(--sc-comfort-nav);
    --sc-nav-teacher-border: var(--sc-comfort-border);
    --sc-nav-pp-bg: var(--sc-comfort-nav);
    --sc-nav-pp-border: var(--sc-comfort-border);
    --sc-nav-prof-pro-bg: var(--sc-comfort-nav);
    --sc-nav-prof-pro-border: var(--sc-comfort-border);
    --sc-nav-referent-bg: var(--sc-comfort-nav);
    --sc-nav-referent-border: var(--sc-comfort-border);
    --sc-nav-ddfpt-bg: var(--sc-comfort-nav);
    --sc-nav-ddfpt-border: var(--sc-comfort-border);
    --sc-nav-direction-bg: var(--sc-comfort-nav);
    --sc-nav-direction-border: var(--sc-comfort-border);
    --sc-nav-admin-bg: var(--sc-comfort-nav);
    --sc-nav-admin-border: var(--sc-comfort-border);
    --sc-nav-delegate-bg: var(--sc-comfort-nav);
    --sc-nav-delegate-border: var(--sc-comfort-border);
}

html.sc-comfort-theme-grey [class*="sc-nav-logo-accent--"],
html.sc-comfort-theme-grey [class*="sc-nav-user-text--"],
html.sc-comfort-theme-grey [class*="sc-nav-mobile-btn--"],
html.sc-comfort-theme-grey [class*="sc-nav-section--"] {
    color: var(--sc-comfort-border);
}

html.sc-comfort-theme-grey [class*="sc-nav-avatar--"] {
    background: color-mix(in srgb, var(--sc-comfort-anchor) 38%, white);
    color: var(--sc-comfort-border);
    border-color: color-mix(in srgb, var(--sc-comfort-border) 48%, transparent);
}

html.sc-comfort-theme-grey :is(
    .sc-nav-badge--student,
    .sc-nav-badge--teacher,
    .sc-nav-badge--pp,
    .sc-nav-badge--prof-pro,
    .sc-nav-badge--referent,
    .sc-nav-badge--ddfpt,
    .sc-nav-badge--direction,
    .sc-nav-badge--admin,
    .sc-nav-badge--delegate
) {
    background: color-mix(in srgb, var(--sc-comfort-anchor) 32%, white);
    color: var(--stgab-navy-dark);
    border-color: color-mix(in srgb, var(--sc-comfort-border) 42%, transparent);
}

html.sc-comfort-theme-grey [class*="sc-nav-user-pill--"] {
    background: color-mix(in srgb, var(--sc-comfort-anchor) 22%, white);
    border-color: color-mix(in srgb, var(--sc-comfort-border) 42%, transparent);
}

html.sc-comfort-theme-grey .sc-nav-bar .sc-nav-link--idle:hover {
    border-color: color-mix(in srgb, var(--sc-comfort-border) 55%, transparent);
}

html.sc-comfort-theme-grey [class*="sc-nav-mobile-btn--"]:hover {
    background: color-mix(in srgb, var(--sc-comfort-anchor) 22%, white);
}

html.sc-comfort-theme-grey [class*="sc-nav-mobile-home--"] {
    color: var(--stgab-navy-dark);
    background: color-mix(in srgb, var(--sc-comfort-anchor) 28%, white);
    border-color: var(--sc-comfort-border);
}

html.sc-comfort-theme-grey [class*="sc-site-footer--"] {
    background-color: color-mix(in srgb, var(--sc-comfort-nav) 55%, white);
    border-top-color: color-mix(in srgb, var(--sc-comfort-border) 35%, transparent);
    color: var(--stgab-navy-muted);
}

/*
 * Les ambiances sont chargées après le thème global. En mode sombre, leurs
 * mélanges au blanc doivent rester sombres pour conserver un texte lisible.
 * Critique : ne jamais laisser --sc-page-bg blanc (contraste catastrophique
 * avec le texte remappé clair du thème sombre).
 */
html.sc-theme-dark[class*="sc-comfort-theme-"],
html.sc-theme-dark[class*="sc-student-theme-"] {
    --sc-page-bg: #0b1216;
    --sc-surface-bg: #152028;
    --sc-surface-elevated: #1e2c35;
    --sc-input-bg: #101920;
    --sc-text: #f1f5f7;
    --sc-text-muted: #c8d4db;
    --sc-text-subtle: #a8b8c0;
    --sc-comfort-nav: color-mix(in srgb, var(--sc-comfort-anchor) 22%, #0b1216);
    --sc-nav-student-bg: var(--sc-comfort-nav);
    --sc-nav-teacher-bg: var(--sc-comfort-nav);
    --sc-nav-pp-bg: var(--sc-comfort-nav);
    --sc-nav-prof-pro-bg: var(--sc-comfort-nav);
    --sc-nav-referent-bg: var(--sc-comfort-nav);
    --sc-nav-ddfpt-bg: var(--sc-comfort-nav);
    --sc-nav-direction-bg: var(--sc-comfort-nav);
    --sc-nav-admin-bg: var(--sc-comfort-nav);
    --sc-nav-delegate-bg: var(--sc-comfort-nav);
}

html.sc-theme-dark[class*="sc-comfort-theme-"] :is(
    [class*="sc-nav-avatar--"],
    [class*="sc-nav-user-pill--"],
    [class*="sc-nav-mobile-home--"],
    .sc-nav-badge--student,
    .sc-nav-badge--teacher,
    .sc-nav-badge--pp,
    .sc-nav-badge--prof-pro,
    .sc-nav-badge--referent,
    .sc-nav-badge--ddfpt,
    .sc-nav-badge--direction,
    .sc-nav-badge--admin,
    .sc-nav-badge--delegate
) {
    background: color-mix(in srgb, var(--sc-comfort-anchor) 24%, #0b1216);
    color: var(--sc-text);
}

html.sc-theme-dark[class*="sc-comfort-theme-"] [class*="sc-site-footer--"] {
    background-color: color-mix(in srgb, var(--sc-comfort-anchor) 12%, #0b1216);
    color: var(--sc-text-muted);
}

/* Softs confort (nav claire) → surface sombre + texte clair */
html.sc-theme-dark[class*="sc-comfort-theme-"] :is(
    .bg-stgab-grey-soft,
    .bg-stgab-teal-soft,
    .bg-stgab-purple-soft,
    .bg-stgab-red-soft,
    .bg-stgab-slate-soft,
    .bg-stgab-cyan-soft
),
html.sc-theme-dark[class*="sc-student-theme-"] :is(
    .bg-stgab-grey-soft,
    .bg-stgab-teal-soft,
    .bg-stgab-purple-soft,
    .bg-stgab-red-soft,
    .bg-stgab-slate-soft,
    .bg-stgab-cyan-soft
) {
    background-color: var(--sc-surface-elevated, #1e2c35) !important;
    color: var(--sc-text) !important;
}

/* Composants à couleurs figées déclarés après le socle sombre. */
html.sc-theme-dark :is(
    .sc-page-content-editor-modal__panel,
    .sc-page-content-editor-modal__editor .ql-picker-options,
    .ddfpt-combobox-panel,
    .meeting-slot-detail,
    .live-evidence-viewer__file,
    .live-evidence-viewer__close,
    .sc-cal-content-tip__panel,
    .sc-cal-event-modal-panel,
    .sc-timetable-grid,
    .sc-quiz-editor-entry
) {
    background-color: var(--sc-surface-bg) !important;
    color: var(--sc-text) !important;
    border-color: #71858f !important;
}

html.sc-theme-dark :is(
    .ddfpt-form input,
    .ddfpt-form select,
    .ddfpt-form textarea,
    .ddfpt-input,
    .ddfpt-select,
    .ddfpt-combobox-trigger,
    .sc-quiz-editor-input,
    .sc-quiz-editor-select
) {
    background-color: var(--sc-input-bg, #101920) !important;
    color: var(--sc-text) !important;
    border-color: var(--sc-border-strong, #7a909c) !important;
}

html.sc-theme-dark :is(
    .ddfpt-form li label,
    .ddfpt-label,
    .ddfpt-combobox-option,
    .ddfpt-combobox-value.is-placeholder,
    .meeting-slot-period-head,
    .meeting-slot-day-head,
    .meeting-slot-period-label span,
    .meeting-slot-period-hint,
    .live-evidence-file-label,
    .sc-timetable-grid__head,
    .sc-timetable-grid__time,
    .sc-quiz-editor-zone-head,
    .sc-quiz-editor-entry-title,
    .sc-quiz-editor-field-label
) {
    color: var(--sc-text-muted) !important;
}

html.sc-theme-dark :is(
    .ddfpt-combobox-option:hover,
    .ddfpt-combobox-option.is-selected,
    .ddfpt-combobox--active .ddfpt-combobox-trigger,
    .sc-week-pill,
    .sc-week-day-pan:hover
) {
    background-color: var(--sc-hover-menu) !important;
    color: var(--sc-text) !important;
}

html.sc-theme-dark .meeting-participant-scroll {
    background:
        linear-gradient(var(--sc-surface-bg), transparent),
        linear-gradient(transparent, var(--sc-surface-bg)) 0 100%,
        radial-gradient(farthest-side at 50% 0, rgba(201, 213, 219, 0.22), transparent),
        radial-gradient(farthest-side at 50% 100%, rgba(201, 213, 219, 0.22), transparent) 0 100%;
    background-repeat: no-repeat;
    background-size: 100% 1.5rem, 100% 1.5rem, 100% 0.75rem, 100% 0.75rem;
    background-attachment: local, local, scroll, scroll;
}

html.sc-theme-dark :is(
    .meeting-slot-bar,
    .sc-week-event,
    [class*="sc-week-event--class-"],
    [class*="sc-week-event--cohort-"],
    [class*="sc-week-event--room-"],
    [class*="sc-week-event--pedago-"],
    .sc-week-event--pfmp-day,
    .sc-week-nested-activity--mine,
    .sc-timetable-grid__cell
) {
    background-color: #1c2b32 !important;
    color: var(--sc-text) !important;
}

html.sc-theme-dark [class*="sc-identity-chip--"] {
    background-color: #1c2b32 !important;
    color: var(--sc-text) !important;
}

html.sc-theme-dark :is(.sc-timetable-grid__head, .sc-quiz-editor-zone) {
    background-color: #152228 !important;
    border-color: #71858f !important;
}

html.sc-theme-dark .sc-quiz-kind-trigger {
    background: linear-gradient(180deg, #1c2b32, #152228);
    border-color: #71858f;
    color: var(--sc-text);
}

html.sc-theme-dark .sc-quiz-kind-panel,
html.sc-theme-dark .sc-quiz-kind-option {
    background-color: #1c2b32;
    border-color: #71858f;
    color: var(--sc-text);
}

html.sc-theme-dark .sc-quiz-kind-option-label {
    color: var(--sc-text);
}

html.sc-theme-dark .sc-quiz-kind-option-desc {
    color: var(--sc-text-muted);
}

html.sc-theme-dark .sc-quiz-kind-family[data-family='choix'],
html.sc-theme-dark .sc-quiz-kind-family[data-family='saisie'],
html.sc-theme-dark .sc-quiz-kind-family[data-family='manipulation'],
html.sc-theme-dark .sc-quiz-kind-family[data-family='media'] {
    background-color: #152228;
    border-color: #71858f;
}

html.sc-theme-dark .sc-quiz-kind-panel-body {
    background: #152228;
}

html.sc-theme-dark .sc-quiz-kind-option.is-selected {
    background-color: #24343c;
    border-color: #818cf8;
}

html.sc-theme-dark .sc-quiz-insert-btn {
    background-color: #1c2b32;
    border-color: #818cf8;
    color: #a5b4fc;
}

html.sc-theme-dark .sc-quiz-insert-btn:hover,
html.sc-theme-dark .sc-quiz-insert-btn:focus-visible {
    background-color: #24343c;
    color: #c7d2fe;
}

html.sc-theme-dark .sc-quiz-insert-line {
    background-color: #818cf8;
}

html.sc-theme-dark :is(.sc-timetable-grid__line, .sc-timetable-grid__time) {
    border-color: rgba(201, 213, 219, 0.32) !important;
}

/* Contraste renforcé — clair (le couple sombre HC est plus bas). */
html.sc-theme-light.sc-nd-high-contrast,
html.sc-nd-high-contrast:not(.sc-theme-dark) {
    --sc-page-bg: #ffffff;
    --sc-surface-bg: #ffffff;
    --sc-text: #050505;
    --sc-text-muted: #202020;
    --sc-text-subtle: #3f3f46;
    --sc-link: #003f8f;
    --sc-link-hover: #002c66;
    --sc-primary: #003f8f;
    --sc-primary-hover: #002c66;
    --sc-hover-menu: #e5e7eb;
    --sc-hover-surface: #f1f5f9;
}

html.sc-nd-high-contrast body,
html.sc-nd-high-contrast .sc-body {
    background-color: var(--sc-page-bg);
    color: var(--sc-text);
}

html.sc-nd-high-contrast :is(
    .text-gray-900, .text-gray-800, .text-gray-700, .text-gray-600, .text-gray-500,
    .text-slate-900, .text-slate-800, .text-slate-700, .text-slate-600, .text-slate-500,
    .text-zinc-900, .text-zinc-800, .text-zinc-700, .text-zinc-600, .text-zinc-500,
    .text-neutral-900, .text-neutral-800, .text-neutral-700, .text-neutral-600, .text-neutral-500,
    .text-stgab-navy, .text-stgab-navy-dark, .text-stgab-navy-muted,
    .text-stgab-grey, .text-stgab-grey-dark
) {
    color: var(--sc-text) !important;
}

html.sc-nd-high-contrast :is(
    .text-gray-400, .text-gray-300,
    .text-slate-400, .text-slate-300,
    .text-zinc-400, .text-zinc-300,
    .text-neutral-400, .text-neutral-300
) {
    color: var(--sc-text-muted) !important;
}

html.sc-nd-high-contrast :is(input, select, textarea) {
    background-color: var(--sc-surface-bg);
    color: var(--sc-text);
    border-color: currentColor !important;
    border-width: 2px;
}

html.sc-nd-high-contrast :is(input, textarea)::placeholder {
    color: var(--sc-text-muted);
    opacity: 1;
}

html.sc-nd-high-contrast :is(a, button, input, select, textarea, [tabindex]):focus-visible {
    outline: 3px solid #005fcc !important;
    outline-offset: 3px !important;
}

html.sc-nd-high-contrast :is(
    .border-gray-100, .border-gray-200, .border-gray-300,
    .border-slate-100, .border-slate-200, .border-slate-300,
    .border-zinc-100, .border-zinc-200, .border-zinc-300,
    .border-neutral-100, .border-neutral-200, .border-neutral-300
) {
    border-color: #52525b !important;
}

html.sc-theme-dark.sc-nd-high-contrast {
    --sc-page-bg: #000000;
    --sc-surface-bg: #0a0a0a;
    --sc-surface-elevated: #141414;
    --sc-input-bg: #050505;
    --sc-border-strong: #d4d4d8;
    --sc-text: #ffffff;
    --sc-text-muted: #f4f4f5;
    --sc-text-subtle: #e4e4e7;
    --sc-link: #8bdcff;
    --sc-link-hover: #c7efff;
    --sc-primary: #8bdcff;
    --sc-primary-hover: #c7efff;
    --sc-hover-menu: #292929;
    --sc-hover-surface: #202020;
}

html.sc-theme-dark.sc-nd-high-contrast :is(
    .bg-white, .bg-gray-50, .bg-gray-100,
    .bg-slate-50, .bg-slate-100,
    .bg-zinc-50, .bg-zinc-100,
    .bg-neutral-50, .bg-neutral-100
) {
    background-color: var(--sc-surface-bg) !important;
}

html.sc-theme-dark.sc-nd-high-contrast :is(
    .border-gray-100, .border-gray-200, .border-gray-300,
    .border-slate-100, .border-slate-200, .border-slate-300,
    .border-zinc-100, .border-zinc-200, .border-zinc-300,
    .border-neutral-100, .border-neutral-200, .border-neutral-300
) {
    border-color: #d4d4d8 !important;
}

html.sc-theme-dark.sc-nd-high-contrast :is(a, button, input, select, textarea, [tabindex]):focus-visible {
    outline-color: #facc15 !important;
}

@media (forced-colors: active) {
    html.sc-nd-high-contrast :is(a, button, input, select, textarea, [tabindex]):focus-visible {
        outline-color: Highlight !important;
    }
}

/*
 * Filet final mode sombre (ce fichier charge après skillsciel-ui.css).
 * Réaffirme fond sombre + texte clair pour empêcher tout override confort /
 * composant figé de recréer un couple faible contraste.
 * Ordre : base → confort → HC → HC+confort (spécificité / cascade).
 */
html.sc-theme-dark {
    --sc-page-bg: #0b1216;
    --sc-surface-bg: #152028;
    --sc-surface-elevated: #1e2c35;
    --sc-input-bg: #101920;
    --sc-border-strong: #7a909c;
    --sc-text: #f1f5f7;
    --sc-text-muted: #c8d4db;
    --sc-text-subtle: #a8b8c0;
}

html.sc-theme-dark body,
html.sc-theme-dark .sc-body {
    background-color: var(--sc-page-bg) !important;
    color: var(--sc-text) !important;
}

html.sc-theme-dark[class*="sc-comfort-theme-"],
html.sc-theme-dark[class*="sc-student-theme-"] {
    --sc-page-bg: #0b1216;
    --sc-surface-bg: #152028;
    --sc-text: #f1f5f7;
    --sc-text-muted: #c8d4db;
}

html.sc-theme-dark.sc-nd-high-contrast {
    --sc-page-bg: #000000;
    --sc-surface-bg: #0a0a0a;
    --sc-surface-elevated: #141414;
    --sc-input-bg: #050505;
    --sc-text: #ffffff;
    --sc-text-muted: #f4f4f5;
    --sc-text-subtle: #e4e4e7;
}

html.sc-theme-dark.sc-nd-high-contrast[class*="sc-comfort-theme-"],
html.sc-theme-dark.sc-nd-high-contrast[class*="sc-student-theme-"] {
    --sc-page-bg: #000000;
    --sc-surface-bg: #0a0a0a;
    --sc-text: #ffffff;
    --sc-text-muted: #f4f4f5;
}