/* ---------------------------------------------------------------------------
   Theme : toutes les couleurs de l'application passent par ces variables.
   Les vues n'utilisent jamais d'utilitaire Tailwind de couleur en dur
   (bg-indigo-600, text-slate-500...) mais des valeurs arbitraires :
   bg-[var(--color-accent)], text-[var(--color-text-muted)], etc.
   --------------------------------------------------------------------------- */

:root {
    color-scheme: light;

    --color-bg:              #f6f7f9;
    --color-surface:         #ffffff;
    --color-surface-2:       #eef0f4;
    --color-surface-3:       #e3e6ec;
    --color-border:          #dcdfe6;
    --color-text:            #1c2130;
    --color-text-muted:      #6b7280;
    --color-accent-contrast: #ffffff;

    --color-success:         #15803d;
    --color-success-soft:    #dcfce7;
    --color-warning:         #b45309;
    --color-warning-soft:    #fef3c7;
    --color-danger:          #b91c1c;
    --color-danger-soft:     #fee2e2;
    --color-info:            #1d4ed8;
    --color-info-soft:       #dbeafe;

    --chart-1: #4f46e5;
    --chart-2: #0ea5e9;
    --chart-3: #14b8a6;
    --chart-4: #f59e0b;
    --chart-5: #ef4444;
    --chart-6: #8b5cf6;
    --chart-7: #10b981;
    --chart-8: #64748b;

    --shadow-card: 0 1px 2px rgb(16 24 40 / 6%), 0 1px 3px rgb(16 24 40 / 4%);
}

/* --- Palettes d'accent ---------------------------------------------------- */

:root,
:root[data-palette="indigo"] {
    --color-accent:      #4f46e5;
    --color-accent-hover:#4338ca;
    --color-accent-soft: #e8e7fd;
}
:root[data-palette="emerald"] {
    --color-accent:      #059669;
    --color-accent-hover:#047857;
    --color-accent-soft: #d5f5e9;
}
:root[data-palette="amber"] {
    --color-accent:      #d97706;
    --color-accent-hover:#b45309;
    --color-accent-soft: #fdf0d8;
}
:root[data-palette="rose"] {
    --color-accent:      #e11d48;
    --color-accent-hover:#be123c;
    --color-accent-soft: #fde4ea;
}
:root[data-palette="slate"] {
    --color-accent:      #334155;
    --color-accent-hover:#1e293b;
    --color-accent-soft: #e2e8f0;
}

/* --- Variante sombre ------------------------------------------------------ */

@media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) {
        color-scheme: dark;

        --color-bg:         #12151c;
        --color-surface:    #191d27;
        --color-surface-2:  #222836;
        --color-surface-3:  #2c3343;
        --color-border:     #313a4c;
        --color-text:       #e6e9f0;
        --color-text-muted: #97a1b4;

        --color-success:      #4ade80;
        --color-success-soft: #14331f;
        --color-warning:      #fbbf24;
        --color-warning-soft: #3a2a09;
        --color-danger:       #f87171;
        --color-danger-soft:  #3b1414;
        --color-info:         #93c5fd;
        --color-info-soft:    #14243f;

        --chart-1: #818cf8;
        --chart-2: #38bdf8;
        --chart-3: #2dd4bf;
        --chart-4: #fbbf24;
        --chart-5: #f87171;
        --chart-6: #a78bfa;
        --chart-7: #34d399;
        --chart-8: #94a3b8;

        --shadow-card: 0 1px 2px rgb(0 0 0 / 40%);
    }
    :root:not([data-theme="light"]):not([data-palette]),
    :root:not([data-theme="light"])[data-palette="indigo"] {
        --color-accent: #6366f1; --color-accent-hover: #818cf8; --color-accent-soft: #232449;
    }
    :root:not([data-theme="light"])[data-palette="emerald"] {
        --color-accent: #10b981; --color-accent-hover: #34d399; --color-accent-soft: #10322a;
    }
    :root:not([data-theme="light"])[data-palette="amber"] {
        --color-accent: #f59e0b; --color-accent-hover: #fbbf24; --color-accent-soft: #3a2a09;
    }
    :root:not([data-theme="light"])[data-palette="rose"] {
        --color-accent: #f43f5e; --color-accent-hover: #fb7185; --color-accent-soft: #3d1522;
    }
    :root:not([data-theme="light"])[data-palette="slate"] {
        --color-accent: #94a3b8; --color-accent-hover: #cbd5e1; --color-accent-soft: #29313f;
    }
}

:root[data-theme="dark"] {
    color-scheme: dark;

    --color-bg:         #12151c;
    --color-surface:    #191d27;
    --color-surface-2:  #222836;
    --color-surface-3:  #2c3343;
    --color-border:     #313a4c;
    --color-text:       #e6e9f0;
    --color-text-muted: #97a1b4;

    --color-success:      #4ade80;
    --color-success-soft: #14331f;
    --color-warning:      #fbbf24;
    --color-warning-soft: #3a2a09;
    --color-danger:       #f87171;
    --color-danger-soft:  #3b1414;
    --color-info:         #93c5fd;
    --color-info-soft:    #14243f;

    --chart-1: #818cf8;
    --chart-2: #38bdf8;
    --chart-3: #2dd4bf;
    --chart-4: #fbbf24;
    --chart-5: #f87171;
    --chart-6: #a78bfa;
    --chart-7: #34d399;
    --chart-8: #94a3b8;

    --shadow-card: 0 1px 2px rgb(0 0 0 / 40%);
}
:root[data-theme="dark"]:not([data-palette]),
:root[data-theme="dark"][data-palette="indigo"] {
    --color-accent: #6366f1; --color-accent-hover: #818cf8; --color-accent-soft: #232449;
}
:root[data-theme="dark"][data-palette="emerald"] {
    --color-accent: #10b981; --color-accent-hover: #34d399; --color-accent-soft: #10322a;
}
:root[data-theme="dark"][data-palette="amber"] {
    --color-accent: #f59e0b; --color-accent-hover: #fbbf24; --color-accent-soft: #3a2a09;
}
:root[data-theme="dark"][data-palette="rose"] {
    --color-accent: #f43f5e; --color-accent-hover: #fb7185; --color-accent-soft: #3d1522;
}
:root[data-theme="dark"][data-palette="slate"] {
    --color-accent: #94a3b8; --color-accent-hover: #cbd5e1; --color-accent-soft: #29313f;
}

