/* Thème clair et sombre global v1 */

:root {
    color-scheme: light;
    --theme-canvas: #fbf8f1;
    --theme-surface: #ffffff;
    --theme-surface-soft: #f5f7f6;
    --theme-surface-raised: #ffffff;
    --theme-text: #172033;
    --theme-text-soft: #53606f;
    --theme-border: #d8dde5;
    --theme-border-strong: #aeb7c4;
    --theme-accent: #176b68;
    --theme-accent-strong: #105653;
    --theme-accent-soft: #d8efec;
    --theme-focus: #0b6bcb;
    --theme-danger: #8f1c31;
    --theme-danger-soft: #fbe4e8;
    --theme-warning: #775012;
    --theme-warning-soft: #f8e8c8;
    --theme-shadow: 0 18px 50px rgba(23, 32, 51, 0.10);
    --theme-shadow-soft: 0 8px 24px rgba(23, 32, 51, 0.07);
}

html[data-theme="dark"] {
    color-scheme: dark;
    --theme-canvas: #0e151f;
    --theme-surface: #17212e;
    --theme-surface-soft: #1d2a38;
    --theme-surface-raised: #223142;
    --theme-text: #edf3f8;
    --theme-text-soft: #b5c0cc;
    --theme-border: #3b4a5c;
    --theme-border-strong: #607086;
    --theme-accent: #70d2c8;
    --theme-accent-strong: #9be5de;
    --theme-accent-soft: #173d3d;
    --theme-focus: #74b9ff;
    --theme-danger: #ff9bab;
    --theme-danger-soft: #48232c;
    --theme-warning: #f0c77a;
    --theme-warning-soft: #46371e;
    --theme-shadow: 0 18px 50px rgba(0, 0, 0, 0.42);
    --theme-shadow-soft: 0 8px 24px rgba(0, 0, 0, 0.28);

    --ink: var(--theme-text);
    --ink-soft: var(--theme-text-soft);
    --ivory: var(--theme-canvas);
    --paper: var(--theme-surface);
    --turquoise: var(--theme-accent);
    --turquoise-dark: var(--theme-accent-strong);
    --turquoise-light: var(--theme-accent-soft);
    --amber: var(--theme-warning);
    --amber-light: var(--theme-warning-soft);
    --border: var(--theme-border);
    --border-strong: var(--theme-border-strong);
    --focus: var(--theme-focus);
    --shadow: var(--theme-shadow);
    --shadow-soft: var(--theme-shadow-soft);
}

html,
body {
    min-height: 100%;
}

html[data-theme="dark"] body {
    color: var(--theme-text);
    background-color: var(--theme-canvas);
}

html[data-theme="dark"] :where(h1, h2, h3, h4, h5, h6) {
    color: var(--theme-text);
}

html[data-theme="dark"] :where(
    p,
    li,
    dt,
    dd,
    label,
    legend,
    small
) {
    border-color: var(--theme-border);
}

html[data-theme="dark"] :where(a) {
    color: var(--theme-accent);
}

html[data-theme="dark"] :where(a:hover, a:focus-visible) {
    color: var(--theme-accent-strong);
}

html[data-theme="dark"] :where(
    input,
    textarea,
    select
) {
    color: var(--theme-text);
    background-color: var(--theme-surface-soft);
    border-color: var(--theme-border);
}

html[data-theme="dark"] :where(
    input,
    textarea
)::placeholder {
    color: #8f9dab;
    opacity: 1;
}

html[data-theme="dark"] :where(
    input:disabled,
    textarea:disabled,
    select:disabled
) {
    color: #8f9dab;
    background-color: #131c27;
}

html[data-theme="dark"] :where(
    table,
    th,
    td,
    hr,
    fieldset
) {
    border-color: var(--theme-border);
}

html[data-theme="dark"] :where(th) {
    color: var(--theme-text);
    background-color: var(--theme-surface-soft);
}

html[data-theme="dark"] :where(
    code,
    pre,
    blockquote
) {
    color: var(--theme-text);
    background-color: var(--theme-surface-soft);
    border-color: var(--theme-border);
}

html[data-theme="dark"] :where(
    .site-header,
    .reading-header,
    .site-footer
) {
    color: var(--theme-text);
    background: var(--theme-surface);
    border-color: var(--theme-border);
}

html[data-theme="dark"] :where(
    .site-header,
    .reading-header
) {
    box-shadow: var(--theme-shadow-soft);
}

html[data-theme="dark"] .site-menu > a,
html[data-theme="dark"] .site-menu__account > summary {
    color: var(--theme-text);
}

