/*
 * Thème sombre de base (classless + no-js).
 * Pas de @media ici : la feuille est chargée avec media="(prefers-color-scheme: dark)" (templates/partials/assets.html.twig),
 * ce qui permettra de la forcer ou de la retirer sans JavaScript. Valeurs reprises du mode sombre de classless
 * (:root[color-scheme="dark"], activé chez lui par JavaScript).
 */
:root {
    color-scheme: dark;
    --color-mode: 'dark';
    --primary: #13181f;
    --primary-contrast: #13181f;
    --primary-invert: #cbe0ff;
    --body-bg: #0f172a;
    --body-color: #e2e8f0;
    --heading-color: #f8fafc;
    --border-color: #334155;
    --shadow-color: rgba(0, 0, 0, 0.3);
    --card-bg: #1e293b;
    --link-color: #61aeff;
    --link-hover-color: #8cc4ff;
    --progress-color: #2f9e45;
    --input-icon-color: #e2e8f0;
    --light: #1e293b;
    --dark: #f8fafc;
    --gradient-primary: linear-gradient(135deg, var(--primary-invert) 0%, var(--primary-invert) 100%);
    --shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.2);
    --shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.3), 0 2px 4px -1px rgba(0, 0, 0, 0.2);
    --shadow-md: 0 10px 15px -3px rgba(0, 0, 0, 0.3), 0 4px 6px -2px rgba(0, 0, 0, 0.2);
    --shadow-lg: 0 20px 25px -5px rgba(0, 0, 0, 0.3), 0 10px 10px -5px rgba(0, 0, 0, 0.2);
}

code { background-color: rgba(255, 255, 255, 0.1); }
pre { background-color: rgba(255, 255, 255, 0.05); }
blockquote { background-color: rgba(255, 255, 255, 0.03); border-color: var(--primary-invert); }
tr:hover td { background-color: rgba(255, 255, 255, 0.03); }
select {
    background-image: url("data:image/svg+xml;utf8,<svg fill='%23e2e8f0' height='16' viewBox='0 0 24 24' width='16' xmlns='http://www.w3.org/2000/svg'><path d='M7 10l5 5 5-5z'/></svg>");
}
button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
    background: var(--primary);
    color: var(--body-color);
    border: 1px solid var(--border-color);
}
button:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:hover {
    border-color: var(--primary-invert);
}

/* Compléments de classless-custom.css */
a.logo { color: var(--heading-color); }
dialog .button-close-container { color: var(--body-color); }
dialog button[command="close"]::before,
dialog button[command="close"]::after { background-color: var(--body-color); }
.warning { background-color: #3b3014; color: #f5d68a; border-color: #6b5518; }
h2:after { background: var(--primary-invert); }   /* trait sous les titres : invisible en sombre chez classless */