/* --- Statuts -------------------------------------------------------------- */

.st-todo           { background: var(--color-surface-2);   color: var(--color-text-muted); }
.st-in_progress    { background: var(--color-info-soft);    color: var(--color-info); }
.st-in_review      { background: var(--color-accent-soft);  color: var(--color-accent); }
.st-in_deploy      { background: var(--color-warning-soft); color: var(--color-warning); }
.st-waiting_tester { background: var(--color-warning-soft); color: var(--color-warning); }
.st-done           { background: var(--color-success-soft); color: var(--color-success); }
.st-blocked        { background: var(--color-danger-soft);  color: var(--color-danger); }
.st-cancelled      { background: var(--color-surface-3);    color: var(--color-text-muted); text-decoration: line-through; }

/* --- Reviews -------------------------------------------------------------- */

.pt-pertinent     { background: var(--color-success-soft); color: var(--color-success); }
.pt-neutral       { background: var(--color-warning-soft); color: var(--color-warning); }
.pt-not_pertinent { background: var(--color-surface-3);    color: var(--color-text-muted); }

.oc-pending   { background: var(--color-surface-2);   color: var(--color-text-muted); }
.oc-changed   { background: var(--color-info-soft);   color: var(--color-info); }
.oc-unchanged { background: var(--color-surface-3);   color: var(--color-text-muted); }
.oc-discussed { background: var(--color-accent-soft); color: var(--color-accent); }

/* La case « non pertinent mais modifié quand même » est celle qui porte l'argument. */
.cell-flag { background: var(--color-danger-soft); color: var(--color-danger); font-weight: 600; }

/* --- Calendrier annuel ---------------------------------------------------- */

/* L'intensite derive de l'accent : le calendrier suit donc la palette choisie. */
.cal-day {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    aspect-ratio: 1;
    border-radius: 4px;
    font-size: 11px;
    line-height: 1;
    font-variant-numeric: tabular-nums;
    text-decoration: none;
    transition: transform .08s ease;
}
.cal-day:hover { transform: scale(1.18); z-index: 5; }

.cal-l0 { background: var(--color-surface-2); color: var(--color-text-muted); }
.cal-l1 { background: color-mix(in srgb, var(--color-accent) 24%, var(--color-surface-2)); }
.cal-l2 { background: color-mix(in srgb, var(--color-accent) 48%, var(--color-surface-2)); }
.cal-l3 { background: color-mix(in srgb, var(--color-accent) 74%, var(--color-surface-2)); color: var(--color-accent-contrast); }
.cal-l4 { background: var(--color-accent); color: var(--color-accent-contrast); }

/* Un jour off prime sur l'intensite : « absent » n'est pas « rien saisi ». */
.cal-off { background: var(--color-warning-soft); color: var(--color-warning); font-weight: 600; }
.cal-off-half {
    background: linear-gradient(135deg, var(--color-warning-soft) 50%, var(--color-surface-2) 50%);
    color: var(--color-warning);
}

.cal-today    { outline: 2px solid var(--color-accent); outline-offset: 1px; font-weight: 700; }
.cal-selected { outline: 2px solid var(--color-text); outline-offset: 1px; font-weight: 700; }

/* Premier jour d'un sprint : liseré à gauche de la case. */
.cal-sprint-start { box-shadow: inset 2px 0 0 var(--color-accent); }

/* Bandage : une quinzaine sur deux est teintée, ce qui fait ressortir les sprints. */
.cal-week { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 2px; padding: 2px; border-radius: 5px; }
.cal-week[data-band="1"] { background: color-mix(in srgb, var(--color-text) 6%, transparent); }

/* Marqueurs par type de trace, sous le numéro du jour. */
.cal-marks { position: absolute; bottom: 2px; left: 0; right: 0; display: flex; justify-content: center; gap: 2px; }
.cal-mark  { width: 3px; height: 3px; border-radius: 50%; box-shadow: 0 0 0 .5px rgb(0 0 0 / 25%); }
.cal-mark-entry      { background: var(--chart-2); }
.cal-mark-transition { background: var(--chart-4); }
.cal-mark-note       { background: var(--chart-6); }

/* --- Graphiques SVG ------------------------------------------------------- */

.c-grid   { stroke: var(--color-border); stroke-width: 1; }
.c-axis   { fill: var(--color-text-muted); font-size: 10px; font-family: inherit; }
.c-center { fill: var(--color-text); font-size: 20px; font-weight: 600; font-family: inherit; }

/* --- Base ----------------------------------------------------------------- */

body { background: var(--color-bg); color: var(--color-text); }
::selection { background: var(--color-accent-soft); }
a { color: inherit; }