html[data-theme="dark"] .site-menu > a:hover,
html[data-theme="dark"] .site-menu > a:focus-visible,
html[data-theme="dark"] .site-menu > a[aria-current="page"],
html[data-theme="dark"] .site-menu__account > summary:hover,
html[data-theme="dark"] .site-menu__account > summary:focus-visible {
    color: var(--theme-accent-strong);
    background: var(--theme-accent-soft);
}

html[data-theme="dark"] .site-menu__panel {
    color: var(--theme-text);
    background: var(--theme-surface-raised);
    border-color: var(--theme-border);
    box-shadow: var(--theme-shadow);
}

html[data-theme="dark"] .site-menu__section + .site-menu__section,
html[data-theme="dark"] .site-menu__footer {
    border-color: var(--theme-border);
}

html[data-theme="dark"] .site-menu__section-title {
    color: var(--theme-text-soft);
}

html[data-theme="dark"] .site-menu__panel a {
    color: var(--theme-text);
}

html[data-theme="dark"] .site-menu__panel a:hover,
html[data-theme="dark"] .site-menu__panel a:focus-visible,
html[data-theme="dark"] .site-menu__panel a[aria-current="page"] {
    color: var(--theme-accent-strong);
    background: var(--theme-accent-soft);
}

html[data-theme="dark"] .site-menu__footer a {
    color: var(--theme-danger);
}

html[data-theme="dark"] :where(
    .account-introduction,
    .account-card,
    .modal,
    .dialog,
    [role="dialog"],
    [class$="-card"],
    [class*="-card "],
    [class$="__card"],
    [class*="__card "],
    [class$="-panel"],
    [class*="-panel "]
) {
    color: var(--theme-text);
    background-color: var(--theme-surface);
    border-color: var(--theme-border);
    box-shadow: var(--theme-shadow-soft);
}

html[data-theme="dark"] :where(
    .field-help,
    .help-text,
    .hint,
    .muted,
    .meta,
    [class$="__meta"],
    [class$="__description"],
    [class$="__help"]
) {
    color: var(--theme-text-soft);
}

html[data-theme="dark"] :where(
    .form-information,
    .warning,
    .alert-warning
) {
    color: var(--theme-warning);
    background-color: var(--theme-warning-soft);
    border-color: #8d6b35;
}

html[data-theme="dark"] :where(
    .flash-message,
    .feedback-message,
    .confirmation-dialog
) {
    color: var(--theme-text);
    background-color: var(--theme-surface-raised);
    border-color: var(--theme-border);
}

html[data-theme="dark"] :where(
    a,
    button,
    input,
    textarea,
    select,
    summary
):focus-visible {
    outline-color: var(--theme-focus);
}

.theme-toggle {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
    padding: 0.55rem 0.7rem;
    border: 1px solid var(--theme-border);
    border-radius: 9px;
    color: var(--theme-text);
    background: var(--theme-surface);
    font: inherit;
    font-size: 0.88rem;
    font-weight: 750;
    line-height: 1;
    cursor: pointer;
}

.theme-toggle:hover {
    color: var(--theme-accent-strong);
    background: var(--theme-accent-soft);
    border-color: var(--theme-accent);
}

.theme-toggle:focus-visible {
    outline: 3px solid var(--theme-focus);
    outline-offset: 2px;
}

