/* static/css/design-tokens.css
   ═══════════════════════════════════════════════════════════════
   Système de design central — Nuage v2.
   Un seul fichier à modifier pour changer l'identité visuelle
   partout dans l'application.
   ═══════════════════════════════════════════════════════════════ */

:root {
    /* Couleurs de base */
    --nuage-encre: #16181d;
    --nuage-encre-douce: #2d3038;
    --nuage-papier: #f7f6f3;
    --nuage-papier-carte: #ffffff;
    --nuage-ardoise: #4a5568;
    --nuage-ardoise-claire: #8b93a1;
    --nuage-bordure: #e6e4de;

    /* Accent — ambre signal (référence directe aux voyants Andon) */
    --nuage-accent: #e8a33d;
    --nuage-accent-sombre: #c8842a;
    --nuage-accent-clair: #fdf1de;

    /* Primaire — indigo (boutons principaux, logo) */
    --nuage-primaire: #6366f1;
    --nuage-primaire-sombre: #4f46e5;
    --nuage-primaire-clair: #eef2ff;

    /* États */
    --nuage-succes: #2f9e6e;
    --nuage-succes-clair: #e5f5ee;
    --nuage-alerte: #d64545;
    --nuage-alerte-clair: #fbe9e9;
    --nuage-info: #3568b0;
    --nuage-info-clair: #e8f0fa;

    /* Rayons et ombres — discrets, précis */
    --nuage-rayon: 10px;
    --nuage-rayon-lg: 16px;
    --nuage-ombre: 0 1px 2px rgba(22,24,29,.05);
    --nuage-ombre-hover: 0 4px 14px rgba(22,24,29,.08);

    /* Typo */
    --nuage-police: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

*{ box-sizing:border-box; }
body{
    margin:0; font-family:var(--nuage-police); background:var(--nuage-papier);
    color:var(--nuage-encre); -webkit-font-smoothing:antialiased;
}
a{ color:inherit; }

/* Focus clavier visible — accessibilité */
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible{
    outline:2px solid var(--nuage-primaire); outline-offset:2px;
}

@media (prefers-reduced-motion: reduce){
    *{ animation-duration:.001ms !important; transition-duration:.001ms !important; }
}

/* ── Composants partagés ── */
.n-btn{
    display:inline-flex; align-items:center; gap:8px; border:none; border-radius:var(--nuage-rayon);
    padding:11px 20px; font-size:14px; font-weight:700; font-family:inherit; cursor:pointer;
    text-decoration:none; transition:background .15s, transform .1s;
}
.n-btn-primaire{ background:var(--nuage-primaire); color:#fff; }
.n-btn-primaire:hover{ background:var(--nuage-primaire-sombre); }
.n-btn-accent{ background:var(--nuage-primaire); color:#fff; }
.n-btn-accent:hover{ background:var(--nuage-primaire-sombre); color:#fff; }
.n-btn-discret{ background:var(--nuage-papier); border:1.5px solid var(--nuage-bordure); color:var(--nuage-encre); }
.n-btn-discret:hover{ background:#efede7; }

.n-carte{
    background:var(--nuage-papier-carte); border:1px solid var(--nuage-bordure);
    border-radius:var(--nuage-rayon-lg); box-shadow:var(--nuage-ombre);
}

.n-flash{ padding:13px 18px; border-radius:var(--nuage-rayon); font-size:13.5px; font-weight:600; }
.n-flash-success{ background:var(--nuage-succes-clair); color:#166534; }
.n-flash-danger{ background:var(--nuage-alerte-clair); color:#991b1b; }
.n-flash-info{ background:var(--nuage-info-clair); color:#1e40af; }
.n-flash-warning{ background:var(--nuage-accent-clair); color:#92400e; }

/* ═══ BOUTONS-INDIGO : début (bloc généré, ne pas modifier à la main) ═══ */
html body .ac-btn-compact-accent,
html body .au-btn-a,
html body .au-btn-p,
html body .ba-btn,
html body .bd-btn.primaire,
html body .cb-btn-creer,
html body .db-btn-ajouter,
html body .fo-btn-a,
html body .fo-btn-p,
html body .lb-btn-creer,
html body .lo-btn.p,
html body .ndf-import-btn-prim,
html body .pe-btn-p,
html body .pf-btn-verif,
html body .pj-btn-a,
html body .pj-btn-p,
html body .st-btn-mon-espace{ background:var(--nuage-primaire); color:#fff; font-family:var(--nuage-police); font-weight:700; }
html body .ac-btn-compact-accent:hover:not(:disabled),
html body .au-btn-a:hover:not(:disabled),
html body .au-btn-p:hover:not(:disabled),
html body .ba-btn:hover:not(:disabled),
html body .bd-btn.primaire:hover:not(:disabled),
html body .cb-btn-creer:hover:not(:disabled),
html body .db-btn-ajouter:hover:not(:disabled),
html body .fo-btn-a:hover:not(:disabled),
html body .fo-btn-p:hover:not(:disabled),
html body .lb-btn-creer:hover:not(:disabled),
html body .lo-btn.p:hover:not(:disabled),
html body .ndf-import-btn-prim:hover:not(:disabled),
html body .pe-btn-p:hover:not(:disabled),
html body .pf-btn-verif:hover:not(:disabled),
html body .pj-btn-a:hover:not(:disabled),
html body .pj-btn-p:hover:not(:disabled),
html body .st-btn-mon-espace:hover:not(:disabled){ background:var(--nuage-primaire-sombre); color:#fff; }
/* ═══ BOUTONS-INDIGO : fin ═══ */
