/* ═══ Tokens de design Smart-Univ ═══
   Seule source des couleurs : pages et composants utilisent var(--color-…), jamais d'hexadécimal. */
:root {

    /* Marque */
    --color-primary: #344d59;
    --color-primary-dark: #22343d;
    --color-ink: #11191e;
    --color-ink-2: #1f2a30;
    --color-navy: #0d1b2a;
    --color-black: #000000;
    --color-accent: #ffd700;
    --color-accent-strong: #d4a106;
    --color-accent-deep: #c9a400;
    --color-accent-text: #7a5c00;
    --color-accent-bg: #fff7e0;
    --color-orange: #ffaa00;

    /* Surfaces */
    --color-surface: #ffffff;
    --color-page-bg: #f3f5f1;
    --color-surface-alt: #fafbf9;
    --color-surface-cool: #f6f8f9;
    --color-surface-muted: #eef1f2;
    --color-surface-sage: #f1f4ef;
    --color-surface-sage-2: #eef1ee;
    --color-surface-sage-3: #edf0eb;
    --color-surface-mint: #f8faf9;
    --color-surface-ice: #f7f9fa;
    --color-neutral-100: #f1f3f4;

    /* Bordures */
    --color-border: #e3e8e0;
    --color-border-cool: #d5dde0;
    --color-border-light: #e3e8ea;
    --color-border-strong: #a5b1b6;
    --color-neutral-300: #dadce0;
    --color-slate-200: #e2e8f0;

    /* Texte */
    --color-text-soft: #4b5a61;
    --color-text-secondary: #66737a;
    --color-text-subtle: #6b7a80;
    --color-text-muted: #7a878d;
    --color-text-faint: #9aa5aa;
    --color-neutral-600: #5f6368;
    --color-neutral-900: #202124;

    /* États */
    --color-danger: #c0392b;
    --color-danger-dark: #a32020;
    --color-danger-bg: #fbe9e9;
    --color-danger-bg-2: #fdecea;
    --color-warning-text: #a5432a;
    --color-warning-bg: #fdeee6;
    --color-success: #1f8a4c;
    --color-success-text: #1f6b3d;
    --color-success-bright: #16a34a;
    --color-success-bg: #e9f7ef;
    --color-info-text: #1e5a8a;
    --color-info-bg: #e7f1fb;
    --color-purple-bg: #f1ebfb;

    /* Palette historique (base.css) */
    --color-legacy-green: #37463d;
    --color-legacy-sage: #5b696b;
    --color-legacy-beige: #c5c5a9;
    --color-legacy-gray: #535953;
    --color-legacy-cream: #f8fbf1;
    --color-bs-danger: #dc3545;
    --color-body-bg: #e5e7e6;

    /* Couleurs officielles des réseaux sociaux */
    --color-brand-facebook: #1877f2;
    --color-brand-linkedin: #0a66c2;
    --color-brand-telegram: #229ed9;
    --color-brand-tiktok: #fe2c55;

    /* Palette étendue (couleurs ponctuelles des pages, regroupées) */
    --color-blue-50: #e3f0ff;
    --color-blue-100: #c2e7ff;
    --color-blue-200: #8ec5ff;
    --color-blue-400: #3b82f6;
    --color-blue-500: #2563eb;
    --color-blue-600: #0284c7;
    --color-blue-700: #1e3a8a;
    --color-green-50: #dcf7e6;
    --color-green-100: #bbf7d0;
    --color-green-300: #7ddca0;
    --color-green-500: #7cb342;
    --color-green-550: #2ecc71;
    --color-orange-100: #ffedd5;
    --color-orange-200: #f5c88a;
    --color-orange-250: #f3c2b0;
    --color-orange-600: #d97706;
    --color-orange-650: #b45309;
    --color-orange-700: #a16207;
    --color-purple-100: #e9d5ff;
    --color-purple-150: #d0b3ff;
    --color-purple-500: #7e22ce;
    --color-purple-600: #6b3fa0;
    --color-purple-650: #6b21a8;
    --color-red-200: #ff8a80;
    --color-red-250: #fca5a5;
    --color-red-500: #dc2626;
    --color-teal-300: #7fe0d6;
    --color-teal-600: #10b981;
    --color-teal-700: #0e6b72;
    --color-teal-800: #047857;
    --color-yellow-100: #fef3c7;
    --color-yellow-200: #fde68a;
    --color-yellow-300: #ffd54f;
    --color-yellow-500: #f0b400;
    --color-yellow-700: #b08600;
}

