/* =========================================================
   THEME — Dark mode doux et reposant pour les yeux
   Dashboard de monitoring réseau d'eau
   ========================================================= */

:root {
    /* Fonds — gris graphite, plus clair qu'un dark mode "quasi-noir" */
    --bg: #2b2f33;            /* fond général de la page */
    --surface: #35393e;       /* cartes, panneaux, modales, en-têtes */
    --surface-alt: #3e4348;   /* fonds secondaires (bandeaux, th, lignes) */
    --sidebar: #303438;       /* colonne de gauche */

    /* Bordures */
    --border: #4c5257;
    --border-soft: #454a4f;

    /* Textes */
    --text: #eceef0;          /* texte principal clair */
    --text-muted: #b0b7bc;    /* texte secondaire / labels */
    --text-faint: #8d959b;    /* texte discret (mac, footnotes) */

    /* Accents (versions désaturées des couleurs d'origine) */
    --accent: #6fa3b5;        /* remplace le bleu vif #007bff */
    --accent-hover: #5c8fa1;
    --accent-green: #7ead96;  /* remplace le vert vif #28a745 */
    --accent-green-hover: #6b9a83;
    --accent-orange: #d1a670; /* remplace #e67e22 / #ffc107 */
    --secondary: #5c6368;     /* remplace le gris bouton #6c757d */
    --secondary-hover: #6b7378;

    /* États / alertes */
    --danger: #d17d70;        /* remplace le rouge vif */
    --danger-bg: #4a352f;

    /* Fonds de colonnes de tableau (doux, teintés) */
    --col-flux-bg: #37474d;    /* remplace #e3f2fd / #f0f7ff */
    --col-reflux-bg: #4a4131;  /* remplace #fff3e0 / #fffaf0 */
    --col-debit-bg: #384339;  /* remplace #e8f5e9 */
    --col-physique-bg: #443640;/* remplace #fce4ec */
}

/* Confort visuel général */
body {
    background: var(--bg);
    color: var(--text);
    color-scheme: dark;
}

a { color: var(--accent); }

::selection {
    background: var(--accent);
    color: #0c1114;
}

/* Scrollbars discrètes */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: var(--bg); }
::-webkit-scrollbar-thumb {
    background: var(--secondary);
    border-radius: 6px;
}
::-webkit-scrollbar-thumb:hover { background: var(--accent); }

input, select, textarea {
    background: var(--surface-alt);
    color: var(--text);
    border: 1px solid var(--border);
}
input::placeholder { color: var(--text-faint); }