.theme-toggle__icon {
    width: 1.15rem;
    height: 1.15rem;
    flex: 0 0 auto;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.theme-toggle__icon[hidden] {
    display: none;
}

.theme-toggle--floating {
    position: fixed;
    top: 0.75rem;
    right: 0.75rem;
    z-index: 100;
    box-shadow: var(--theme-shadow-soft);
}

html[data-theme="dark"] img {
    opacity: 0.96;
}

@media (max-width: 760px) {
    .site-menu > .theme-toggle {
        width: 100%;
    }

    .theme-toggle--floating {
        top: 0.5rem;
        right: 0.5rem;
    }

    .theme-toggle--floating .theme-toggle__label {
        position: absolute;
        width: 1px;
        height: 1px;
        padding: 0;
        overflow: hidden;
        clip: rect(0, 0, 0, 0);
        white-space: nowrap;
        border: 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    .theme-toggle {
        transition: none;
    }
}

/* Thème global — navigation et contrastes v2 */

/*
 * Le texte du bouton reste dans le document pour les technologies
 * d’assistance, mais seule l’icône est visible.
 */
.theme-toggle {
    flex: 0 0 2.75rem;
    inline-size: 2.75rem;
    min-inline-size: 2.75rem;
    block-size: 2.75rem;
    padding: 0;
    justify-content: center;
}

.theme-toggle__label {
    position: absolute !important;
    inline-size: 1px !important;
    block-size: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    clip-path: inset(50%) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

/*
 * Le CSS de lecture imposait encore sa couleur sombre historique
 * après l’activation du thème sombre.
 */
html[data-theme="dark"] .reading-text,
html[data-theme="dark"] .reading-text :where(
    p,
    li,
    blockquote,
    figcaption,
    strong,
    em,
    u,
    span
) {
    color: #edf3f8;
}

html[data-theme="dark"] .reading-text a {
    color: #9be5de;
}

html[data-theme="dark"] .reading-text figcaption {
    color: #b5c0cc;
}

/*
 * Les cartes du concours conservaient leur fond ivoire alors que
 * leurs textes adoptaient la palette claire du thème sombre.
 */
html[data-theme="dark"] :where(
    .writing-event__header,
    .writing-actions,
    .writing-empty
) {
    color: #edf3f8;
    background: #17212e;
    border-color: #3b4a5c;
}

html[data-theme="dark"] :where(
    .writing-event__header h1,
    .writing-event__header h2,
    .writing-actions h2,
    .writing-empty h3
) {
    color: #edf3f8;
}

html[data-theme="dark"] :where(
    .writing-event__description,
    .writing-breadcrumb,
    .writing-facts dt,
    .writing-actions p,
    .writing-empty p
) {
    color: #b5c0cc;
}

html[data-theme="dark"] .writing-breadcrumb a {
    color: #9be5de;
}

html[data-theme="dark"] .writing-eyebrow {
    color: #f2a38f;
}

html[data-theme="dark"] .writing-badge {
    color: #dce5ed;
    background: #263546;
    border-color: #52657a;
}

html[data-theme="dark"] .writing-status--open {
    color: #9be5de;
    background: #173d3d;
    border-color: #70d2c8;
}

/* Accueil et identité visuelle sombre v3 */

.brand__logo--dark,
.laboratory-card__logo--dark {
    display: none;
}

html[data-theme="dark"] .brand__logo--light,
html[data-theme="dark"] .laboratory-card__logo--light {
    display: none;
}

html[data-theme="dark"] .brand__logo--dark,
html[data-theme="dark"] .laboratory-card__logo--dark {
    display: block;
}

html[data-theme="dark"] .section-white {
    color: #edf3f8;
    background: #111a26;
}

html[data-theme="dark"] :where(
    .hero-copy,
    .trust-line,
    .section-heading > p:last-child,
    .feature-card p,
    .book-kind,
    .book-author,
    .book-summary,
    .reading-promise > div > p
) {
    color: #b5c0cc;
}

html[data-theme="dark"] :where(
    .section-white h2,
    .section-white h3,
    .book-card h3,
    .book-card h3 a,
    .reading-sample h3,
    .reading-sample p
) {
    color: #edf3f8;
}

html[data-theme="dark"] :where(
    .book-author a,
    .text-link,
    .read-link,
    .eyebrow,
    .reading-sample > span
) {
    color: #9be5de;
}

html[data-theme="dark"] .reading-sample {
    color: #edf3f8;
    background: #17212e;
    border-color: #3b4a5c;
}

html[data-theme="dark"] .reading-sample mark {
    color: #edf3f8;
    background: #285958;
}

html[data-theme="dark"] .feature-number {
    color: #9be5de;
    background: #173d3d;
    border-color: #70d2c8;
}

html[data-theme="dark"] .button-secondary {
    color: #9be5de;
    background: #17212e;
    border-color: #70d2c8;
}

html[data-theme="dark"] .button-light {
    color: #173d3d;
    background: #edf3f8;
    border-color: #edf3f8;
}

html[data-theme="dark"] .button-light:hover,
html[data-theme="dark"] .button-light:focus-visible {
    color: #0e151f;
    background: #9be5de;
    border-color: #9be5de;
}

/* Accueil sombre — contraste des titres v4 */

html[data-theme="dark"] .book-body h3 a {
    color: rgb(237, 243, 248);
}

/* Identité visuelle — bascule exclusive des logos v5 */

.brand img.brand__logo--dark {
    display: none;
}

html[data-theme="dark"] .brand img.brand__logo--light {
    display: none;
}

html[data-theme="dark"] .brand img.brand__logo--dark {
    display: block;
}