/* ═══ Couleurs des types de séance — SOURCE UNIQUE pour tout le projet ═══
   Course = bleu · Tutorial = vert · PW = jaune · Remote (à distance) = orange.
   Utilisation : classe .seance-Cours / .seance-TD / .seance-TP / .seance-Remote (app-shell.css), qui fournit
   --seance (trait, bordure), --seance-bg (fond) et --seance-text (texte) ; ou les jetons ci-dessous directement. */
:root {
    --seance-cours: var(--color-blue-400);
    --seance-cours-bg: var(--color-blue-50);
    --seance-cours-text: var(--color-info-text);
    --seance-td: var(--color-green-550);
    --seance-td-bg: var(--color-green-50);
    --seance-td-text: var(--color-success-text);
    --seance-tp: var(--color-yellow-300);
    --seance-tp-bg: var(--color-yellow-100);
    --seance-tp-text: var(--color-yellow-700);
    --seance-remote: var(--color-orange-600);
    --seance-remote-bg: var(--color-orange-100);
    --seance-remote-text: var(--color-orange-650);
}

/* ═══ Typographie (racine 16 px) ═══
   H1 30 · H2 24 · H3 18 · texte 16 · menu 16 · tableaux 14 · dates/métadonnées 14 */
:root {
    --fs-h1: 1.875rem;      /* 30 px : titre principal d'une page */
    --fs-h2: 1.5rem;        /* 24 px : titre de rubrique */
    --fs-h3: 1.125rem;      /* 18 px : titre de carte, de panneau, de tableau */
    --fs-body: 1rem;        /* 16 px : paragraphes, formulaires */
    --fs-nav: 1rem;         /* 16 px : menu latéral, barre supérieure */
    --fs-table: 0.9375rem;  /* 15 px : cellules et en-têtes de tableaux */
    --fs-meta: 0.9375rem;   /* 15 px : dates, étiquettes, texte secondaire, titres de section du menu */
    --fs-figure: 2rem;      /* 32 px : chiffres des indicateurs */
    --fs-btn-sm: 0.875rem;  /* 14 px : petits boutons */

    /* Échelle unique : toute taille de texte du projet prend l'un de ces paliers (aucune valeur libre) */
    --fs-xs: 0.75rem;       /* 12 px : pastilles, compteurs, mentions */
    --fs-sm: 0.8125rem;     /* 13 px : libellés de champ, aides, notes */
    --fs-md: 0.875rem;      /* 14 px : texte secondaire, boutons compacts */
    --fs-xl: 1.25rem;       /* 20 px : titres de bloc, icônes moyennes */

    /* Menu latéral (valeurs PC ; la racine rem réduit tout sur tablette et téléphone, base.css) */
    --fs-side-logo: 1.25rem;       /* 20 px : nom du site */
    --fs-side-logo-sub: 0.75rem;   /* 12 px : sous-titre du logo */
    --fs-side-sous: 0.8125rem;     /* 13 px : sous-section (« البيداغوجيا ») */
    --fs-side-item: 1rem;          /* 16 px : entrée, branche */
    --fs-side-feuille: 0.875rem;   /* 14 px : sous-entrée */
    --fs-side-note: 0.8125rem;     /* 13 px : note sous une entrée */
    --fs-side-role: 1rem;          /* 16 px : nom du rôle */
    --fs-side-role-btn: 0.875rem;  /* 14 px : bouton de changement */

    /* Barre supérieure */
    --fs-top-pastille: 0.9375rem;  /* 15 px : faculté, département, année, date, changement de rôle */
    --fs-top-role: 0.875rem;       /* 14 px : rôle actif */
    --fs-top-nom: 1rem;            /* 16 px : nom de l'utilisateur */
    --fs-top-poste: 0.8125rem;     /* 13 px : poste sous le nom */
    --fs-top-avatar: 0.8125rem;    /* 13 px : initiales */
    --fs-top-badge: 0.6875rem;     /* 11 px : compteur sur les icônes */
    --fs-top-alerte: 0.875rem;     /* 14 px : texte d'une alerte */
    --fs-top-alerte-date: 0.8125rem; /* 13 px : date d'une alerte */
    --fs-top-menu: 0.9375rem;      /* 15 px : menu du compte */

    /* Alias utilisés par les pages */
    --fs-page-title: var(--fs-h1);
    --fs-page-sub: 0.875rem;
    --fs-section: var(--fs-h3);
}