/* ═══════════════════════════════════════════════════════════════
   ACADÉMIE ARCANE — main.css v5  (magical redesign)
   ═══════════════════════════════════════════════════════════════ */

/* ── Thème Sombre ─────────────────────────────────────────────── */
[data-theme="dark"], :root {
  --bg-base:      #09090f;
  --bg-surface:   #0f0f1e;
  --bg-raised:    #171728;
  --bg-hover:     #1f1f38;
  --border:       #252545;
  --border-light: #32325a;
  --text-primary: #eae5f8;
  --text-secondary:#9d95c8;
  --text-muted:   #5a5475;
  --accent:       #8b5cf6;
  --accent-2:     #a78bfa;
  --accent-glow:  rgba(139,92,246,.15);
  --gold:         #d4a843;
  --gold-light:   #f0cc6a;
  --danger:       #ef4444;
  --danger-bg:    rgba(239,68,68,.12);
  --success:      #22c55e;
  --success-bg:   rgba(34,197,94,.12);
  --warning:      #f59e0b;
  --warning-bg:   rgba(245,158,11,.12);
  --info:         #3b82f6;
  --shadow:       0 8px 40px rgba(0,0,0,.7);
  --shadow-sm:    0 2px 16px rgba(0,0,0,.4);
  --shadow-xs:    0 1px 6px rgba(0,0,0,.3);
  --shadow-glow:  0 0 30px rgba(139,92,246,.18);
  --radius:       7px;
  --radius-lg:    12px;
  --radius-xl:    18px;
  --sidebar-w:    256px;
  --topbar-h:     54px;
  --font-heading: 'Cinzel', Georgia, serif;
  --font-body:    'Crimson Text', Georgia, serif;
  --font-ui:      system-ui,-apple-system,sans-serif;
  --transition:   0.17s ease;
  /* Aliases utilisés dans les nouvelles vues */
  --surface-1:    var(--bg-base);
  --surface-2:    var(--bg-surface);
  --surface-3:    var(--bg-raised);
  --accent-1:     var(--accent);
  --error:        var(--danger);
}

/* ── Thème Clair ──────────────────────────────────────────────── */
[data-theme="light"] {
  --bg-base:      #f7f5ff;
  --bg-surface:   #ffffff;
  --bg-raised:    #ede9fb;
  --bg-hover:     #e4dffa;
  --border:       #d9d3f5;
  --border-light: #cac3ef;
  --text-primary: #1a1535;
  --text-secondary:#4a4272;
  --text-muted:   #8b82b8;
  --accent:       #7c3aed;
  --accent-2:     #6d28d9;
  --accent-glow:  rgba(124,58,237,.12);
  --gold:         #b45309;
  --gold-light:   #d97706;
  --danger:       #dc2626;
  --danger-bg:    rgba(220,38,38,.08);
  --success:      #16a34a;
  --success-bg:   rgba(22,163,74,.08);
  --warning:      #d97706;
  --warning-bg:   rgba(217,119,6,.08);
  --info:         #2563eb;
  --shadow:       0 8px 40px rgba(100,80,200,.12);
  --shadow-sm:    0 2px 16px rgba(100,80,200,.08);
  --shadow-xs:    0 1px 6px rgba(100,80,200,.05);
  --shadow-glow:  0 0 30px rgba(124,58,237,.14);
  --surface-1:    var(--bg-base);
  --surface-2:    var(--bg-surface);
  --surface-3:    var(--bg-raised);
  --accent-1:     var(--accent);
  --error:        var(--danger);
}

/* Sidebar overrides – light */
[data-theme="light"] .sidebar {
  background:linear-gradient(175deg, #f2eeff 0%, #ece6ff 50%, #f0ebff 100%);
  border-right:1px solid rgba(124,58,237,.14);
  box-shadow:3px 0 40px rgba(100,80,200,.10), inset -1px 0 0 rgba(124,58,237,.05);
}
[data-theme="light"] .sidebar::before {
  background-image:
    radial-gradient(ellipse 180% 50% at 50% 0%, rgba(124,58,237,.09) 0%, transparent 62%),
    radial-gradient(ellipse 90% 30% at 50% 100%, rgba(180,83,9,.06) 0%, transparent 55%),
    url("data:image/svg+xml,%3Csvg width='90' height='90' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='6' cy='6' r='.7' fill='%23b45309' opacity='.18'/%3E%3Ccircle cx='42' cy='24' r='.45' fill='%237c3aed' opacity='.14'/%3E%3Ccircle cx='70' cy='58' r='.6' fill='%23b45309' opacity='.12'/%3E%3Ccircle cx='20' cy='65' r='.38' fill='%237c3aed' opacity='.1'/%3E%3Ccircle cx='78' cy='10' r='.5' fill='%237c3aed' opacity='.12'/%3E%3Ccircle cx='32' cy='80' r='.42' fill='%23b45309' opacity='.1'/%3E%3Ccircle cx='58' cy='40' r='.3' fill='%237c3aed' opacity='.08'/%3E%3C/svg%3E");
}
[data-theme="light"] .sidebar-brand::after {
  background:linear-gradient(90deg,transparent,rgba(124,58,237,.4),transparent);
}
[data-theme="light"] .sidebar-brand {
  background:linear-gradient(180deg, rgba(124,58,237,.06) 0%, transparent 100%);
}
[data-theme="light"] .sb-seal-ring {
  border-color:rgba(124,58,237,.28);
}
[data-theme="light"] .sb-seal-ring-2 {
  border-color:rgba(180,83,9,.2);
}
[data-theme="light"] .sidebar-emblem {
  color:var(--accent);
  border-color:rgba(124,58,237,.35);
  background:radial-gradient(circle at 40% 35%, rgba(124,58,237,.1) 0%, rgba(180,83,9,.06) 100%);
  box-shadow:0 0 20px rgba(124,58,237,.18), 0 0 40px rgba(180,83,9,.06), inset 0 0 14px rgba(124,58,237,.08);
}
[data-theme="light"] .sidebar-appname {
  color:var(--accent);
  text-shadow:0 0 24px rgba(124,58,237,.2);
}
[data-theme="light"] .sidebar-subtitle {
  color:rgba(124,58,237,.45);
}
[data-theme="light"] .sidebar-logo {
  border-color:rgba(124,58,237,.3);
  box-shadow:0 0 18px rgba(124,58,237,.14);
}
[data-theme="light"] .nav-item {
  color:var(--text-secondary);
}
[data-theme="light"] .nav-item:hover {
  background:rgba(124,58,237,.07);
  border-color:rgba(124,58,237,.12);
  color:var(--text-primary);
}
[data-theme="light"] .nav-item.active {
  background:linear-gradient(110deg, rgba(124,58,237,.14) 0%, rgba(124,58,237,.05) 100%);
  color:var(--accent);
  border-color:rgba(124,58,237,.25);
  box-shadow:0 2px 14px rgba(124,58,237,.1);
}
[data-theme="light"] .nav-group-toggle {
  color:var(--text-secondary);
}
[data-theme="light"] .nav-group-toggle:hover {
  background:rgba(124,58,237,.07);
  color:var(--text-primary);
  border-color:rgba(124,58,237,.12);
}
[data-theme="light"] .nav-group.open .nav-group-toggle {
  background:rgba(124,58,237,.06);
  border-color:rgba(124,58,237,.1);
  color:var(--text-primary);
}
[data-theme="light"] .nav-group-items {
  border-left-color:rgba(124,58,237,.22);
}
[data-theme="light"] .nav-sub.active {
  color:var(--accent);
  background:rgba(124,58,237,.1);
}
[data-theme="light"] .nav-action {
  color:var(--accent) !important;
}
[data-theme="light"] .nav-divider {
  color:rgba(124,58,237,.5);
}
[data-theme="light"] .nav-divider::before {
  background:linear-gradient(90deg, transparent, rgba(124,58,237,.25));
}
[data-theme="light"] .nav-divider::after {
  background:linear-gradient(90deg, rgba(124,58,237,.25), transparent);
}
[data-theme="light"] .sidebar-user {
  border-top-color:rgba(124,58,237,.12);
  background:linear-gradient(0deg, rgba(124,58,237,.06) 0%, transparent 100%);
}
[data-theme="light"] .sidebar-user::before {
  background:linear-gradient(90deg,transparent,rgba(124,58,237,.32),transparent);
}
[data-theme="light"] .su-card:hover {
  background:rgba(124,58,237,.08);
  border-color:rgba(124,58,237,.2);
  color:var(--text-primary);
}
[data-theme="light"] .su-avatar {
  border-color:rgba(124,58,237,.32);
  box-shadow:0 0 12px rgba(124,58,237,.12);
}
[data-theme="light"] .su-avatar-placeholder {
  background:linear-gradient(135deg,rgba(124,58,237,.18),rgba(180,83,9,.07));
  color:var(--accent);
  border-color:rgba(124,58,237,.3);
}
[data-theme="light"] .su-btn {
  background:rgba(0,0,0,.04);
  border-color:rgba(124,58,237,.2);
  color:var(--text-muted);
}
[data-theme="light"] .su-btn:hover {
  background:rgba(124,58,237,.12);
  color:var(--accent);
  border-color:rgba(124,58,237,.4);
}
/* Inputs & selects */
[data-theme="light"] .form-input,
[data-theme="light"] .form-select,
[data-theme="light"] .form-textarea {
  background:var(--bg-raised);
  color:var(--text-primary);
}
/* Buttons */
[data-theme="light"] .btn-secondary {
  background:var(--bg-raised);
  color:var(--text-primary);
  border-color:var(--border-light);
}
[data-theme="light"] .btn-secondary:hover {
  background:var(--bg-hover);
}
[data-theme="light"] .btn-ghost {
  color:var(--text-secondary);
}
/* Tables */
[data-theme="light"] .arcane-table { background:var(--bg-surface); }
/* Context nav */
[data-theme="light"] .ctx-nav-btn.active {
  background:rgba(124,58,237,.1);
  color:var(--accent);
  border-color:rgba(124,58,237,.25);
}

/* ── Thème Cramoisi (rouge sombre) ───────────────────────────── */
[data-theme="crimson"] {
  --bg-base:      #08020a;
  --bg-surface:   #110406;
  --bg-raised:    #1a0710;
  --bg-hover:     #240c18;
  --border:       #3a1020;
  --border-light: #52182e;
  --text-primary: #f5dde6;
  --text-secondary:#c09090;
  --text-muted:   #7a3a50;
  --accent:       #dc2626;
  --accent-2:     #f87171;
  --accent-glow:  rgba(220,38,38,.16);
  --gold:         #e07040;
  --gold-light:   #f09060;
  --danger:       #ef4444;
  --danger-bg:    rgba(239,68,68,.12);
  --success:      #16a34a;
  --success-bg:   rgba(22,163,74,.12);
  --warning:      #d97706;
  --warning-bg:   rgba(217,119,6,.12);
  --info:         #3b82f6;
  --shadow:       0 8px 40px rgba(0,0,0,.82);
  --shadow-sm:    0 2px 16px rgba(0,0,0,.52);
  --shadow-xs:    0 1px 6px rgba(0,0,0,.36);
  --shadow-glow:  0 0 30px rgba(220,38,38,.2);
  --radius:       7px;
  --radius-lg:    12px;
  --radius-xl:    18px;
  --sidebar-w:    256px;
  --topbar-h:     54px;
  --font-heading: 'Cinzel', Georgia, serif;
  --font-body:    'Crimson Text', Georgia, serif;
  --font-ui:      system-ui,-apple-system,sans-serif;
  --transition:   0.17s ease;
  --surface-1:    var(--bg-base);
  --surface-2:    var(--bg-surface);
  --surface-3:    var(--bg-raised);
  --accent-1:     var(--accent);
  --error:        var(--danger);
}

/* ── Thème Émeraude (vert sombre) ────────────────────────────── */
[data-theme="emerald"] {
  --bg-base:      #020a05;
  --bg-surface:   #050f09;
  --bg-raised:    #091a0f;
  --bg-hover:     #0e2418;
  --border:       #1a3826;
  --border-light: #245034;
  --text-primary: #daf0e4;
  --text-secondary:#80b898;
  --text-muted:   #3d7055;
  --accent:       #10b981;
  --accent-2:     #34d399;
  --accent-glow:  rgba(16,185,129,.16);
  --gold:         #60c878;
  --gold-light:   #88e098;
  --danger:       #ef4444;
  --danger-bg:    rgba(239,68,68,.12);
  --success:      #10b981;
  --success-bg:   rgba(16,185,129,.14);
  --warning:      #d97706;
  --warning-bg:   rgba(217,119,6,.12);
  --info:         #3b82f6;
  --shadow:       0 8px 40px rgba(0,0,0,.82);
  --shadow-sm:    0 2px 16px rgba(0,0,0,.52);
  --shadow-xs:    0 1px 6px rgba(0,0,0,.36);
  --shadow-glow:  0 0 30px rgba(16,185,129,.2);
  --radius:       7px;
  --radius-lg:    12px;
  --radius-xl:    18px;
  --sidebar-w:    256px;
  --topbar-h:     54px;
  --font-heading: 'Cinzel', Georgia, serif;
  --font-body:    'Crimson Text', Georgia, serif;
  --font-ui:      system-ui,-apple-system,sans-serif;
  --transition:   0.17s ease;
  --surface-1:    var(--bg-base);
  --surface-2:    var(--bg-surface);
  --surface-3:    var(--bg-raised);
  --accent-1:     var(--accent);
  --error:        var(--danger);
}

/* ── Thème Parchemin ──────────────────────────────────────────── */
[data-theme="parchment"] {
  --bg-base:      #f5ede0;
  --bg-surface:   #ede3cc;
  --bg-raised:    #e2d5b8;
  --bg-hover:     #d6c89e;
  --border:       #b8a878;
  --border-light: #cbb98a;
  --text-primary: #1e1208;
  --text-secondary:#5a3a12;
  --text-muted:   #8c6830;
  --accent:       #7c3600;
  --accent-2:     #a04800;
  --accent-glow:  rgba(124,54,0,.12);
  --gold:         #8b5e00;
  --gold-light:   #b07c00;
  --danger:       #991b1b;
  --danger-bg:    rgba(153,27,27,.1);
  --success:      #166534;
  --success-bg:   rgba(22,101,52,.1);
  --warning:      #92400e;
  --warning-bg:   rgba(146,64,14,.1);
  --info:         #1e3a8a;
  --shadow:       0 8px 24px rgba(60,30,0,.2);
  --shadow-sm:    0 2px 12px rgba(60,30,0,.14);
  --shadow-xs:    0 1px 4px rgba(60,30,0,.08);
  --shadow-glow:  0 0 20px rgba(124,54,0,.12);
  --surface-1:    var(--bg-base);
  --surface-2:    var(--bg-surface);
  --surface-3:    var(--bg-raised);
  --accent-1:     var(--accent);
  --error:        var(--danger);
}

/* ── Thème Parchemin Sombre ──────────────────────────────────── */
[data-theme="parchment-dark"] {
  --bg-base:      #110c05;
  --bg-surface:   #1b1208;
  --bg-raised:    #23180a;
  --bg-hover:     #2e200e;
  --border:       #3a2710;
  --border-light: #4c3318;
  --text-primary: #f0e2c6;
  --text-secondary:#c49060;
  --text-muted:   #7a5830;
  --accent:       #c87820;
  --accent-2:     #e09840;
  --accent-glow:  rgba(200,120,32,.15);
  --gold:         #d4a843;
  --gold-light:   #f0c060;
  --danger:       #c0392b;
  --danger-bg:    rgba(192,57,43,.12);
  --success:      #27ae60;
  --success-bg:   rgba(39,174,96,.12);
  --warning:      #d68910;
  --warning-bg:   rgba(214,137,16,.12);
  --info:         #2471a3;
  --shadow:       0 8px 40px rgba(0,0,0,.88);
  --shadow-sm:    0 2px 16px rgba(0,0,0,.55);
  --shadow-xs:    0 1px 6px rgba(0,0,0,.38);
  --shadow-glow:  0 0 30px rgba(200,120,32,.18);
  --surface-1:    var(--bg-base);
  --surface-2:    var(--bg-surface);
  --surface-3:    var(--bg-raised);
  --accent-1:     var(--accent);
  --error:        var(--danger);
}

/* ── Reset ─────────────────────────────────────────────────────── */
*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
html { font-size:16px; scroll-behavior:smooth; }
body {
  font-family:var(--font-ui);
  background:var(--bg-base);
  color:var(--text-primary);
  min-height:100vh; line-height:1.5;
  -webkit-font-smoothing:antialiased;
  transition:background var(--transition),color var(--transition);
}
a { color:var(--accent-2); text-decoration:none; transition:color var(--transition); }
a:hover { color:var(--gold-light); }
h1,h2,h3,h4 { font-family:var(--font-heading); font-weight:600; line-height:1.2; }
input,select,textarea,button { font-family:var(--font-ui); }

/* ── Layout ────────────────────────────────────────────────────── */
.app-wrapper { display:flex; min-height:100vh; }
.main-content {
  flex:1; margin-left:var(--sidebar-w);
  display:flex; flex-direction:column; min-height:100vh;
}

/* ════════════════════════════════════════════════════════════════
   SIDEBAR — Le Grand Registre de l'Académie
   ════════════════════════════════════════════════════════════════ */
.sidebar {
  position:fixed; left:0; top:0;
  width:var(--sidebar-w); height:100vh;
  display:flex; flex-direction:column;
  z-index:100; overflow:hidden;
  transition:transform var(--transition);
  background:linear-gradient(175deg, #0d0b28 0%, #080716 50%, #0a0820 100%);
  border-right:1px solid rgba(212,168,67,.18);
  box-shadow:3px 0 40px rgba(0,0,0,.75), inset -1px 0 0 rgba(139,92,246,.07);
}
/* Champ d'étoiles */
.sidebar::before {
  content:''; position:absolute; inset:0; pointer-events:none; z-index:0;
  background-image:
    radial-gradient(ellipse 180% 50% at 50% 0%, rgba(139,92,246,.14) 0%, transparent 62%),
    radial-gradient(ellipse 90% 30% at 50% 100%, rgba(212,168,67,.08) 0%, transparent 55%),
    url("data:image/svg+xml,%3Csvg width='90' height='90' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='6' cy='6' r='.7' fill='%23d4a843' opacity='.2'/%3E%3Ccircle cx='42' cy='24' r='.45' fill='%238b5cf6' opacity='.18'/%3E%3Ccircle cx='70' cy='58' r='.6' fill='%23d4a843' opacity='.14'/%3E%3Ccircle cx='20' cy='65' r='.38' fill='%238b5cf6' opacity='.12'/%3E%3Ccircle cx='78' cy='10' r='.5' fill='%23a78bfa' opacity='.16'/%3E%3Ccircle cx='32' cy='80' r='.42' fill='%23d4a843' opacity='.11'/%3E%3Ccircle cx='58' cy='40' r='.3' fill='%23a78bfa' opacity='.1'/%3E%3Ccircle cx='85' cy='75' r='.5' fill='%23d4a843' opacity='.09'/%3E%3Ccircle cx='14' cy='42' r='.35' fill='%238b5cf6' opacity='.08'/%3E%3C/svg%3E");
}

/* ── Blason ──────────────────────────────────────────────────── */
.sidebar-brand {
  position:relative; z-index:1; flex-shrink:0;
  display:flex; flex-direction:column; align-items:center;
  padding:1.5rem .85rem 1.15rem; gap:.48rem;
  background:linear-gradient(180deg, rgba(212,168,67,.07) 0%, transparent 100%);
}
.sidebar-brand::after {
  content:''; position:absolute; bottom:0; left:12%; right:12%;
  height:1px; background:linear-gradient(90deg,transparent,rgba(212,168,67,.5),transparent);
}
/* Sceau animé */
.sb-seal-wrap {
  position:relative; width:62px; height:62px;
}
.sb-seal-ring {
  position:absolute; inset:0; border-radius:50%;
  border:1px solid rgba(212,168,67,.28);
  animation:seal-spin 22s linear infinite;
}
.sb-seal-ring-2 {
  inset:7px; border-radius:50%;
  border:1px dashed rgba(139,92,246,.3);
  animation:seal-spin 16s linear infinite reverse;
}
@keyframes seal-spin { to { transform:rotate(360deg); } }

.sidebar-emblem {
  position:absolute; inset:0;
  display:flex; align-items:center; justify-content:center;
  font-size:1.6rem; color:var(--gold);
  border-radius:50%;
  border:1.5px solid rgba(212,168,67,.38);
  background:radial-gradient(circle at 40% 35%, rgba(212,168,67,.1) 0%, rgba(139,92,246,.08) 100%);
  box-shadow:0 0 20px rgba(212,168,67,.2), 0 0 40px rgba(139,92,246,.08), inset 0 0 14px rgba(139,92,246,.1);
  animation:emblem-pulse 5s ease-in-out infinite;
}
@keyframes emblem-pulse {
  0%,100% { box-shadow:0 0 20px rgba(212,168,67,.2),0 0 40px rgba(139,92,246,.08),inset 0 0 14px rgba(139,92,246,.1); }
  50% { box-shadow:0 0 30px rgba(212,168,67,.36),0 0 50px rgba(139,92,246,.14),inset 0 0 20px rgba(139,92,246,.16); }
}
.sidebar-logo {
  height:60px; border-radius:50%; flex-shrink:0;
  border:2px solid rgba(212,168,67,.35);
  box-shadow:0 0 18px rgba(212,168,67,.18);
}
.sidebar-appname {
  font-family:var(--font-heading); font-size:.96rem;
  color:var(--gold); font-weight:700;
  letter-spacing:.07em; text-align:center; line-height:1.25;
  text-shadow:0 0 24px rgba(212,168,67,.28);
}
.sidebar-subtitle {
  font-size:.66rem; color:rgba(212,168,67,.5);
  font-style:italic; letter-spacing:.1em; text-align:center;
}

/* ── Navigation ──────────────────────────────────────────────── */
.sidebar-nav {
  flex:1; min-height:0; padding:.72rem .6rem;
  display:flex; flex-direction:column; gap:2px;
  overflow-y:auto; overflow-x:hidden;
  scrollbar-width:thin;
  scrollbar-color:rgba(139,92,246,.25) transparent;
  position:relative; z-index:1;
}
.sidebar-nav::-webkit-scrollbar { width:3px; }
.sidebar-nav::-webkit-scrollbar-track { background:transparent; }
.sidebar-nav::-webkit-scrollbar-thumb {
  background:rgba(139,92,246,.3);
  border-radius:4px;
}
.sidebar-nav::-webkit-scrollbar-thumb:hover {
  background:rgba(139,92,246,.55);
}

.nav-item {
  display:flex; align-items:center; gap:.52rem;
  padding:.48rem .72rem; border-radius:9px;
  color:var(--text-secondary); font-size:.845rem;
  transition:all var(--transition);
  border:1px solid transparent; cursor:pointer;
  position:relative; white-space:nowrap; text-decoration:none;
  overflow:hidden;
}
/* Barre latérale dorée — révélée au hover et active */
.nav-item::before {
  content:''; position:absolute; left:0; top:18%; bottom:18%;
  width:2.5px; border-radius:3px;
  background:linear-gradient(180deg, var(--gold), var(--accent));
  opacity:0; transition:opacity var(--transition);
}
.nav-item:hover { background:rgba(139,92,246,.09); color:var(--text-primary); border-color:rgba(139,92,246,.14); }
.nav-item:hover::before { opacity:.45; }
.nav-item.active {
  background:linear-gradient(110deg, rgba(139,92,246,.2) 0%, rgba(139,92,246,.07) 100%);
  color:var(--accent-2); font-weight:600;
  border-color:rgba(139,92,246,.3);
  box-shadow:0 2px 14px rgba(139,92,246,.14), inset 0 0 22px rgba(139,92,246,.04);
}
.nav-item.active::before { opacity:1; }

/* ── Parchemin : sidebar complète ─────────────────────────────── */
[data-theme="parchment"] .sidebar {
  background:linear-gradient(175deg, #e8d9bc 0%, #ddc99e 50%, #e4d3b0 100%);
  border-right:1px solid rgba(139,94,0,.28);
  box-shadow:3px 0 40px rgba(80,40,0,.18), inset -1px 0 0 rgba(139,94,0,.1);
}
[data-theme="parchment"] .sidebar::before {
  background-image:
    radial-gradient(ellipse 180% 50% at 50% 0%, rgba(139,94,0,.14) 0%, transparent 62%),
    radial-gradient(ellipse 90% 30% at 50% 100%, rgba(124,54,0,.1) 0%, transparent 55%),
    url("data:image/svg+xml,%3Csvg width='90' height='90' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='6' cy='6' r='.7' fill='%238b5e00' opacity='.22'/%3E%3Ccircle cx='42' cy='24' r='.45' fill='%237c3600' opacity='.18'/%3E%3Ccircle cx='70' cy='58' r='.6' fill='%238b5e00' opacity='.16'/%3E%3Ccircle cx='20' cy='65' r='.38' fill='%237c3600' opacity='.14'/%3E%3Ccircle cx='78' cy='10' r='.5' fill='%238b5e00' opacity='.18'/%3E%3Ccircle cx='32' cy='80' r='.42' fill='%237c3600' opacity='.14'/%3E%3Ccircle cx='58' cy='40' r='.3' fill='%238b5e00' opacity='.12'/%3E%3C/svg%3E");
}
[data-theme="parchment"] .sidebar-brand {
  background:linear-gradient(180deg, rgba(139,94,0,.1) 0%, transparent 100%);
}
[data-theme="parchment"] .sidebar-brand::after {
  background:linear-gradient(90deg,transparent,rgba(139,94,0,.55),transparent);
}
[data-theme="parchment"] .sb-seal-ring {
  border-color:rgba(139,94,0,.38);
}
[data-theme="parchment"] .sb-seal-ring-2 {
  border-color:rgba(124,54,0,.28);
  border-style:dashed;
}
[data-theme="parchment"] .sidebar-emblem {
  color:var(--gold);
  border-color:rgba(139,94,0,.45);
  background:radial-gradient(circle at 40% 35%, rgba(139,94,0,.14) 0%, rgba(124,54,0,.08) 100%);
  box-shadow:0 0 20px rgba(139,94,0,.22), 0 0 40px rgba(124,54,0,.1), inset 0 0 14px rgba(139,94,0,.1);
  animation:emblem-pulse-parchment 5s ease-in-out infinite;
}
@keyframes emblem-pulse-parchment {
  0%,100% { box-shadow:0 0 20px rgba(139,94,0,.22),0 0 40px rgba(124,54,0,.1),inset 0 0 14px rgba(139,94,0,.1); }
  50%      { box-shadow:0 0 32px rgba(139,94,0,.38),0 0 52px rgba(124,54,0,.18),inset 0 0 20px rgba(139,94,0,.16); }
}
[data-theme="parchment"] .sidebar-logo {
  border-color:rgba(139,94,0,.42);
  box-shadow:0 0 18px rgba(139,94,0,.2);
}
[data-theme="parchment"] .sidebar-appname {
  color:var(--gold);
  text-shadow:0 0 24px rgba(139,94,0,.25);
}
[data-theme="parchment"] .sidebar-subtitle {
  color:rgba(124,54,0,.55);
}
[data-theme="parchment"] .nav-item {
  color:var(--text-secondary);
}
[data-theme="parchment"] .nav-item:hover {
  background:rgba(124,54,0,.08);
  border-color:rgba(139,94,0,.18);
  color:var(--text-primary);
}
[data-theme="parchment"] .nav-item:hover::before { background:var(--accent); opacity:.5; }
[data-theme="parchment"] .nav-item.active {
  background:linear-gradient(110deg, rgba(124,54,0,.14) 0%, rgba(124,54,0,.05) 100%);
  color:var(--accent); border-color:rgba(124,54,0,.3);
  box-shadow:0 2px 12px rgba(124,54,0,.1);
}
[data-theme="parchment"] .nav-item.active::before { background:var(--accent); opacity:1; }
[data-theme="parchment"] .nav-group-toggle {
  color:var(--text-secondary);
}
[data-theme="parchment"] .nav-group-toggle:hover {
  background:rgba(124,54,0,.08);
  border-color:rgba(139,94,0,.18);
  color:var(--text-primary);
}
[data-theme="parchment"] .nav-group.open .nav-group-toggle {
  background:rgba(124,54,0,.07);
  border-color:rgba(139,94,0,.14);
  color:var(--text-primary);
}
[data-theme="parchment"] .nav-group-items {
  border-left-color:rgba(124,54,0,.28);
}
[data-theme="parchment"] .nav-sub { color:var(--text-muted); }
[data-theme="parchment"] .nav-sub:hover { color:var(--text-primary); background:rgba(124,54,0,.07); }
[data-theme="parchment"] .nav-sub.active { color:var(--accent); background:rgba(124,54,0,.12); }
[data-theme="parchment"] .nav-action { color:var(--accent) !important; }
[data-theme="parchment"] .nav-action:hover { background:rgba(124,54,0,.1) !important; }
[data-theme="parchment"] .nav-divider {
  color:rgba(139,94,0,.6);
}
[data-theme="parchment"] .nav-divider::before {
  background:linear-gradient(90deg, transparent, rgba(139,94,0,.35));
}
[data-theme="parchment"] .nav-divider::after {
  background:linear-gradient(90deg, rgba(139,94,0,.35), transparent);
}
[data-theme="parchment"] .sidebar-user {
  border-top-color:rgba(139,94,0,.2);
  background:linear-gradient(0deg, rgba(124,54,0,.1) 0%, transparent 100%);
}
[data-theme="parchment"] .sidebar-user::before {
  background:linear-gradient(90deg,transparent,rgba(139,94,0,.48),transparent);
}
[data-theme="parchment"] .su-card:hover {
  background:rgba(124,54,0,.1);
  border-color:rgba(124,54,0,.25);
  color:var(--text-primary);
}
[data-theme="parchment"] .su-avatar {
  border-color:rgba(139,94,0,.42);
  box-shadow:0 0 12px rgba(139,94,0,.18);
}
[data-theme="parchment"] .su-avatar-placeholder {
  background:linear-gradient(135deg,rgba(124,54,0,.2),rgba(139,94,0,.1));
  color:var(--gold);
  border-color:rgba(139,94,0,.38);
}
[data-theme="parchment"] .su-btn {
  background:rgba(255,255,255,.22);
  border-color:rgba(139,94,0,.25);
  color:var(--text-muted);
}
[data-theme="parchment"] .su-btn:hover {
  background:rgba(124,54,0,.14);
  color:var(--accent);
  border-color:rgba(124,54,0,.45);
}

/* ════════════════════════════════════════════════════════════════
   PARCHEMIN SOMBRE — sidebar complète
   ════════════════════════════════════════════════════════════════ */
[data-theme="parchment-dark"] .sidebar {
  background:linear-gradient(175deg, #1d1208 0%, #120b04 50%, #181008 100%);
  border-right:1px solid rgba(212,168,67,.18);
  box-shadow:3px 0 40px rgba(0,0,0,.88), inset -1px 0 0 rgba(212,168,67,.05);
}
[data-theme="parchment-dark"] .sidebar::before {
  background-image:
    radial-gradient(ellipse 180% 50% at 50% 0%, rgba(212,168,67,.1) 0%, transparent 62%),
    radial-gradient(ellipse 90% 30% at 50% 100%, rgba(200,120,32,.08) 0%, transparent 55%),
    url("data:image/svg+xml,%3Csvg width='90' height='90' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='6' cy='6' r='.7' fill='%23d4a843' opacity='.16'/%3E%3Ccircle cx='42' cy='24' r='.45' fill='%23c87820' opacity='.12'/%3E%3Ccircle cx='70' cy='58' r='.6' fill='%23d4a843' opacity='.12'/%3E%3Ccircle cx='20' cy='65' r='.38' fill='%23c87820' opacity='.1'/%3E%3Ccircle cx='78' cy='10' r='.5' fill='%23d4a843' opacity='.14'/%3E%3Ccircle cx='32' cy='80' r='.42' fill='%23c87820' opacity='.1'/%3E%3Ccircle cx='58' cy='40' r='.3' fill='%23d4a843' opacity='.08'/%3E%3Ccircle cx='85' cy='75' r='.5' fill='%23c87820' opacity='.09'/%3E%3C/svg%3E");
}
[data-theme="parchment-dark"] .sidebar-brand {
  background:linear-gradient(180deg, rgba(212,168,67,.08) 0%, transparent 100%);
}
[data-theme="parchment-dark"] .sidebar-brand::after {
  background:linear-gradient(90deg,transparent,rgba(212,168,67,.42),transparent);
}
[data-theme="parchment-dark"] .sb-seal-ring {
  border-color:rgba(212,168,67,.26);
}
[data-theme="parchment-dark"] .sb-seal-ring-2 {
  border-color:rgba(200,120,32,.2);
  border-style:dashed;
}
[data-theme="parchment-dark"] .sidebar-emblem {
  color:var(--gold);
  border-color:rgba(212,168,67,.36);
  background:radial-gradient(circle at 40% 35%, rgba(212,168,67,.12) 0%, rgba(200,120,32,.08) 100%);
  box-shadow:0 0 20px rgba(212,168,67,.2), 0 0 40px rgba(200,120,32,.08), inset 0 0 14px rgba(212,168,67,.08);
  animation:emblem-pulse 5s ease-in-out infinite;
}
[data-theme="parchment-dark"] .sidebar-logo {
  border-color:rgba(212,168,67,.36);
  box-shadow:0 0 18px rgba(212,168,67,.18);
}
[data-theme="parchment-dark"] .sidebar-appname {
  color:var(--gold);
  text-shadow:0 0 24px rgba(212,168,67,.3);
}
[data-theme="parchment-dark"] .sidebar-subtitle {
  color:rgba(212,168,67,.42);
}
[data-theme="parchment-dark"] .nav-item { color:var(--text-secondary); }
[data-theme="parchment-dark"] .nav-item:hover {
  background:rgba(200,120,32,.1);
  border-color:rgba(212,168,67,.18);
  color:var(--text-primary);
}
[data-theme="parchment-dark"] .nav-item:hover::before { background:linear-gradient(180deg,var(--gold),var(--accent)); opacity:.55; }
[data-theme="parchment-dark"] .nav-item.active {
  background:linear-gradient(110deg, rgba(200,120,32,.2) 0%, rgba(200,120,32,.06) 100%);
  color:var(--accent-2); border-color:rgba(200,120,32,.34);
  box-shadow:0 2px 14px rgba(200,120,32,.16), inset 0 0 22px rgba(200,120,32,.04);
}
[data-theme="parchment-dark"] .nav-item.active::before { background:linear-gradient(180deg,var(--gold),var(--accent)); opacity:1; }
[data-theme="parchment-dark"] .nav-group-toggle { color:var(--text-secondary); }
[data-theme="parchment-dark"] .nav-group-toggle:hover {
  background:rgba(200,120,32,.1); border-color:rgba(212,168,67,.18); color:var(--text-primary);
}
[data-theme="parchment-dark"] .nav-group.open .nav-group-toggle {
  background:rgba(200,120,32,.07); border-color:rgba(212,168,67,.13); color:var(--text-primary);
}
[data-theme="parchment-dark"] .nav-group-items { border-left-color:rgba(212,168,67,.24); }
[data-theme="parchment-dark"] .nav-sub { color:var(--text-muted); }
[data-theme="parchment-dark"] .nav-sub:hover { color:var(--text-primary); background:rgba(200,120,32,.08); }
[data-theme="parchment-dark"] .nav-sub.active { color:var(--accent-2); background:rgba(200,120,32,.14); }
[data-theme="parchment-dark"] .nav-action { color:var(--accent-2) !important; }
[data-theme="parchment-dark"] .nav-action:hover { background:rgba(200,120,32,.12) !important; }
[data-theme="parchment-dark"] .nav-divider { color:rgba(212,168,67,.52); }
[data-theme="parchment-dark"] .nav-divider::before {
  background:linear-gradient(90deg, transparent, rgba(212,168,67,.28));
}
[data-theme="parchment-dark"] .nav-divider::after {
  background:linear-gradient(90deg, rgba(212,168,67,.28), transparent);
}
[data-theme="parchment-dark"] .sidebar-user {
  border-top-color:rgba(212,168,67,.13);
  background:linear-gradient(0deg, rgba(200,120,32,.1) 0%, transparent 100%);
}
[data-theme="parchment-dark"] .sidebar-user::before {
  background:linear-gradient(90deg,transparent,rgba(212,168,67,.38),transparent);
}
[data-theme="parchment-dark"] .su-card:hover {
  background:rgba(200,120,32,.12); border-color:rgba(200,120,32,.28); color:var(--text-primary);
}
[data-theme="parchment-dark"] .su-avatar {
  border-color:rgba(212,168,67,.36); box-shadow:0 0 12px rgba(212,168,67,.16);
}
[data-theme="parchment-dark"] .su-avatar-placeholder {
  background:linear-gradient(135deg,rgba(200,120,32,.22),rgba(212,168,67,.1));
  color:var(--gold); border-color:rgba(212,168,67,.32);
}
[data-theme="parchment-dark"] .su-btn {
  background:rgba(255,255,255,.04); border-color:rgba(212,168,67,.18); color:var(--text-muted);
}
[data-theme="parchment-dark"] .su-btn:hover {
  background:rgba(200,120,32,.18); color:var(--gold); border-color:rgba(212,168,67,.42);
}

/* ════════════════════════════════════════════════════════════════
   CRAMOISI — sidebar complète
   ════════════════════════════════════════════════════════════════ */
[data-theme="crimson"] .sidebar {
  background:linear-gradient(175deg, #1c060e 0%, #0e0308 50%, #160509 100%);
  border-right:1px solid rgba(220,38,38,.18);
  box-shadow:3px 0 40px rgba(0,0,0,.88), inset -1px 0 0 rgba(220,38,38,.05);
}
[data-theme="crimson"] .sidebar::before {
  background-image:
    radial-gradient(ellipse 180% 50% at 50% 0%, rgba(220,38,38,.1) 0%, transparent 62%),
    radial-gradient(ellipse 90% 30% at 50% 100%, rgba(224,112,64,.08) 0%, transparent 55%),
    url("data:image/svg+xml,%3Csvg width='90' height='90' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='6' cy='6' r='.7' fill='%23dc2626' opacity='.16'/%3E%3Ccircle cx='42' cy='24' r='.45' fill='%23e07040' opacity='.12'/%3E%3Ccircle cx='70' cy='58' r='.6' fill='%23dc2626' opacity='.12'/%3E%3Ccircle cx='20' cy='65' r='.38' fill='%23e07040' opacity='.1'/%3E%3Ccircle cx='78' cy='10' r='.5' fill='%23dc2626' opacity='.14'/%3E%3Ccircle cx='32' cy='80' r='.42' fill='%23e07040' opacity='.1'/%3E%3Ccircle cx='58' cy='40' r='.3' fill='%23dc2626' opacity='.08'/%3E%3C/svg%3E");
}
[data-theme="crimson"] .sidebar-brand {
  background:linear-gradient(180deg, rgba(220,38,38,.08) 0%, transparent 100%);
}
[data-theme="crimson"] .sidebar-brand::after {
  background:linear-gradient(90deg,transparent,rgba(220,38,38,.42),transparent);
}
[data-theme="crimson"] .sb-seal-ring { border-color:rgba(220,38,38,.26); }
[data-theme="crimson"] .sb-seal-ring-2 { border-color:rgba(224,112,64,.2); border-style:dashed; }
[data-theme="crimson"] .sb-seal-ring-3 { border-color:rgba(220,38,38,.08); }
[data-theme="crimson"] .sb-seal-ring-3::before {
  background:radial-gradient(circle, var(--accent) 0%, transparent 70%);
  box-shadow:0 0 8px 2px rgba(220,38,38,.6), 0 0 18px rgba(220,38,38,.25);
}
[data-theme="crimson"] .sidebar-emblem {
  color:var(--accent-2);
  border-color:rgba(220,38,38,.36);
  background:radial-gradient(circle at 40% 35%, rgba(220,38,38,.12) 0%, rgba(224,112,64,.08) 100%);
  box-shadow:0 0 20px rgba(220,38,38,.2), 0 0 40px rgba(224,112,64,.08), inset 0 0 14px rgba(220,38,38,.08);
  animation:emblem-pulse-crimson 5s ease-in-out infinite;
}
@keyframes emblem-pulse-crimson {
  0%,100% { box-shadow:0 0 20px rgba(220,38,38,.2),0 0 40px rgba(224,112,64,.08),inset 0 0 14px rgba(220,38,38,.08); }
  50%     { box-shadow:0 0 34px rgba(220,38,38,.38),0 0 54px rgba(224,112,64,.18),inset 0 0 20px rgba(220,38,38,.14); }
}
[data-theme="crimson"] .sidebar-logo { border-color:rgba(220,38,38,.36); box-shadow:0 0 18px rgba(220,38,38,.18); }
[data-theme="crimson"] .sidebar-appname { color:var(--accent-2); text-shadow:0 0 24px rgba(220,38,38,.3); animation:appname-glow-crimson 6s ease-in-out infinite; }
@keyframes appname-glow-crimson {
  0%,100% { text-shadow:0 0 12px rgba(220,38,38,.2); }
  50%     { text-shadow:0 0 28px rgba(220,38,38,.5), 0 0 50px rgba(220,38,38,.15); }
}
[data-theme="crimson"] .sidebar-subtitle { color:rgba(220,38,38,.42); }
[data-theme="crimson"] .nav-item { color:var(--text-secondary); }
[data-theme="crimson"] .nav-item:hover { background:rgba(220,38,38,.1); border-color:rgba(220,38,38,.18); color:var(--text-primary); }
[data-theme="crimson"] .nav-item:hover::before { background:linear-gradient(180deg,var(--gold),var(--accent)); opacity:.55; }
[data-theme="crimson"] .nav-item.active {
  background:linear-gradient(110deg, rgba(220,38,38,.2) 0%, rgba(220,38,38,.06) 100%);
  color:var(--accent-2); border-color:rgba(220,38,38,.34);
  box-shadow:0 2px 14px rgba(220,38,38,.16), inset 0 0 22px rgba(220,38,38,.04);
}
[data-theme="crimson"] .nav-item.active::before { background:linear-gradient(180deg,var(--gold),var(--accent)); opacity:1; }
[data-theme="crimson"] .nav-item.active::after { background:linear-gradient(90deg, transparent, rgba(220,38,38,.14), transparent) !important; }
[data-theme="crimson"] .nav-group-toggle { color:var(--text-secondary); }
[data-theme="crimson"] .nav-group-toggle:hover { background:rgba(220,38,38,.1); border-color:rgba(220,38,38,.18); color:var(--text-primary); }
[data-theme="crimson"] .nav-group.open .nav-group-toggle { background:rgba(220,38,38,.07); border-color:rgba(220,38,38,.13); color:var(--text-primary); }
[data-theme="crimson"] .nav-group-items { border-left-color:rgba(220,38,38,.24); }
[data-theme="crimson"] .nav-sub { color:var(--text-muted); }
[data-theme="crimson"] .nav-sub:hover { color:var(--text-primary); background:rgba(220,38,38,.08); }
[data-theme="crimson"] .nav-sub.active { color:var(--accent-2); background:rgba(220,38,38,.14); }
[data-theme="crimson"] .nav-action { color:var(--accent-2) !important; }
[data-theme="crimson"] .nav-action:hover { background:rgba(220,38,38,.12) !important; }
[data-theme="crimson"] .nav-divider { color:rgba(220,38,38,.52); }
[data-theme="crimson"] .nav-divider::before { background:linear-gradient(90deg, transparent, rgba(220,38,38,.28)); }
[data-theme="crimson"] .nav-divider::after  { background:linear-gradient(90deg, rgba(220,38,38,.28), transparent); }
[data-theme="crimson"] .sidebar-user { border-top-color:rgba(220,38,38,.13); background:linear-gradient(0deg, rgba(220,38,38,.1) 0%, transparent 100%); }
[data-theme="crimson"] .sidebar-user::before { background:linear-gradient(90deg,transparent,rgba(220,38,38,.38),transparent); }
[data-theme="crimson"] .su-card:hover { background:rgba(220,38,38,.12); border-color:rgba(220,38,38,.28); color:var(--text-primary); }
[data-theme="crimson"] .su-avatar { border-color:rgba(220,38,38,.36); box-shadow:0 0 12px rgba(220,38,38,.16); }
[data-theme="crimson"] .su-avatar-placeholder { background:linear-gradient(135deg,rgba(220,38,38,.22),rgba(224,112,64,.1)); color:var(--accent-2); border-color:rgba(220,38,38,.32); }
[data-theme="crimson"] .su-btn { background:rgba(255,255,255,.04); border-color:rgba(220,38,38,.18); color:var(--text-muted); }
[data-theme="crimson"] .su-btn:hover { background:rgba(220,38,38,.18); color:var(--accent-2); border-color:rgba(220,38,38,.42); }
[data-theme="crimson"] .nav-ripple { background:rgba(220,38,38,.35); }

/* ════════════════════════════════════════════════════════════════
   ÉMERAUDE — sidebar complète
   ════════════════════════════════════════════════════════════════ */
[data-theme="emerald"] .sidebar {
  background:linear-gradient(175deg, #091506 0%, #030a04 50%, #051008 100%);
  border-right:1px solid rgba(16,185,129,.18);
  box-shadow:3px 0 40px rgba(0,0,0,.88), inset -1px 0 0 rgba(16,185,129,.05);
}
[data-theme="emerald"] .sidebar::before {
  background-image:
    radial-gradient(ellipse 180% 50% at 50% 0%, rgba(16,185,129,.1) 0%, transparent 62%),
    radial-gradient(ellipse 90% 30% at 50% 100%, rgba(96,200,120,.08) 0%, transparent 55%),
    url("data:image/svg+xml,%3Csvg width='90' height='90' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='6' cy='6' r='.7' fill='%2310b981' opacity='.16'/%3E%3Ccircle cx='42' cy='24' r='.45' fill='%2360c878' opacity='.12'/%3E%3Ccircle cx='70' cy='58' r='.6' fill='%2310b981' opacity='.12'/%3E%3Ccircle cx='20' cy='65' r='.38' fill='%2360c878' opacity='.1'/%3E%3Ccircle cx='78' cy='10' r='.5' fill='%2310b981' opacity='.14'/%3E%3Ccircle cx='32' cy='80' r='.42' fill='%2360c878' opacity='.1'/%3E%3Ccircle cx='58' cy='40' r='.3' fill='%2310b981' opacity='.08'/%3E%3C/svg%3E");
}
[data-theme="emerald"] .sidebar-brand { background:linear-gradient(180deg, rgba(16,185,129,.08) 0%, transparent 100%); }
[data-theme="emerald"] .sidebar-brand::after { background:linear-gradient(90deg,transparent,rgba(16,185,129,.42),transparent); }
[data-theme="emerald"] .sb-seal-ring { border-color:rgba(16,185,129,.26); }
[data-theme="emerald"] .sb-seal-ring-2 { border-color:rgba(96,200,120,.2); border-style:dashed; }
[data-theme="emerald"] .sb-seal-ring-3 { border-color:rgba(16,185,129,.08); }
[data-theme="emerald"] .sb-seal-ring-3::before {
  background:radial-gradient(circle, var(--accent) 0%, transparent 70%);
  box-shadow:0 0 8px 2px rgba(16,185,129,.6), 0 0 18px rgba(16,185,129,.25);
}
[data-theme="emerald"] .sidebar-emblem {
  color:var(--accent-2);
  border-color:rgba(16,185,129,.36);
  background:radial-gradient(circle at 40% 35%, rgba(16,185,129,.12) 0%, rgba(96,200,120,.08) 100%);
  box-shadow:0 0 20px rgba(16,185,129,.2), 0 0 40px rgba(96,200,120,.08), inset 0 0 14px rgba(16,185,129,.08);
  animation:emblem-pulse-emerald 5s ease-in-out infinite;
}
@keyframes emblem-pulse-emerald {
  0%,100% { box-shadow:0 0 20px rgba(16,185,129,.2),0 0 40px rgba(96,200,120,.08),inset 0 0 14px rgba(16,185,129,.08); }
  50%     { box-shadow:0 0 34px rgba(16,185,129,.38),0 0 54px rgba(96,200,120,.18),inset 0 0 20px rgba(16,185,129,.14); }
}
[data-theme="emerald"] .sidebar-logo { border-color:rgba(16,185,129,.36); box-shadow:0 0 18px rgba(16,185,129,.18); }
[data-theme="emerald"] .sidebar-appname { color:var(--accent-2); text-shadow:0 0 24px rgba(16,185,129,.3); animation:appname-glow-emerald 6s ease-in-out infinite; }
@keyframes appname-glow-emerald {
  0%,100% { text-shadow:0 0 12px rgba(16,185,129,.2); }
  50%     { text-shadow:0 0 28px rgba(16,185,129,.5), 0 0 50px rgba(16,185,129,.15); }
}
[data-theme="emerald"] .sidebar-subtitle { color:rgba(16,185,129,.42); }
[data-theme="emerald"] .nav-item { color:var(--text-secondary); }
[data-theme="emerald"] .nav-item:hover { background:rgba(16,185,129,.1); border-color:rgba(16,185,129,.18); color:var(--text-primary); }
[data-theme="emerald"] .nav-item:hover::before { background:linear-gradient(180deg,var(--gold),var(--accent)); opacity:.55; }
[data-theme="emerald"] .nav-item.active {
  background:linear-gradient(110deg, rgba(16,185,129,.2) 0%, rgba(16,185,129,.06) 100%);
  color:var(--accent-2); border-color:rgba(16,185,129,.34);
  box-shadow:0 2px 14px rgba(16,185,129,.16), inset 0 0 22px rgba(16,185,129,.04);
}
[data-theme="emerald"] .nav-item.active::before { background:linear-gradient(180deg,var(--gold),var(--accent)); opacity:1; }
[data-theme="emerald"] .nav-item.active::after { background:linear-gradient(90deg, transparent, rgba(16,185,129,.14), transparent) !important; }
[data-theme="emerald"] .nav-group-toggle { color:var(--text-secondary); }
[data-theme="emerald"] .nav-group-toggle:hover { background:rgba(16,185,129,.1); border-color:rgba(16,185,129,.18); color:var(--text-primary); }
[data-theme="emerald"] .nav-group.open .nav-group-toggle { background:rgba(16,185,129,.07); border-color:rgba(16,185,129,.13); color:var(--text-primary); }
[data-theme="emerald"] .nav-group-items { border-left-color:rgba(16,185,129,.24); }
[data-theme="emerald"] .nav-sub { color:var(--text-muted); }
[data-theme="emerald"] .nav-sub:hover { color:var(--text-primary); background:rgba(16,185,129,.08); }
[data-theme="emerald"] .nav-sub.active { color:var(--accent-2); background:rgba(16,185,129,.14); }
[data-theme="emerald"] .nav-action { color:var(--accent-2) !important; }
[data-theme="emerald"] .nav-action:hover { background:rgba(16,185,129,.12) !important; }
[data-theme="emerald"] .nav-divider { color:rgba(16,185,129,.52); }
[data-theme="emerald"] .nav-divider::before { background:linear-gradient(90deg, transparent, rgba(16,185,129,.28)); }
[data-theme="emerald"] .nav-divider::after  { background:linear-gradient(90deg, rgba(16,185,129,.28), transparent); }
[data-theme="emerald"] .sidebar-user { border-top-color:rgba(16,185,129,.13); background:linear-gradient(0deg, rgba(16,185,129,.1) 0%, transparent 100%); }
[data-theme="emerald"] .sidebar-user::before { background:linear-gradient(90deg,transparent,rgba(16,185,129,.38),transparent); }
[data-theme="emerald"] .su-card:hover { background:rgba(16,185,129,.12); border-color:rgba(16,185,129,.28); color:var(--text-primary); }
[data-theme="emerald"] .su-avatar { border-color:rgba(16,185,129,.36); box-shadow:0 0 12px rgba(16,185,129,.16); }
[data-theme="emerald"] .su-avatar-placeholder { background:linear-gradient(135deg,rgba(16,185,129,.22),rgba(96,200,120,.1)); color:var(--accent-2); border-color:rgba(16,185,129,.32); }
[data-theme="emerald"] .su-btn { background:rgba(255,255,255,.04); border-color:rgba(16,185,129,.18); color:var(--text-muted); }
[data-theme="emerald"] .su-btn:hover { background:rgba(16,185,129,.18); color:var(--accent-2); border-color:rgba(16,185,129,.42); }
[data-theme="emerald"] .nav-ripple { background:rgba(16,185,129,.35); }

.nav-icon { font-size:.97rem; width:1.25rem; text-align:center; flex-shrink:0; }
.sidebar-label { flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; }

/* Groupes */
.nav-group { display:flex; flex-direction:column; gap:2px; }
.nav-group-toggle {
  display:flex; align-items:center; gap:.52rem;
  padding:.48rem .72rem; border-radius:9px;
  color:var(--text-secondary); font-size:.845rem;
  background:none; border:1px solid transparent;
  cursor:pointer; width:100%; text-align:left;
  transition:all var(--transition); white-space:nowrap;
}
.nav-group-toggle:hover { background:rgba(139,92,246,.09); color:var(--text-primary); border-color:rgba(139,92,246,.14); }
.nav-group.open .nav-group-toggle { color:var(--text-primary); background:rgba(139,92,246,.06); border-color:rgba(139,92,246,.1); }
.nav-arrow-svg { width:9px; height:6px; margin-left:auto; flex-shrink:0; stroke:currentColor; transition:transform var(--transition); }
.nav-group.open .nav-arrow-svg { transform:rotate(180deg); }
.nav-group-items {
  display:flex; flex-direction:column; gap:1px;
  padding-left:.55rem;
  border-left:1px solid rgba(139,92,246,.22);
  margin-left:.9rem; margin-top:0;
  max-height:0; overflow:hidden; opacity:0;
  transition:max-height .32s cubic-bezier(.4,0,.2,1), opacity .22s ease, margin-top .22s ease;
}
.nav-group.open .nav-group-items {
  max-height:440px; opacity:1; margin-top:2px;
}
.nav-sub { font-size:.8rem; padding:.38rem .62rem; color:var(--text-muted); border-radius:7px; }
.nav-sub:hover { color:var(--text-primary); background:rgba(139,92,246,.07); }
.nav-sub.active { color:var(--accent-2); font-weight:600; background:rgba(139,92,246,.11); border-radius:7px; }
.nav-action { color:var(--accent) !important; }
.nav-action:hover { background:var(--accent-glow) !important; }

/* Séparateurs — style "Chapitre enluminé" */
.nav-divider {
  display:flex; align-items:center; gap:.45rem;
  margin:.7rem .2rem .3rem;
  font-size:.58rem; text-transform:uppercase;
  letter-spacing:.18em; color:rgba(212,168,67,.55);
  font-family:var(--font-heading);
}
.nav-divider::before {
  content:''; flex:1; height:1px;
  background:linear-gradient(90deg, transparent, rgba(212,168,67,.28));
}
.nav-divider::after {
  content:''; flex:1; height:1px;
  background:linear-gradient(90deg, rgba(212,168,67,.28), transparent);
}

/* ── Pied de page utilisateur ────────────────────────────────── */
.sidebar-user {
  flex-shrink:0; position:relative; z-index:1;
  padding:.65rem .6rem .7rem;
  border-top:1px solid rgba(212,168,67,.14);
  background:linear-gradient(0deg, rgba(139,92,246,.09) 0%, transparent 100%);
}
.sidebar-user::before {
  content:''; position:absolute; top:-1px; left:14%; right:14%;
  height:1px; background:linear-gradient(90deg,transparent,rgba(212,168,67,.42),transparent);
}
.su-card {
  display:flex; align-items:center; gap:.55rem;
  padding:.4rem .48rem; border-radius:10px;
  color:var(--text-primary); text-decoration:none;
  transition:all var(--transition); flex:1; overflow:hidden;
  border:1px solid transparent;
}
.su-card:hover { background:rgba(139,92,246,.11); border-color:rgba(139,92,246,.22); color:var(--text-primary); }
.su-avatar {
  width:34px; height:34px; border-radius:50%; flex-shrink:0; object-fit:cover;
  border:2px solid rgba(212,168,67,.38);
  box-shadow:0 0 12px rgba(212,168,67,.16);
}
.su-avatar-placeholder {
  display:flex; align-items:center; justify-content:center;
  background:linear-gradient(135deg,rgba(139,92,246,.25),rgba(212,168,67,.1));
  color:var(--gold); font-weight:700; font-size:.92rem;
  border:2px solid rgba(212,168,67,.35);
  box-shadow:0 0 12px rgba(212,168,67,.14);
}
.su-info { overflow:hidden; flex:1; }
.su-name {
  font-size:.82rem; font-weight:600;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
  font-family:var(--font-heading);
}
.su-role { font-size:.68rem; white-space:nowrap; font-style:italic; opacity:.9; }
.su-actions { display:flex; gap:.25rem; flex-shrink:0; }
.su-btn {
  display:flex; align-items:center; justify-content:center;
  width:30px; height:30px;
  background:rgba(255,255,255,.04);
  border:1px solid rgba(212,168,67,.22); border-radius:8px;
  color:var(--text-muted); cursor:pointer; font-size:.85rem;
  transition:all var(--transition); text-decoration:none;
}
.su-btn:hover { background:rgba(139,92,246,.16); color:var(--text-primary); border-color:rgba(139,92,246,.4); }

/* ════════════════════════════════════════════════════════════════
   TOPBAR
   ════════════════════════════════════════════════════════════════ */
.topbar {
  display:flex; align-items:center; gap:.65rem;
  padding:0 1.1rem; height:var(--topbar-h);
  background:var(--bg-surface);
  border-bottom:1px solid var(--border);
  position:sticky; top:0; z-index:80;
  box-shadow:0 1px 0 var(--border), var(--shadow-xs);
  flex-shrink:0;
}
.sidebar-toggle {
  display:none; flex-direction:column; justify-content:center;
  gap:5px; width:30px; height:30px; background:none;
  border:none; cursor:pointer; padding:4px; flex-shrink:0;
}
.sidebar-toggle span { display:block; height:2px; background:var(--text-secondary); border-radius:2px; transition:all var(--transition); }
.page-title {
  font-family:var(--font-heading); font-size:1rem; font-weight:600;
  color:var(--gold); flex:1;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.topbar-right { display:flex; align-items:center; gap:.6rem; flex-shrink:0; }
.topbar-clock { font-family:monospace; font-size:.78rem; color:var(--text-muted); display:none; }
@media(min-width:900px) { .topbar-clock { display:block; } }

/* Barre nav contextuelle cours/planning */
.ctx-nav {
  display:flex; align-items:center; gap:2px;
  padding:.3rem; background:var(--bg-raised);
  border:1px solid var(--border); border-radius:9px;
}
.ctx-nav-btn {
  display:flex; align-items:center; gap:.3rem;
  padding:.28rem .65rem; border-radius:6px;
  color:var(--text-muted); font-size:.78rem;
  transition:all var(--transition); text-decoration:none; white-space:nowrap;
}
.ctx-nav-btn:hover { background:var(--bg-hover); color:var(--text-primary); }
.ctx-nav-btn.active { background:var(--accent-glow); color:var(--accent-2); font-weight:600; border:1px solid rgba(139,92,246,.25); }

/* Quick search */
.quick-search { position:relative; }
.quick-search-input {
  padding:.32rem .75rem;
  background:var(--bg-raised); border:1px solid var(--border);
  border-radius:18px; color:var(--text-primary); font-size:.8rem;
  width:155px; transition:all var(--transition);
}
.quick-search-input::placeholder { color:var(--text-muted); }
.quick-search-input:focus { outline:none; width:215px; border-color:var(--accent); box-shadow:0 0 0 3px var(--accent-glow); }
.qs-results {
  position:absolute; top:calc(100% + 6px); right:0;
  width:310px; background:var(--bg-surface);
  border:1px solid var(--border); border-radius:var(--radius-lg);
  box-shadow:var(--shadow); z-index:200; display:none;
  max-height:360px; overflow-y:auto;
}
.qs-results.visible { display:block; animation:fadeIn .15s ease; }
@keyframes fadeIn { from{opacity:0;transform:translateY(-4px)} to{opacity:1;transform:none} }
.qs-item {
  display:flex; align-items:center; gap:.55rem;
  padding:.5rem .9rem; border-bottom:1px solid var(--border);
  color:var(--text-primary); font-size:.83rem; transition:background var(--transition);
}
.qs-item:hover { background:var(--bg-hover); }
.qs-item:last-child { border-bottom:none; }
.qs-type { font-size:.66rem; color:var(--text-muted); background:var(--bg-raised); padding:.08rem .38rem; border-radius:4px; flex-shrink:0; }
.qs-empty,.qs-loading { padding:.9rem; text-align:center; color:var(--text-muted); font-size:.83rem; }

/* Breadcrumbs */
.breadcrumbs {
  display:flex; align-items:center; gap:.3rem;
  padding:.38rem 1.1rem;
  background:var(--bg-raised); border-bottom:1px solid var(--border);
  font-size:.75rem; flex-shrink:0;
}
.breadcrumbs a { color:var(--text-muted); }
.breadcrumbs a:hover { color:var(--accent-2); }
.bc-sep { color:var(--border-light); }
.bc-current { color:var(--text-secondary); font-weight:500; }

/* Flash */
.flash {
  margin:.65rem 1.1rem 0; padding:.65rem 1rem;
  border-radius:var(--radius); border-left:3px solid;
  font-size:.855rem; animation:slideDown .22s ease;
}
.flash-success { background:var(--success-bg); border-color:var(--success); color:var(--success); }
.flash-error   { background:var(--danger-bg);  border-color:var(--danger);  color:var(--danger); }
.flash-warning { background:var(--warning-bg); border-color:var(--warning); color:var(--warning); }
.flash-info    { background:rgba(59,130,246,.12); border-color:var(--info); color:var(--info); }
@keyframes slideDown { from{transform:translateY(-6px);opacity:0} to{transform:none;opacity:1} }

.page-content { flex:1; padding:1.1rem; }

/* ════════════════════════════════════════════════════════════════
   BOUTONS
   ════════════════════════════════════════════════════════════════ */
.btn {
  display:inline-flex; align-items:center; gap:.35rem;
  padding:.42rem .95rem; border-radius:var(--radius);
  border:1px solid transparent; font-size:.845rem; font-weight:500;
  cursor:pointer; transition:all var(--transition);
  text-decoration:none; line-height:1; white-space:nowrap;
}
.btn:disabled { opacity:.45; cursor:not-allowed; }
.btn-primary {
  background:linear-gradient(135deg,var(--accent),#7c3aed);
  color:#fff; border-color:var(--accent);
  box-shadow:0 2px 8px rgba(139,92,246,.3);
}
.btn-primary:hover {
  background:linear-gradient(135deg,var(--accent-2),var(--accent));
  box-shadow:0 4px 14px rgba(139,92,246,.45); color:#fff;
}
.btn-secondary { background:var(--bg-raised); color:var(--text-primary); border-color:var(--border-light); }
.btn-secondary:hover { background:var(--bg-hover); border-color:var(--accent); }
.btn-ghost { background:transparent; color:var(--text-secondary); border-color:var(--border); }
.btn-ghost:hover { background:var(--bg-hover); color:var(--text-primary); }
.btn-danger { background:var(--danger); color:#fff; border-color:var(--danger); box-shadow:0 2px 8px rgba(239,68,68,.3); }
.btn-danger:hover { filter:brightness(1.12); }
.btn-discord { background:#5865F2; color:#fff; border-color:#5865F2; padding:.58rem 1.35rem; font-size:.93rem; box-shadow:0 2px 8px rgba(88,101,242,.3); }
.btn-discord:hover { background:#4752c4; color:#fff; }
.btn-sm { padding:.28rem .65rem; font-size:.76rem; }
.btn-full { width:100%; justify-content:center; }
.btn-warning-confirm { background:var(--warning)!important; border-color:var(--warning)!important; color:#fff!important; }
.inline-form { display:contents; }
.page-actions { display:flex; align-items:center; gap:.55rem; margin-bottom:1rem; flex-wrap:wrap; }

/* ════════════════════════════════════════════════════════════════
   FORMULAIRES
   ════════════════════════════════════════════════════════════════ */
.arcane-form,.form-page { max-width:760px; }
.form-grid { display:grid; grid-template-columns:1fr 1fr; gap:.9rem; }
.form-group { display:flex; flex-direction:column; gap:.3rem; }
.form-group.full { grid-column:1/-1; }
.form-group label { font-size:.78rem; color:var(--text-secondary); font-weight:500; }
.form-input,.form-select,.form-textarea {
  padding:.46rem .72rem;
  background:var(--bg-raised); border:1px solid var(--border);
  border-radius:var(--radius); color:var(--text-primary); font-size:.88rem;
  width:100%; transition:border-color var(--transition),box-shadow var(--transition);
}
.form-input:focus,.form-select:focus,.form-textarea:focus {
  outline:none; border-color:var(--accent); box-shadow:0 0 0 3px var(--accent-glow);
}
.form-input::placeholder { color:var(--text-muted); }
.form-color { padding:.2rem; height:2.1rem; cursor:pointer; }
.form-textarea { resize:vertical; min-height:72px; }
.form-hint { font-size:.73rem; color:var(--text-muted); }
.form-actions { display:flex; gap:.55rem; align-items:center; margin-top:1.15rem; flex-wrap:wrap; }
.checkbox-label { display:flex; align-items:center; gap:.45rem; cursor:pointer; font-size:.855rem; }
.checkbox-group { display:flex; flex-wrap:wrap; gap:.55rem; }
.settings-section { margin-bottom:1.85rem; padding-bottom:1.35rem; border-bottom:1px solid var(--border); }
.settings-section h3 { font-size:.93rem; color:var(--gold); margin-bottom:.85rem; }
.form-select {
  appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%236b7280' stroke-width='1.5' stroke-linecap='round' fill='none'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right .55rem center; background-size:10px 6px; padding-right:1.85rem;
}
.form-inline { display:flex; gap:.7rem; align-items:flex-end; flex-wrap:wrap; }
.form-inline .form-group { flex:1; margin:0; }
.form-group label .req { color:var(--danger); margin-left:.2rem; }

/* ════════════════════════════════════════════════════════════════
   TABLES
   ════════════════════════════════════════════════════════════════ */
.table-scroll {
  overflow-x:auto; -webkit-overflow-scrolling:touch;
  border-radius:var(--radius-lg);
}
.arcane-table {
  width:100%; border-collapse:collapse; font-size:.86rem;
  background:var(--bg-surface); border-radius:var(--radius-lg); overflow:hidden; box-shadow:var(--shadow-sm);
}
.arcane-table thead tr { background:var(--bg-raised); border-bottom:2px solid var(--border); }
.arcane-table th { padding:.7rem .95rem; text-align:left; font-family:var(--font-heading); font-size:.7rem; text-transform:uppercase; letter-spacing:.08em; color:var(--text-muted); }
.arcane-table td { padding:.62rem .95rem; border-bottom:1px solid var(--border); }
.arcane-table tbody tr:hover { background:var(--bg-hover); }
.arcane-table tbody tr:last-child td { border-bottom:none; }
.table-actions { display:flex; gap:.3rem; align-items:center; }

/* ════════════════════════════════════════════════════════════════
   BADGES
   ════════════════════════════════════════════════════════════════ */
.badge { display:inline-block; padding:.17rem .52rem; border-radius:20px; font-size:.7rem; font-weight:600; }
.badge-draft     { background:rgba(100,100,120,.2); color:#a0a0c0; border:1px solid rgba(100,100,120,.3); }
.badge-published { background:var(--success-bg); color:var(--success); border:1px solid rgba(34,197,94,.3); }
.badge-archived  { background:rgba(139,92,246,.15); color:#a78bfa; border:1px solid rgba(139,92,246,.3); }
.badge-planned   { background:rgba(59,130,246,.12); color:var(--info); border:1px solid rgba(59,130,246,.25); }
.badge-ongoing   { background:rgba(245,158,11,.12); color:var(--warning); border:1px solid rgba(245,158,11,.25); }
.badge-completed { background:var(--success-bg); color:var(--success); border:1px solid rgba(34,197,94,.3); }
.badge-cancelled { background:var(--danger-bg); color:var(--danger); border:1px solid rgba(239,68,68,.25); }

/* ════════════════════════════════════════════════════════════════
   COURS — liste
   ════════════════════════════════════════════════════════════════ */
.courses-list { display:flex; flex-direction:column; }
.course-row {
  display:flex; align-items:center; gap:.7rem;
  padding:.58rem .85rem;
  background:var(--bg-surface); border-bottom:1px solid var(--border);
  transition:background var(--transition); position:relative;
}
.course-row:first-child { border-radius:var(--radius-lg) var(--radius-lg) 0 0; }
.course-row:last-child  { border-radius:0 0 var(--radius-lg) var(--radius-lg); border-bottom:none; }
.course-row:only-child  { border-radius:var(--radius-lg); }
.course-row:hover { background:var(--bg-hover); }
.cr-color-bar { width:3px; height:34px; border-radius:3px; flex-shrink:0; }
.cr-icon { font-size:1.15rem; flex-shrink:0; }
.cr-main { flex:1; overflow:hidden; }
.cr-title { font-weight:600; font-size:.88rem; color:var(--text-primary); }
.cr-title:hover { color:var(--accent-2); }
.cr-meta { font-size:.73rem; color:var(--text-muted); display:flex; flex-wrap:wrap; gap:.28rem; align-items:center; }
.cr-sep { opacity:.4; }
.cr-time { display:flex; align-items:center; gap:.28rem; font-family:monospace; font-size:.8rem; flex-shrink:0; }
.cr-start { color:var(--text-primary); font-weight:600; }
.cr-arrow { color:var(--text-muted); }
.cr-end   { color:var(--text-secondary); }
.cr-dur   { font-size:.7rem; color:var(--text-muted); }
.cr-actions { display:flex; gap:.28rem; flex-shrink:0; }
.course-ongoing { border-color:var(--warning); background:var(--warning-bg); }

/* ════════════════════════════════════════════════════════════════
   COURS — détail
   ════════════════════════════════════════════════════════════════ */
.course-detail-header { background:var(--bg-surface); border-radius:var(--radius-lg); padding:1.2rem; margin-bottom:.9rem; border-left:4px solid var(--border); }
.cdh-top { display:flex; align-items:center; gap:.7rem; margin-bottom:.7rem; }
.cdh-icon { font-size:1.9rem; }
.cdh-subject { font-size:.78rem; font-weight:600; letter-spacing:.04em; margin-bottom:.18rem; }
.cdh-title { font-size:1.15rem; }
.cdh-chips { display:flex; flex-wrap:wrap; gap:.45rem; }

/* ════════════════════════════════════════════════════════════════
   SUPPORTS
   ════════════════════════════════════════════════════════════════ */
.materials-list { display:flex; flex-direction:column; gap:.35rem; }
.material-item {
  display:flex; align-items:center; justify-content:space-between; gap:.9rem;
  padding:.6rem .95rem; background:var(--bg-surface); border:1px solid var(--border);
  border-radius:var(--radius); transition:all var(--transition);
}
.material-item:hover { background:var(--bg-hover); border-color:var(--accent); }
.mi-info { display:flex; align-items:center; gap:.7rem; flex:1; flex-wrap:wrap; }
.mi-actions { display:flex; gap:.3rem; }
.material-meta { display:flex; align-items:center; gap:.7rem; flex-wrap:wrap; margin-bottom:.85rem; padding-bottom:.85rem; border-bottom:1px solid var(--border); }
.material-actions { margin-left:auto; display:flex; gap:.45rem; }
.material-content { max-width:840px; font-family:var(--font-body); font-size:1.08rem; line-height:1.75; }
.material-content h1,.material-content h2,.material-content h3 { font-family:var(--font-heading); color:var(--gold); margin:1.1em 0 .5em; }
.material-content p { margin-bottom:.82em; }
.material-content table { border-collapse:collapse; width:100%; margin:1em 0; }
.material-content td,.material-content th { border:1px solid var(--border); padding:.48em .72em; }
.material-content code { background:var(--bg-raised); padding:.1em .38em; border-radius:4px; font-size:.88em; }
.section-title { font-family:var(--font-heading); color:var(--gold); font-size:.93rem; margin:1rem 0 .65rem; }

/* ════════════════════════════════════════════════════════════════
   CHIPS & CARDS
   ════════════════════════════════════════════════════════════════ */
.chip {
  display:inline-flex; align-items:center; gap:.22rem;
  font-size:.76rem; padding:.18rem .52rem;
  background:var(--bg-raised); border:1px solid var(--border);
  border-radius:20px; color:var(--text-secondary);
}
.role-chip { display:inline-flex; align-items:center; padding:.17rem .58rem; border-radius:20px; font-size:.78rem; font-weight:600; }

/* ════════════════════════════════════════════════════════════════
   DASHBOARD
   ════════════════════════════════════════════════════════════════ */
.stats-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(148px,1fr)); gap:.85rem; margin-bottom:1.15rem; }
.stat-card {
  background:var(--bg-surface); border:1px solid var(--border); border-radius:var(--radius-lg);
  padding:1.05rem; text-align:center;
  transition:transform var(--transition),box-shadow var(--transition),border-color var(--transition);
}
.stat-card:hover { transform:translateY(-2px); box-shadow:var(--shadow-sm); border-color:rgba(139,92,246,.25); }
.stat-icon { font-size:1.55rem; margin-bottom:.38rem; }
.stat-val  { font-size:1.75rem; font-weight:700; font-family:var(--font-heading); color:var(--gold); }
.stat-label{ font-size:.73rem; color:var(--text-muted); margin-top:.12rem; }
.stat-sub  { font-size:.68rem; color:var(--text-muted); }
.dashboard-row { display:grid; grid-template-columns:1fr 1fr; gap:1rem; margin-bottom:1rem; }
.dashboard-row-single { grid-template-columns:1fr !important; }
.dashboard-card { background:var(--bg-surface); border:1px solid var(--border); border-radius:var(--radius-lg); padding:1.05rem; }
.chart-card { min-height:255px; }
.card-title { font-size:.88rem; color:var(--gold); margin-bottom:.8rem; font-family:var(--font-heading); }
.course-ongoing { border-color:var(--warning); background:var(--warning-bg); }
.progress-bar { flex:1; height:7px; background:var(--bg-raised); border-radius:4px; overflow:hidden; }
.progress-fill { height:100%; border-radius:4px; transition:width .5s; }
.log-item { display:flex; gap:.45rem; align-items:center; padding:.35rem 0; border-bottom:1px solid var(--border); font-size:.78rem; }
.log-item:last-child { border-bottom:none; }
.log-action { padding:.08rem .35rem; border-radius:4px; font-size:.68rem; font-weight:600; background:var(--bg-raised); }
.log-created { color:var(--success); } .log-updated { color:var(--info); }
.log-deleted { color:var(--danger); } .log-login { color:var(--accent-2); }
.log-logout  { color:var(--text-muted); } .log-register { color:var(--gold); }
.log-entity { flex:1; color:var(--text-secondary); }
.log-user,.log-time { color:var(--text-muted); }
.subject-hours-list { display:flex; flex-direction:column; gap:.6rem; }
.sh-row { display:flex; align-items:center; gap:.6rem; }
.sh-name { min-width:130px; font-size:.855rem; font-weight:500; }
.sh-val  { font-size:.76rem; color:var(--text-muted); min-width:105px; text-align:right; }

/* ════════════════════════════════════════════════════════════════
   CARD GRILLES
   ════════════════════════════════════════════════════════════════ */
.card-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(255px,1fr)); gap:1rem; }
.subject-card {
  background:var(--bg-surface); border:1px solid var(--border);
  border-radius:var(--radius-lg); padding:1.05rem;
  transition:transform var(--transition),box-shadow var(--transition),border-color var(--transition);
}
.subject-card:hover { transform:translateY(-2px); box-shadow:var(--shadow-sm); border-color:rgba(139,92,246,.2); }
.sc-icon { font-size:1.75rem; margin-bottom:.38rem; }
.sc-years { display:flex; flex-wrap:wrap; gap:.32rem; margin:.38rem 0; }
.sc-footer { display:flex; gap:.38rem; align-items:center; margin-top:auto; }
.room-card { background:var(--bg-surface); border:1px solid var(--border); border-radius:var(--radius-lg); padding:1.05rem; text-align:center; transition:all var(--transition); }
.room-card:hover { border-color:rgba(139,92,246,.2); }
.room-card.inactive { opacity:.55; }
.rc-icon { font-size:1.75rem; margin-bottom:.38rem; }
.rc-actions { display:flex; justify-content:center; gap:.38rem; margin-top:.85rem; }
.role-card { background:var(--bg-surface); border:1px solid var(--border); border-radius:var(--radius-lg); padding:1.05rem; transition:all var(--transition); }
.role-card:hover { border-color:rgba(139,92,246,.2); }
.rc-header { display:flex; align-items:center; gap:.38rem; margin-bottom:.38rem; }
.perm-list { display:flex; flex-wrap:wrap; gap:.32rem; margin:.6rem 0; }
.perm-chip { font-size:.68rem; padding:.1rem .42rem; background:var(--bg-raised); border:1px solid var(--border-light); border-radius:12px; color:var(--text-muted); }
.role-actions { display:flex; gap:.38rem; margin-top:.85rem; }
.perm-group { margin-bottom:.8rem; }
.perm-group-title { display:block; font-size:.7rem; color:var(--text-muted); margin-bottom:.32rem; text-transform:uppercase; letter-spacing:.08em; }
.admin-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(215px,1fr)); gap:.85rem; }
.admin-card {
  background:var(--bg-surface); border:1px solid var(--border);
  border-radius:var(--radius-lg); padding:1.3rem; text-align:center;
  transition:all var(--transition); display:block; color:var(--text-primary);
}
.admin-card:hover { background:var(--bg-hover); border-color:var(--accent); transform:translateY(-2px); box-shadow:var(--shadow-glow); color:var(--text-primary); }
.admin-card-icon { font-size:1.75rem; display:block; margin-bottom:.6rem; }
.admin-card h3 { font-size:.93rem; margin-bottom:.28rem; color:var(--gold); }
.admin-card p { font-size:.8rem; color:var(--text-muted); }

/* ════════════════════════════════════════════════════════════════
   ÉDITEUR
   ════════════════════════════════════════════════════════════════ */
.editor-layout { display:flex; height:calc(100vh - var(--topbar-h) - 2.2rem); margin:-1.1rem; }
.editor-sidebar { width:265px; background:var(--bg-surface); border-right:1px solid var(--border); padding:.95rem; overflow-y:auto; display:flex; flex-direction:column; gap:.6rem; flex-shrink:0; }
.editor-main { flex:1; display:flex; flex-direction:column; }
.editor-toolbar { padding:.55rem .95rem; background:var(--bg-surface); border-bottom:1px solid var(--border); display:flex; align-items:center; gap:.6rem; }
.editor-shortcut { font-size:.7rem; color:var(--text-muted); }
.editor-save-status { font-size:.76rem; padding:.32rem .52rem; border-radius:var(--radius); background:var(--bg-raised); color:var(--text-muted); text-align:center; }
.editor-save-status.saving { color:var(--warning); } .editor-save-status.saved { color:var(--success); } .editor-save-status.error { color:var(--danger); }
.editor-info { font-size:.73rem; color:var(--text-muted); line-height:1.5; }
.editor-actions { display:flex; flex-direction:column; gap:.38rem; }
.divider { border:none; border-top:1px solid var(--border); }
.subject-preview { display:flex; align-items:center; gap:.48rem; margin-top:.42rem; padding:.42rem .62rem; background:var(--bg-raised); border:1px solid var(--border); border-radius:var(--radius); font-size:.855rem; animation:slideDown .2s ease; }
.time-summary { display:flex; align-items:center; gap:.38rem; padding:.42rem .62rem; background:var(--accent-glow); border:1px solid rgba(139,92,246,.3); border-radius:var(--radius); font-family:monospace; font-size:.855rem; margin-bottom:.38rem; }

/* ════════════════════════════════════════════════════════════════
   LOGIN
   ════════════════════════════════════════════════════════════════ */
.login-page { display:flex; align-items:center; justify-content:center; min-height:100vh; background:var(--bg-base); background-image:radial-gradient(ellipse 60% 50% at 50% 0%,rgba(139,92,246,.12),transparent); }
.login-container { width:100%; max-width:400px; padding:1rem; }
.login-card { background:var(--bg-surface); border:1px solid var(--border); border-radius:var(--radius-xl); padding:2.35rem; text-align:center; box-shadow:var(--shadow),var(--shadow-glow); }
.login-ornament { font-size:.82rem; color:var(--gold); letter-spacing:.3em; margin:.6rem 0; }
.login-title { font-size:1.5rem; color:var(--gold); margin-bottom:.18rem; }
.login-subtitle { font-size:.855rem; color:var(--text-muted); margin-bottom:1.2rem; font-style:italic; }
.login-desc { font-size:.855rem; color:var(--text-secondary); margin-bottom:1.3rem; }
.login-logo { max-height:70px; margin-bottom:.85rem; }

/* ════════════════════════════════════════════════════════════════
   PLANNING — liste chronologique
   ════════════════════════════════════════════════════════════════ */
.planning-header { display:flex; align-items:center; justify-content:space-between; margin-bottom:.8rem; }
.planning-count { font-family:var(--font-heading); color:var(--gold); font-size:.95rem; }
.planning-list { display:flex; flex-direction:column; }
.time-slot-header {
  display:flex; align-items:center; gap:.6rem; padding:.45rem .85rem;
  background:var(--bg-raised); border-top:1px solid var(--border); border-bottom:1px solid var(--border);
  margin-top:.38rem; position:sticky; top:var(--topbar-h); z-index:10;
}
.time-slot-header:first-child { margin-top:0; }
.time-slot-time { font-family:var(--font-heading); font-size:.93rem; color:var(--gold); font-weight:600; }
.time-slot-count { font-size:.73rem; color:var(--text-muted); background:var(--bg-surface); padding:.08rem .42rem; border-radius:20px; border:1px solid var(--border); }
.planning-item { display:flex; align-items:center; gap:.85rem; padding:.55rem .85rem .55rem 1.05rem; background:var(--bg-surface); border-bottom:1px solid var(--border); border-left:3px solid var(--border); transition:background var(--transition); flex-wrap:wrap; }
.planning-item:hover { background:var(--bg-hover); }
.pi-id { display:flex; align-items:center; gap:.32rem; min-width:78px; }
.pi-num { font-family:monospace; font-size:.73rem; color:var(--text-muted); }
.pi-time { display:flex; align-items:center; gap:.28rem; font-family:monospace; font-size:.855rem; min-width:140px; }
.pi-start { color:var(--text-primary); font-weight:600; }
.pi-arrow { color:var(--text-muted); }
.pi-end   { color:var(--text-secondary); }
.pi-duration { font-size:.7rem; color:var(--text-muted); }
.pi-subject { display:flex; align-items:center; gap:.32rem; flex:1; min-width:175px; }
.pi-subject-icon { font-size:.95rem; }
.pi-subject-name { font-size:.76rem; font-weight:600; }
.pi-title a { color:var(--text-primary); font-weight:500; }
.pi-title a:hover { color:var(--accent-2); }
.pi-meta { display:flex; align-items:center; gap:.6rem; font-size:.76rem; color:var(--text-muted); flex-wrap:wrap; }
.pi-actions { display:flex; gap:.3rem; margin-left:auto; }

/* ════════════════════════════════════════════════════════════════
   MATRICES
   ════════════════════════════════════════════════════════════════ */
.matrix-summary { display:flex; flex-wrap:wrap; gap:.42rem; margin-bottom:1rem; padding:.6rem .85rem; background:var(--bg-surface); border:1px solid var(--border); border-radius:var(--radius-lg); }
.ms-chip { display:flex; align-items:center; gap:.32rem; padding:.22rem .58rem; border:1.5px solid var(--border); border-radius:20px; font-size:.78rem; background:var(--bg-raised); }
.ms-count { display:inline-block; padding:.06rem .42rem; border-radius:20px; color:#fff; font-weight:700; font-size:.7rem; }
.ms-total { border-color:var(--accent); font-weight:700; }
.course-matrix-grid,.materials-matrix-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(208px,1fr)); gap:.85rem; align-items:start; }
.cmg-column,.mmg-column { background:var(--bg-surface); border:1px solid var(--border); border-radius:var(--radius-lg); overflow:hidden; transition:border-color var(--transition); }
.cmg-column:hover,.mmg-column:hover { border-color:rgba(139,92,246,.2); }
.cmg-header,.mmg-header { padding:.62rem .85rem; display:flex; align-items:center; gap:.42rem; border-bottom:2px solid var(--border); }
.cmg-icon,.mmg-icon { font-size:1.05rem; }
.cmg-subname,.mmg-name { font-weight:600; font-size:.83rem; flex:1; font-family:var(--font-heading); }
.cmg-badge,.mmg-count { padding:.1rem .48rem; border-radius:20px; color:#fff; font-weight:700; font-size:.7rem; flex-shrink:0; }
.cmg-body,.mmg-body { display:flex; flex-direction:column; max-height:475px; overflow-y:auto; }
.cmg-empty,.mmg-empty { padding:.85rem; text-align:center; color:var(--text-muted); font-size:.8rem; font-style:italic; }
.cmg-item { display:flex; flex-direction:column; gap:.1rem; padding:.52rem .82rem; border-bottom:1px solid var(--border); text-decoration:none; color:var(--text-primary); transition:background var(--transition); font-size:.8rem; }
.cmg-item:hover { background:var(--bg-hover); }
.cmg-item:last-child { border-bottom:none; }
.cmg-item-time { font-family:monospace; font-size:.7rem; color:var(--text-muted); }
.cmg-item-title { font-weight:500; line-height:1.3; }
.cmg-item-meta { font-size:.7rem; color:var(--text-muted); }
.mmg-item { display:flex; align-items:center; gap:.42rem; padding:.48rem .82rem; border-bottom:1px solid var(--border); text-decoration:none; color:var(--text-primary); transition:background var(--transition); font-size:.8rem; }
.mmg-item:hover { background:var(--bg-hover); }
.mmg-item:last-of-type { border-bottom:none; }
.mmg-item-status { width:7px; height:7px; border-radius:50%; flex-shrink:0; }
.mmg-item.status-published .mmg-item-status,.badge-published.mmg-item-status { background:var(--success); }
.mmg-item.status-draft .mmg-item-status { background:var(--text-muted); }
.mmg-item-title { flex:1; line-height:1.3; }
.mmg-item-year { font-size:.68rem; color:var(--text-muted); flex-shrink:0; }
.mmg-add { display:block; padding:.35rem .82rem; color:var(--accent); font-size:.76rem; text-decoration:none; text-align:center; border-top:1px dashed var(--border-light); transition:background var(--transition); }
.mmg-add:hover { background:var(--accent-glow); }
.view-switcher { display:flex; gap:.2rem; }
.view-btn { padding:.28rem .52rem; background:var(--bg-raised); border:1px solid var(--border); border-radius:var(--radius); color:var(--text-muted); font-size:.9rem; text-decoration:none; transition:all var(--transition); }
.view-btn:hover { background:var(--bg-hover); color:var(--text-primary); }
.view-btn.active { background:var(--accent-glow); border-color:var(--accent); color:var(--accent-2); }

/* ════════════════════════════════════════════════════════════════
   TIMETABLE
   ════════════════════════════════════════════════════════════════ */
.tt-legend { display:flex; flex-wrap:wrap; gap:.42rem; margin-bottom:.85rem; font-size:.76rem; }
.tt-legend-item { display:flex; align-items:center; gap:.28rem; }
.tt-legend-dot { width:8px; height:8px; border-radius:50%; flex-shrink:0; }
.timetable-wrapper { overflow-x:auto; border:1px solid var(--border); border-radius:var(--radius-lg); background:var(--bg-surface); box-shadow:var(--shadow-sm); position:relative; }
.timetable { position:relative; min-width:calc(var(--label-w) + var(--total-w)); }
.tt-header { display:flex; position:sticky; top:0; z-index:30; background:var(--bg-raised); border-bottom:2px solid var(--border); }
.tt-corner { width:var(--label-w); flex-shrink:0; background:var(--bg-raised); }
.tt-time-axis { position:relative; height:var(--header-h); flex-shrink:0; }
.tt-hour-label { position:absolute; top:0; bottom:0; display:flex; align-items:center; font-family:monospace; font-size:.7rem; color:var(--text-muted); padding-left:4px; border-left:1px solid var(--border); }
.tt-grid-line,.tt-bg-line { position:absolute; top:0; bottom:0; width:1px; pointer-events:none; }
.tt-grid-line.major,.tt-bg-line.major { background:var(--border); }
.tt-grid-line.minor,.tt-bg-line.minor { width:0; border-left:1px dashed var(--border); opacity:.45; }
.tt-body { display:flex; flex-direction:column; }
.tt-row { display:flex; border-bottom:1px solid var(--border); min-height:var(--row-h); }
.tt-row:last-child { border-bottom:none; }
.tt-room-label { width:var(--label-w); flex-shrink:0; display:flex; align-items:center; justify-content:space-between; padding:0 .7rem; font-size:.8rem; font-weight:500; background:var(--bg-raised); border-right:2px solid var(--border); position:sticky; left:0; z-index:20; }
.tt-room-count { background:var(--accent); color:#fff; border-radius:20px; padding:.03rem .36rem; font-size:.68rem; font-weight:700; }
.tt-row-track { position:relative; height:var(--row-h); flex-shrink:0; }
.tt-course { position:absolute; top:4px; bottom:4px; border:2px solid; border-radius:6px; display:flex; align-items:center; gap:3px; padding:0 5px; text-decoration:none; overflow:hidden; white-space:nowrap; font-size:.73rem; font-weight:500; cursor:pointer; z-index:10; transition:filter var(--transition),transform var(--transition),box-shadow var(--transition); }
.tt-course:hover { filter:brightness(1.2); transform:translateY(-1px); z-index:15; box-shadow:0 4px 12px rgba(0,0,0,.35); }
.tc-icon { font-size:.93rem; flex-shrink:0; }
.tc-title { overflow:hidden; text-overflow:ellipsis; flex:1; }
.tc-time { font-size:.66rem; opacity:.8; flex-shrink:0; }
.tt-add-hint { position:absolute; inset:0; cursor:crosshair; z-index:1; }
.tt-now-line { position:absolute; top:0; bottom:0; width:2px; background:var(--danger); z-index:25; pointer-events:none; }
.tt-now-label { position:absolute; top:2px; left:3px; font-size:.6rem; color:var(--danger); font-family:monospace; white-space:nowrap; background:var(--bg-surface); padding:0 2px; border-radius:2px; }

/* ════════════════════════════════════════════════════════════════
   ALERTES & TOASTS
   ════════════════════════════════════════════════════════════════ */
#room-alert-container { position:fixed; top:1rem; right:1rem; z-index:9999; display:flex; flex-direction:column; gap:.42rem; }
.room-alert { background:var(--bg-surface); border:2px solid var(--warning); border-radius:var(--radius-lg); padding:.85rem 1.05rem; max-width:330px; box-shadow:var(--shadow); animation:slideDown .32s ease; }
.room-alert-title { font-family:var(--font-heading); color:var(--warning); margin-bottom:.32rem; font-size:.88rem; }
.room-alert-body { font-size:.838rem; margin-bottom:.55rem; }
.room-alert-close { float:right; background:none; border:none; color:var(--text-muted); cursor:pointer; font-size:.93rem; padding:0; }
.buffer-alert { display:flex; gap:.85rem; padding:1.05rem; background:var(--warning-bg); border:2px solid var(--warning); border-radius:var(--radius-lg); margin:1rem 0; }
.ba-icon { font-size:1.75rem; flex-shrink:0; }
.ba-body { flex:1; }
.ba-body strong { font-size:.93rem; color:var(--warning); font-family:var(--font-heading); display:block; margin-bottom:.42rem; }
.ba-body p { font-size:.855rem; margin-bottom:.42rem; line-height:1.5; }
.ba-instruction { font-weight:600!important; }
.ba-confirm { display:flex!important; align-items:flex-start; gap:.52rem; background:var(--bg-raised); padding:.62rem; border-radius:var(--radius); border:1px solid rgba(245,158,11,.4); margin-top:.62rem; font-size:.855rem; cursor:pointer; }

/* ════════════════════════════════════════════════════════════════
   PAGINATION
   ════════════════════════════════════════════════════════════════ */
.pagination { display:flex; gap:.32rem; justify-content:center; margin-top:1.15rem; flex-wrap:wrap; }
.page-btn { padding:.32rem .68rem; background:var(--bg-surface); border:1px solid var(--border); border-radius:var(--radius); color:var(--text-secondary); font-size:.8rem; transition:all var(--transition); }
.page-btn:hover { background:var(--bg-hover); color:var(--text-primary); }
.page-btn.active { background:linear-gradient(135deg,var(--accent),#7c3aed); color:#fff; border-color:var(--accent); }

/* ════════════════════════════════════════════════════════════════
   FILTRES
   ════════════════════════════════════════════════════════════════ */
.filters-bar { display:flex; gap:.55rem; align-items:center; flex-wrap:wrap; margin-bottom:1rem; padding:.6rem .85rem; background:var(--bg-surface); border:1px solid var(--border); border-radius:var(--radius-lg); }
.filters-bar .form-select,.filters-bar .form-input { width:auto; }

/* ════════════════════════════════════════════════════════════════
   UTILITAIRES
   ════════════════════════════════════════════════════════════════ */
.empty-state-block { text-align:center; padding:2.75rem 1rem; color:var(--text-muted); }
.empty-icon { font-size:2.7rem; display:block; margin-bottom:.6rem; }
.empty-state { color:var(--text-muted); font-style:italic; font-size:.855rem; }
.error-page { text-align:center; padding:4rem 1rem; }
.error-code { font-size:5rem; font-family:var(--font-heading); color:var(--gold); }
.error-msg { font-size:1.03rem; color:var(--text-secondary); margin:1rem 0 1.85rem; }
.text-center { text-align:center; }
.text-muted  { color:var(--text-muted); }
.mt-2 { margin-top:.75rem; }
.mt-4 { margin-top:1.5rem; }
.mb-3 { margin-bottom:1rem; }
.mono { font-family:monospace; }

/* ════════════════════════════════════════════════════════════════
   SECTIONS DE FORMULAIRE (form-section)
   ════════════════════════════════════════════════════════════════ */
.form-card { background:var(--bg-surface); border:1px solid var(--border); border-radius:var(--radius-lg); padding:1.45rem; margin-bottom:1.15rem; }
.form-card-title { font-family:var(--font-heading); font-size:.88rem; color:var(--gold); margin-bottom:.95rem; padding-bottom:.48rem; border-bottom:1px solid var(--border); }
.page-header-block { display:flex; align-items:center; justify-content:space-between; margin-bottom:1.15rem; flex-wrap:wrap; gap:.7rem; }
.phb-title { font-family:var(--font-heading); font-size:1.08rem; color:var(--gold); }
.phb-actions { display:flex; gap:.45rem; }
.info-box { padding:.72rem .95rem; background:var(--accent-glow); border:1px solid var(--accent); border-radius:var(--radius); font-size:.838rem; color:var(--text-secondary); margin-bottom:.95rem; }
.info-box.warning { background:var(--warning-bg); border-color:var(--warning); color:var(--text-primary); }
.info-box.success { background:var(--success-bg); border-color:var(--success); color:var(--text-primary); }
.info-box.danger  { background:var(--danger-bg);  border-color:var(--danger);  color:var(--text-primary); }
.section-sep { border:none; border-top:1px solid var(--border); margin:1.45rem 0; }
.loading-overlay { position:fixed; inset:0; background:rgba(0,0,0,.45); display:none; align-items:center; justify-content:center; z-index:9999; }
.loading-spinner { width:38px; height:38px; border:3px solid var(--border); border-top-color:var(--accent); border-radius:50%; animation:spin .65s linear infinite; }
@keyframes spin { to { transform:rotate(360deg); } }
.toast-container { position:fixed; bottom:1.15rem; right:1.15rem; display:flex; flex-direction:column; gap:.45rem; z-index:9998; }
.toast { padding:.68rem .95rem; background:var(--bg-surface); border:1px solid var(--border); border-radius:var(--radius-lg); box-shadow:var(--shadow-sm); font-size:.838rem; animation:slideUp .22s ease; max-width:310px; }
@keyframes slideUp { from{transform:translateY(8px);opacity:0} to{transform:none;opacity:1} }

/* ════════════════════════════════════════════════════════════════
   RESOURCE LIST (liste générique : salles, années…)
   ════════════════════════════════════════════════════════════════ */
.resource-list { display:flex; flex-direction:column; background:var(--bg-surface); border:1px solid var(--border); border-radius:var(--radius-lg); overflow:hidden; }
.resource-row { display:flex; align-items:center; gap:.85rem; padding:.65rem 1rem; border-bottom:1px solid var(--border); transition:background var(--transition); }
.resource-row:last-child { border-bottom:none; }
.resource-row:hover { background:var(--bg-hover); }
.resource-inactive { opacity:.65; }
.resource-icon { font-size:1.25rem; flex-shrink:0; width:2rem; text-align:center; }
.resource-name { flex:1; display:flex; align-items:center; gap:.55rem; min-width:0; flex-wrap:wrap; }
.resource-title { font-weight:600; font-size:.9rem; color:var(--text-primary); }
.resource-inactive-tag { font-size:.7rem; color:var(--text-muted); font-style:italic; }
.resource-badge { flex-shrink:0; width:80px; }
.resource-actions { display:flex; align-items:center; gap:.35rem; flex-shrink:0; }

.form-page-header { display:flex; align-items:center; gap:.95rem; margin-bottom:1.35rem; }
.fph-icon { width:46px; height:46px; display:flex; align-items:center; justify-content:center; font-size:1.45rem; background:var(--accent-glow); border:1px solid var(--accent); border-radius:var(--radius-lg); flex-shrink:0; }
.fph-title { font-family:var(--font-heading); font-size:1.1rem; color:var(--gold); line-height:1.2; }
.fph-sub { font-size:.78rem; color:var(--text-muted); margin-top:.18rem; font-style:italic; }
.form-section { background:var(--bg-surface); border:1px solid var(--border); border-radius:var(--radius-lg); overflow:hidden; margin-bottom:.95rem; }
.form-section-header { display:flex; align-items:center; gap:.48rem; padding:.62rem 1.2rem; background:var(--bg-raised); border-bottom:1px solid var(--border); font-family:var(--font-heading); font-size:.67rem; text-transform:uppercase; letter-spacing:.1em; color:var(--text-muted); }
.form-section-body { padding:1.2rem; }
.form-section-body .form-grid { gap:.95rem; }
.form-footer { display:flex; align-items:center; gap:.55rem; }

/* ════════════════════════════════════════════════════════════════
   STATS CHARTS & MATRICES
   ════════════════════════════════════════════════════════════════ */
.stats-chart-wrapper { position:relative; height:215px; margin-bottom:.48rem; }
.stats-matrix-wrap { overflow-x:auto; margin-top:.95rem; }
.stats-matrix { width:100%; border-collapse:collapse; font-size:.8rem; }
.stats-matrix th { padding:.42rem .62rem; background:var(--bg-raised); border-bottom:2px solid var(--border); font-family:var(--font-heading); font-size:.66rem; text-transform:uppercase; letter-spacing:.06em; color:var(--text-muted); white-space:nowrap; }
.stats-matrix th.text-center { text-align:center; }
.stats-matrix td { padding:.42rem .62rem; border-bottom:1px solid var(--border); white-space:nowrap; }
.stats-matrix td.text-center { text-align:center; }
.stats-matrix tbody tr:last-child td { border-bottom:none; }
.stats-matrix tbody tr:hover td { background:var(--bg-hover); }
.stats-matrix .sm-total { font-weight:700; color:var(--gold); text-align:center; }
.stats-matrix .sm-zero { color:var(--text-muted); }
.stats-summary-row { display:flex; flex-wrap:wrap; gap:.48rem; margin-bottom:.95rem; }
.stats-pill { display:flex; align-items:center; gap:.32rem; padding:.22rem .68rem; background:var(--bg-raised); border:1px solid var(--border); border-radius:20px; font-size:.78rem; }
.stats-pill-val { font-weight:700; font-family:var(--font-heading); }

/* ════════════════════════════════════════════════════════════════
   PROFIL
   ════════════════════════════════════════════════════════════════ */
.profile-page { max-width:720px; display:flex; flex-direction:column; gap:.95rem; }
.profile-identity { display:flex; align-items:center; gap:.95rem; background:var(--bg-surface); border:1px solid var(--border); border-radius:var(--radius-lg); padding:1.2rem; }
.pi-avatar { flex-shrink:0; }
.pi-avatar img { width:70px; height:70px; border-radius:50%; border:2px solid var(--accent); box-shadow:0 0 12px var(--accent-glow); }
.pi-avatar-placeholder { width:70px; height:70px; border-radius:50%; background:var(--accent-glow); border:2px solid var(--accent); display:flex; align-items:center; justify-content:center; font-size:1.75rem; font-weight:700; color:var(--accent-2); }
.pi-details { flex:1; display:flex; flex-direction:column; gap:.32rem; }
.pi-name { font-size:1.22rem; color:var(--gold); }
.pi-last-login { font-size:.73rem; color:var(--text-muted); margin-top:.12rem; }
.profile-stats-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(128px,1fr)); gap:.72rem; }
.pstat-card { background:var(--bg-raised); border:1px solid var(--border); border-radius:var(--radius-lg); padding:.88rem; text-align:center; transition:border-color var(--transition); }
.pstat-card:hover { border-color:rgba(139,92,246,.25); }
.pstat-val { font-size:1.48rem; font-weight:700; font-family:var(--font-heading); color:var(--gold); }
.pstat-label { font-size:.73rem; color:var(--text-muted); margin-top:.18rem; line-height:1.3; }
.profile-activity { display:flex; flex-direction:column; }
.activity-item { display:flex; align-items:center; gap:.55rem; padding:.48rem 1.2rem; border-bottom:1px solid var(--border); font-size:.78rem; }
.activity-item:last-child { border-bottom:none; }
.activity-entity { flex:1; color:var(--text-secondary); }
.activity-time { color:var(--text-muted); font-family:monospace; font-size:.73rem; }

/* ════════════════════════════════════════════════════════════════
   MATRIX SUMMARY BAR (planning/matrix)
   ════════════════════════════════════════════════════════════════ */
.matrix-summary-bar {
  background:var(--bg-surface); border:1px solid var(--border);
  border-radius:var(--radius-lg); overflow:hidden; margin-bottom:1.1rem;
}
.msb-row {
  display:flex; align-items:center; padding:.48rem .95rem;
  border-bottom:1px solid var(--border); gap:.9rem;
}
.msb-row:last-child { border-bottom:none; }
.msb-header { background:var(--bg-raised); }
.msb-header .msb-label {
  font-size:.67rem; text-transform:uppercase; letter-spacing:.09em;
  color:var(--text-muted); font-family:var(--font-heading); font-weight:600;
}
.msb-label { flex:1; font-size:.875rem; color:var(--text-secondary); }
.msb-count { display:flex; justify-content:flex-end; min-width:60px; }
.msb-badge {
  padding:.12rem .65rem; border-radius:20px; color:#fff;
  font-weight:700; font-size:.78rem; min-width:28px; text-align:center;
}
.msb-total { background:var(--bg-raised); font-weight:700; }
.msb-total .msb-label { color:var(--text-primary); font-weight:700; }

/* ════════════════════════════════════════════════════════════════
   PARCHEMIN SOMBRE — overrides composants
   ════════════════════════════════════════════════════════════════ */
/* Inputs */
[data-theme="parchment-dark"] .form-input,
[data-theme="parchment-dark"] .form-select,
[data-theme="parchment-dark"] .form-textarea {
  background:var(--bg-raised); color:var(--text-primary);
}
[data-theme="parchment-dark"] .form-input:focus,
[data-theme="parchment-dark"] .form-select:focus,
[data-theme="parchment-dark"] .form-textarea:focus {
  border-color:var(--accent); box-shadow:0 0 0 3px rgba(200,120,32,.18);
}
/* Boutons */
[data-theme="parchment-dark"] .btn-primary {
  background:linear-gradient(135deg, var(--accent), #9e5a14);
  border-color:var(--accent); box-shadow:0 2px 8px rgba(200,120,32,.32);
}
[data-theme="parchment-dark"] .btn-primary:hover {
  background:linear-gradient(135deg, var(--accent-2), var(--accent));
  box-shadow:0 4px 14px rgba(200,120,32,.48); color:#fff;
}
[data-theme="parchment-dark"] .btn-secondary {
  background:var(--bg-raised); color:var(--text-primary); border-color:var(--border-light);
}
[data-theme="parchment-dark"] .btn-secondary:hover {
  background:var(--bg-hover); border-color:var(--accent);
}
[data-theme="parchment-dark"] .btn-ghost { color:var(--text-secondary); }
/* Tables */
[data-theme="parchment-dark"] .arcane-table { background:var(--bg-surface); }
/* Topbar */
[data-theme="parchment-dark"] .topbar {
  box-shadow:0 1px 0 rgba(212,168,67,.14), var(--shadow-xs);
}
/* Ctx nav */
[data-theme="parchment-dark"] .ctx-nav-btn.active {
  background:rgba(200,120,32,.14); color:var(--accent-2); border:1px solid rgba(200,120,32,.3);
}
/* Pagination */
[data-theme="parchment-dark"] .page-btn.active {
  background:linear-gradient(135deg, var(--accent), #9e5a14); border-color:var(--accent);
}
/* Info box */
[data-theme="parchment-dark"] .info-box {
  background:rgba(200,120,32,.12); border-color:var(--accent);
}
/* Login */
[data-theme="parchment-dark"] .login-page {
  background-image:radial-gradient(ellipse 60% 50% at 50% 0%, rgba(200,120,32,.1), transparent);
}
[data-theme="parchment-dark"] .login-card {
  box-shadow:var(--shadow), 0 0 40px rgba(200,120,32,.12);
}
/* Stat cards */
[data-theme="parchment-dark"] .stat-card:hover {
  border-color:rgba(200,120,32,.28); box-shadow:var(--shadow-sm);
}
/* Admin cards */
[data-theme="parchment-dark"] .admin-card:hover {
  border-color:var(--accent); box-shadow:var(--shadow-glow);
}

/* ════════════════════════════════════════════════════════════════
   ██████████  POLISH GLOBAL CONTENU  ██████████
   Cartes · Tables · Forms · Topbar · Stats · Badges · etc.
   Compatible tous les 4 thèmes via variables CSS.
   ════════════════════════════════════════════════════════════════ */

/* ── Topbar — glass premium ─────────────────────────────────── */
.topbar {
  background:var(--bg-surface);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  border-bottom:1px solid var(--border);
  box-shadow:0 1px 0 var(--border), 0 4px 24px rgba(0,0,0,.08);
}
[data-theme="dark"] .topbar,
[data-theme="parchment-dark"] .topbar {
  background:rgba(15,15,30,.9);
}
[data-theme="dark"] .topbar { background:rgba(15,15,30,.92); }
[data-theme="parchment-dark"] .topbar { background:rgba(26,18,9,.92); }
[data-theme="light"] .topbar { background:rgba(255,255,255,.95); }
[data-theme="parchment"] .topbar { background:rgba(237,227,204,.95); }

/* ── Breadcrumbs raffinés ───────────────────────────────────── */
.breadcrumbs {
  background:var(--bg-raised);
  border-bottom:1px solid var(--border);
  font-size:.74rem;
  letter-spacing:.01em;
}
.breadcrumbs a:hover { color:var(--accent-2); text-decoration:underline; text-underline-offset:2px; }
.bc-sep { opacity:.35; font-size:.8rem; }

/* ── Flash messages — plus dramatiques ─────────────────────── */
.flash {
  border-radius:var(--radius);
  border-left-width:4px;
  font-weight:500;
  display:flex;
  align-items:center;
  gap:.55rem;
}
.flash::before {
  font-size:1rem;
  flex-shrink:0;
}
.flash-success::before { content:'✓'; }
.flash-error::before   { content:'✕'; }
.flash-warning::before { content:'⚠'; }
.flash-info::before    { content:'ℹ'; }

/* ── Cards — profondeur & lumière ──────────────────────────── */
.stat-card,
.dashboard-card,
.form-card,
.subject-card,
.room-card,
.role-card,
.admin-card {
  box-shadow:var(--shadow-xs), inset 0 1px 0 rgba(255,255,255,.05);
  border-width:1px;
  position:relative;
  overflow:hidden;
}
[data-theme="dark"] .stat-card,
[data-theme="dark"] .dashboard-card,
[data-theme="dark"] .form-card,
[data-theme="dark"] .subject-card,
[data-theme="dark"] .role-card,
[data-theme="dark"] .admin-card {
  background:linear-gradient(145deg, var(--bg-surface) 0%, var(--bg-raised) 100%);
}
[data-theme="parchment-dark"] .stat-card,
[data-theme="parchment-dark"] .dashboard-card,
[data-theme="parchment-dark"] .form-card,
[data-theme="parchment-dark"] .subject-card,
[data-theme="parchment-dark"] .role-card,
[data-theme="parchment-dark"] .admin-card {
  background:linear-gradient(145deg, var(--bg-surface) 0%, var(--bg-raised) 100%);
  box-shadow:var(--shadow-xs), inset 0 1px 0 rgba(212,168,67,.06);
}
[data-theme="parchment"] .stat-card,
[data-theme="parchment"] .dashboard-card,
[data-theme="parchment"] .form-card,
[data-theme="parchment"] .subject-card,
[data-theme="parchment"] .role-card,
[data-theme="parchment"] .admin-card {
  background:linear-gradient(145deg, var(--bg-surface) 0%, var(--bg-raised) 100%);
  box-shadow:0 1px 4px rgba(80,40,0,.1), inset 0 1px 0 rgba(255,255,220,.25);
}
[data-theme="light"] .stat-card,
[data-theme="light"] .dashboard-card,
[data-theme="light"] .form-card,
[data-theme="light"] .subject-card,
[data-theme="light"] .role-card,
[data-theme="light"] .admin-card {
  box-shadow:0 1px 8px rgba(100,80,200,.07), inset 0 1px 0 rgba(255,255,255,.8);
}

/* Coin brillant sur les cards — effet reflet */
.stat-card::before,
.dashboard-card::before,
.form-card::before {
  content:'';
  position:absolute;
  top:0; left:0; right:0;
  height:1px;
  background:linear-gradient(90deg, transparent, rgba(255,255,255,.12) 40%, rgba(255,255,255,.18) 50%, rgba(255,255,255,.12) 60%, transparent);
  pointer-events:none;
}
[data-theme="parchment"] .stat-card::before,
[data-theme="parchment"] .dashboard-card::before,
[data-theme="parchment"] .form-card::before {
  background:linear-gradient(90deg, transparent, rgba(255,240,180,.35) 40%, rgba(255,255,220,.5) 50%, rgba(255,240,180,.35) 60%, transparent);
}
[data-theme="light"] .stat-card::before,
[data-theme="light"] .dashboard-card::before,
[data-theme="light"] .form-card::before {
  background:linear-gradient(90deg, transparent, rgba(255,255,255,.7) 40%, rgba(255,255,255,.9) 50%, rgba(255,255,255,.7) 60%, transparent);
}

/* ── Stat cards — icône avec fond coloré ──────────────────── */
.stat-icon {
  width:44px; height:44px;
  display:flex; align-items:center; justify-content:center;
  background:var(--accent-glow);
  border:1px solid rgba(139,92,246,.2);
  border-radius:var(--radius-lg);
  font-size:1.35rem;
  margin-bottom:.5rem;
  transition:transform var(--transition);
}
.stat-card:hover .stat-icon { transform:scale(1.08); }
[data-theme="parchment"] .stat-icon,
[data-theme="parchment-dark"] .stat-icon {
  background:rgba(200,120,32,.1);
  border-color:rgba(212,168,67,.2);
}

/* ── Tables arcanes — style manuscrit enluminé ─────────────── */
.arcane-table {
  box-shadow:var(--shadow-sm);
}
.arcane-table thead tr {
  background:linear-gradient(180deg, var(--bg-raised) 0%, var(--bg-surface) 100%);
}
.arcane-table th {
  font-family:var(--font-heading);
  font-size:.68rem;
  text-transform:uppercase;
  letter-spacing:.1em;
  color:var(--gold);
  border-bottom:2px solid var(--border);
  padding:.75rem 1rem;
  white-space:nowrap;
}
.arcane-table td { padding:.68rem 1rem; }
.arcane-table tbody tr {
  transition:background var(--transition);
}
.arcane-table tbody tr:hover {
  background:var(--bg-hover);
}
.arcane-table tbody tr:hover td:first-child {
  border-left:2.5px solid var(--accent);
  padding-left:calc(1rem - 2.5px);
}

/* ── Form inputs — premium ──────────────────────────────────── */
.form-input,
.form-select,
.form-textarea {
  transition:border-color var(--transition), box-shadow var(--transition), background var(--transition);
}
.form-input:focus,
.form-select:focus,
.form-textarea:focus {
  border-color:var(--accent);
  box-shadow:0 0 0 3px var(--accent-glow), 0 1px 4px rgba(0,0,0,.12);
}
.form-group label {
  font-family:var(--font-heading);
  font-size:.72rem;
  text-transform:uppercase;
  letter-spacing:.08em;
  color:var(--text-muted);
}
.form-section-header {
  font-family:var(--font-heading);
  text-transform:uppercase;
  letter-spacing:.12em;
  font-size:.65rem;
  color:var(--gold);
  background:linear-gradient(180deg, var(--bg-raised) 0%, var(--bg-surface) 100%);
}

/* ── Form cards — ligne gauche accentuée ───────────────────── */
.form-card {
  border-left:3px solid var(--border);
}
.form-card:focus-within {
  border-left-color:var(--accent);
  box-shadow:var(--shadow-xs), inset 0 1px 0 rgba(255,255,255,.05), -2px 0 12px var(--accent-glow);
}
.form-card-title {
  font-family:var(--font-heading);
  font-size:.82rem;
  color:var(--gold);
  letter-spacing:.04em;
  border-bottom:1px solid var(--border);
  padding-bottom:.55rem;
  margin-bottom:1rem;
  display:flex;
  align-items:center;
  gap:.5rem;
}
.form-card-title::before {
  content:'';
  display:inline-block;
  width:4px; height:14px;
  background:linear-gradient(180deg, var(--gold), var(--accent));
  border-radius:2px;
  flex-shrink:0;
}

/* ── Page header — titre doré ───────────────────────────────── */
.phb-title {
  font-size:1.1rem;
  background:linear-gradient(135deg, var(--gold) 0%, var(--accent-2) 100%);
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  background-clip:text;
}
[data-theme="parchment"] .phb-title,
[data-theme="parchment-dark"] .phb-title {
  background:linear-gradient(135deg, var(--gold) 0%, var(--accent) 100%);
  -webkit-background-clip:text;
  background-clip:text;
}

/* ── Section title & card title ─────────────────────────────── */
.section-title,
.card-title {
  font-family:var(--font-heading);
  color:var(--gold);
  display:flex;
  align-items:center;
  gap:.48rem;
  font-size:.88rem;
  letter-spacing:.03em;
}
.section-title::after,
.card-title::after {
  content:'';
  flex:1;
  height:1px;
  background:linear-gradient(90deg, var(--border), transparent);
  margin-left:.35rem;
}

/* ── Badges — plus raffinés ─────────────────────────────────── */
.badge {
  font-family:var(--font-heading);
  letter-spacing:.04em;
  font-size:.68rem;
  font-weight:700;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08);
}

/* ── Chips — cohérentes ─────────────────────────────────────── */
.chip {
  font-family:var(--font-ui);
  font-size:.74rem;
  transition:border-color var(--transition), background var(--transition);
}
.chip:hover {
  border-color:var(--accent);
  background:var(--accent-glow);
}

/* ── Pagination — arcane ────────────────────────────────────── */
.page-btn {
  font-family:var(--font-heading);
  font-size:.75rem;
  letter-spacing:.04em;
  min-width:32px;
  text-align:center;
}

/* ── Filters bar — glass ────────────────────────────────────── */
.filters-bar {
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
  box-shadow:var(--shadow-xs);
}

/* ── Empty state ────────────────────────────────────────────── */
.empty-state-block {
  background:var(--bg-surface);
  border:1px dashed var(--border-light);
  border-radius:var(--radius-lg);
  padding:3rem 1rem;
}
.empty-icon {
  display:block;
  font-size:2.8rem;
  margin-bottom:.75rem;
  opacity:.5;
  filter:grayscale(.3);
}

/* ── Info box — plus théâtrale ──────────────────────────────── */
.info-box {
  display:flex;
  align-items:flex-start;
  gap:.6rem;
  padding:.75rem 1rem;
  border-left-width:3px;
  font-size:.845rem;
  line-height:1.55;
}

/* ── Course rows — barres colorées ─────────────────────────── */
.course-row {
  border-left:3px solid transparent;
  transition:background var(--transition), border-left-color var(--transition);
}
.course-row:hover { border-left-color:var(--accent); }

/* ── Planning items ─────────────────────────────────────────── */
.planning-item {
  transition:background var(--transition), border-left-color var(--transition);
}
.planning-item:hover { border-left-color:var(--accent); }

/* ── Dashboard card header ──────────────────────────────────── */
.dash-section-head,
.editor-toolbar {
  background:linear-gradient(180deg, var(--bg-raised) 0%, var(--bg-surface) 100%);
}

/* ── Admin cards — glow au hover ────────────────────────────── */
.admin-card:hover {
  border-color:var(--accent);
  transform:translateY(-3px);
  box-shadow:var(--shadow-glow), var(--shadow-sm);
}
.admin-card h3 {
  letter-spacing:.03em;
}

/* ── Subject/room cards ─────────────────────────────────────── */
.subject-card:hover,
.room-card:hover {
  box-shadow:var(--shadow-sm);
}

/* ── Timetable ──────────────────────────────────────────────── */
.timetable-wrapper {
  box-shadow:var(--shadow-sm);
}
.tt-header {
  background:linear-gradient(180deg, var(--bg-raised) 0%, var(--bg-surface) 100%);
}
.tt-room-label {
  background:linear-gradient(90deg, var(--bg-raised) 0%, var(--bg-surface) 100%);
}
.tt-course {
  box-shadow:0 2px 8px rgba(0,0,0,.2), inset 0 1px 0 rgba(255,255,255,.12);
}
.tt-course:hover {
  box-shadow:0 6px 18px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.18);
}

/* ── Matrix headers ─────────────────────────────────────────── */
.cmg-header,.mmg-header {
  background:linear-gradient(180deg, var(--bg-raised) 0%, var(--bg-surface) 100%);
}

/* ── Time slot headers ──────────────────────────────────────── */
.time-slot-header {
  background:linear-gradient(180deg, var(--bg-raised) 0%, var(--bg-surface) 100%);
}
.time-slot-time { letter-spacing:.04em; }

/* ── Profile cards ──────────────────────────────────────────── */
.profile-identity {
  background:linear-gradient(135deg, var(--bg-surface) 0%, var(--bg-raised) 100%);
  box-shadow:var(--shadow-xs), inset 0 1px 0 rgba(255,255,255,.05);
}
.pi-name {
  background:linear-gradient(135deg, var(--gold) 0%, var(--accent-2) 100%);
  -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text;
}

/* ── Room alert / Toast — polished ─────────────────────────── */
.room-alert {
  box-shadow:var(--shadow), 0 0 0 1px var(--warning);
}
.toast {
  border-left:3px solid var(--accent);
  box-shadow:var(--shadow-sm);
}

/* ── Loading spinner ────────────────────────────────────────── */
.loading-spinner {
  border-width:2px;
  box-shadow:0 0 12px var(--accent-glow);
}

/* ── Login — plus impressionnante ──────────────────────────── */
.login-page {
  background-image:
    radial-gradient(ellipse 60% 50% at 50% 0%, var(--accent-glow), transparent),
    radial-gradient(ellipse 40% 30% at 80% 100%, rgba(212,168,67,.06), transparent);
}
.login-card {
  border:1px solid var(--border);
  box-shadow:var(--shadow), var(--shadow-glow);
  position:relative;
  overflow:hidden;
}
.login-card::before {
  content:'';
  position:absolute;
  top:0; left:0; right:0;
  height:2px;
  background:linear-gradient(90deg, transparent, var(--gold), var(--accent), var(--gold), transparent);
  opacity:.6;
}
.login-title {
  background:linear-gradient(135deg, var(--gold) 0%, var(--accent-2) 100%);
  -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text;
}

/* ── Inline form sections (dash views) ─────────────────────── */
.dash-section {
  box-shadow:var(--shadow-xs), inset 0 1px 0 rgba(255,255,255,.03);
}
[data-theme="parchment"] .dash-section {
  box-shadow:0 1px 6px rgba(80,40,0,.1), inset 0 1px 0 rgba(255,240,180,.2);
}

/* ── Stat pills ─────────────────────────────────────────────── */
.stats-pill {
  box-shadow:var(--shadow-xs);
  transition:border-color var(--transition), transform var(--transition);
}
.stats-pill:hover { border-color:var(--accent); transform:translateY(-1px); }
.stats-pill-val { color:var(--gold); }

/* ── Perm chips ─────────────────────────────────────────────── */
.perm-chip {
  transition:all var(--transition);
}
.perm-chip:hover {
  background:var(--accent-glow);
  border-color:var(--accent);
  color:var(--text-primary);
}

/* ── View switcher ──────────────────────────────────────────── */
.view-btn.active {
  background:var(--accent-glow);
  border-color:var(--accent);
  color:var(--accent-2);
  font-weight:600;
}

/* ── Scroll ─────────────────────────────────────────────────── */
* { scrollbar-width:thin; scrollbar-color:var(--border-light) var(--bg-base); }

/* ════════════════════════════════════════════════════════════════
   TOPBAR POLISH — parchemin clair
   ════════════════════════════════════════════════════════════════ */
[data-theme="parchment"] .topbar {
  border-bottom-color:rgba(139,94,0,.22);
  box-shadow:0 1px 0 rgba(139,94,0,.12), var(--shadow-xs);
}
[data-theme="parchment"] .page-title { color:var(--gold); }
[data-theme="parchment"] .quick-search-input:focus {
  border-color:var(--accent); box-shadow:0 0 0 3px rgba(124,54,0,.14);
}
[data-theme="parchment"] .btn-primary {
  background:linear-gradient(135deg, var(--accent), #5c2800);
  border-color:var(--accent); box-shadow:0 2px 8px rgba(124,54,0,.28);
}
[data-theme="parchment"] .btn-primary:hover {
  background:linear-gradient(135deg, var(--accent-2), var(--accent));
  box-shadow:0 4px 14px rgba(124,54,0,.4); color:#fff;
}
[data-theme="parchment"] .page-btn.active {
  background:linear-gradient(135deg, var(--accent), #5c2800); border-color:var(--accent);
}
[data-theme="parchment"] .stat-card:hover { border-color:rgba(124,54,0,.25); }
[data-theme="parchment"] .subject-card:hover { border-color:rgba(124,54,0,.22); }

/* ════════════════════════════════════════════════════════════════
   POLISSAGE GLOBAL — tous thèmes
   ════════════════════════════════════════════════════════════════ */
/* Stat cards — accent top border on hover */
.stat-card { border-top:2px solid transparent; transition:transform var(--transition),box-shadow var(--transition),border-color var(--transition),border-top-color var(--transition); }
.stat-card:hover { border-top-color:var(--accent); }

/* Form cards — subtle left accent */
.form-card { border-left:3px solid var(--border); transition:border-color var(--transition); }
.form-card:hover { border-left-color:var(--accent); }

/* Dashboard cards */
.dashboard-card { transition:box-shadow var(--transition),border-color var(--transition); }
.dashboard-card:hover { border-color:rgba(139,92,246,.18); }

/* Better scrollbar */
::-webkit-scrollbar { width:6px; height:6px; }
::-webkit-scrollbar-track { background:var(--bg-base); }
::-webkit-scrollbar-thumb { background:var(--border-light); border-radius:3px; }
::-webkit-scrollbar-thumb:hover { background:var(--accent); }

/* Focus visible amélioré */
:focus-visible { outline:2px solid var(--accent); outline-offset:2px; }

/* Topbar search focus glow for light/dark */
[data-theme="dark"] .quick-search-input:focus,
[data-theme="light"] .quick-search-input:focus { border-color:var(--accent); }

/* Smoother table row transitions */
.arcane-table tbody tr { transition:background var(--transition); }

/* Better form section header */
.form-section-header { letter-spacing:.12em; }

/* Shimmer effect on primary btn */
.btn-primary { position:relative; overflow:hidden; }
.btn-primary::after {
  content:''; position:absolute; inset:0;
  background:linear-gradient(105deg, transparent 40%, rgba(255,255,255,.18) 50%, transparent 60%);
  transform:translateX(-100%); transition:transform .45s ease;
}
.btn-primary:hover::after { transform:translateX(100%); }

/* Page header block nicer */
.page-header-block { padding:.2rem 0; }
.phb-title { font-size:1.12rem; letter-spacing:.02em; }

/* ════════════════════════════════════════════════════════════════
   SIDEBAR — ANIMATIONS AVANCÉES
   ════════════════════════════════════════════════════════════════ */

/* ── Canvas particules ──────────────────────────────────────── */
#sidebar-particles {
  position:absolute; inset:0;
  width:100%; height:100%;
  pointer-events:none; z-index:0; opacity:.9;
}

/* ── 3ème anneau orbital avec comète ────────────────────────── */
.sb-seal-ring-3 {
  position:absolute; inset:-9px; border-radius:50%;
  border:1px solid rgba(212,168,67,.08);
  animation:seal-spin 38s linear infinite;
}
.sb-seal-ring-3::before {
  content:''; position:absolute;
  width:5px; height:5px; border-radius:50%;
  top:0; left:50%;
  transform:translate(-50%, -50%);
  background:radial-gradient(circle, var(--gold) 0%, transparent 70%);
  box-shadow:0 0 8px 2px rgba(212,168,67,.6), 0 0 18px rgba(212,168,67,.25);
}
[data-theme="parchment"] .sb-seal-ring-3,
[data-theme="parchment-dark"] .sb-seal-ring-3 {
  border-color:rgba(200,120,32,.1);
}
[data-theme="light"] .sb-seal-ring-3 {
  border-color:rgba(124,58,237,.08);
}
[data-theme="light"] .sb-seal-ring-3::before {
  background:radial-gradient(circle, var(--accent) 0%, transparent 70%);
  box-shadow:0 0 8px 2px rgba(124,58,237,.5), 0 0 18px rgba(124,58,237,.2);
}

/* ── Nav item — shimmer au hover ────────────────────────────── */
.nav-item,
.nav-group-toggle {
  position:relative;
  overflow:hidden;
}
.nav-item::after,
.nav-group-toggle::after {
  content:'';
  position:absolute; top:0; bottom:0; left:-120%;
  width:50%;
  background:linear-gradient(90deg, transparent, rgba(255,255,255,.07), transparent);
  transform:skewX(-18deg);
  pointer-events:none;
  transition:none;
}
.nav-item:hover::after,
.nav-group-toggle:hover::after {
  animation:nav-shimmer .55s ease forwards;
}
@keyframes nav-shimmer {
  from { left:-120%; }
  to   { left:170%; }
}

/* ── Nav item actif — lumière voyageuse ─────────────────────── */
.nav-item.active::after {
  animation:active-travel 4s ease-in-out infinite !important;
  background:linear-gradient(90deg, transparent, rgba(139,92,246,.15), transparent) !important;
}
@keyframes active-travel {
  0%,100% { left:-120%; opacity:0; }
  15%     { opacity:1; }
  85%     { opacity:1; }
  100%    { left:170%; opacity:0; }
}
[data-theme="parchment"] .nav-item.active::after,
[data-theme="parchment-dark"] .nav-item.active::after {
  background:linear-gradient(90deg, transparent, rgba(200,120,32,.14), transparent) !important;
}
[data-theme="light"] .nav-item.active::after {
  background:linear-gradient(90deg, transparent, rgba(124,58,237,.12), transparent) !important;
}

/* ── Ripple au clic ─────────────────────────────────────────── */
.nav-ripple {
  position:absolute;
  width:6px; height:6px; border-radius:50%;
  background:rgba(255,255,255,.3);
  pointer-events:none;
  transform:translate(-50%,-50%) scale(0);
  animation:ripple-expand .55s ease-out forwards;
  z-index:10;
}
[data-theme="parchment"] .nav-ripple,
[data-theme="parchment-dark"] .nav-ripple {
  background:rgba(212,168,67,.4);
}
@keyframes ripple-expand {
  to { transform:translate(-50%,-50%) scale(48); opacity:0; }
}

/* ── Entrée séquentielle ────────────────────────────────────── */
@keyframes nav-enter {
  from { opacity:0; transform:translateX(-8px); }
  to   { opacity:1; transform:none; }
}
.sidebar-brand    { animation:nav-enter .4s .02s both; }
.sidebar-nav > *:nth-child(1)   { animation:nav-enter .32s .06s both; }
.sidebar-nav > *:nth-child(2)   { animation:nav-enter .32s .10s both; }
.sidebar-nav > *:nth-child(3)   { animation:nav-enter .32s .14s both; }
.sidebar-nav > *:nth-child(4)   { animation:nav-enter .32s .18s both; }
.sidebar-nav > *:nth-child(5)   { animation:nav-enter .32s .22s both; }
.sidebar-nav > *:nth-child(6)   { animation:nav-enter .32s .26s both; }
.sidebar-nav > *:nth-child(7)   { animation:nav-enter .32s .30s both; }
.sidebar-nav > *:nth-child(8)   { animation:nav-enter .32s .34s both; }
.sidebar-nav > *:nth-child(9)   { animation:nav-enter .32s .38s both; }
.sidebar-nav > *:nth-child(10)  { animation:nav-enter .32s .42s both; }
.sidebar-nav > *:nth-child(n+11){ animation:nav-enter .32s .46s both; }
.sidebar-user     { animation:nav-enter .35s .5s both; }

/* ── Nav sub-items — entrée en cascade quand groupe ouvert ─── */
.nav-group.open .nav-sub:nth-child(1) { animation:nav-enter .22s .05s both; }
.nav-group.open .nav-sub:nth-child(2) { animation:nav-enter .22s .10s both; }
.nav-group.open .nav-sub:nth-child(3) { animation:nav-enter .22s .15s both; }
.nav-group.open .nav-sub:nth-child(4) { animation:nav-enter .22s .20s both; }

/* ── Nav divider — trait qui pousse ─────────────────────────── */
.nav-divider { overflow:hidden; }
.nav-divider::before { animation:divider-grow .5s ease both; }
.nav-divider::after  { animation:divider-grow .5s .1s ease both; }
@keyframes divider-grow {
  from { transform:scaleX(0); opacity:0; }
  to   { transform:scaleX(1); opacity:1; }
}

/* ── Appname — glow pulsant ─────────────────────────────────── */
.sidebar-appname {
  animation:appname-glow 6s ease-in-out infinite;
}
@keyframes appname-glow {
  0%,100% { text-shadow:0 0 12px rgba(212,168,67,.2); }
  50%     { text-shadow:0 0 28px rgba(212,168,67,.5), 0 0 50px rgba(212,168,67,.15); }
}
[data-theme="light"] .sidebar-appname {
  animation:appname-glow-light 6s ease-in-out infinite;
}
@keyframes appname-glow-light {
  0%,100% { text-shadow:0 0 12px rgba(124,58,237,.18); }
  50%     { text-shadow:0 0 28px rgba(124,58,237,.4), 0 0 50px rgba(124,58,237,.12); }
}

/* ── User footer — hover glow avatar ────────────────────────── */
.su-avatar, .su-avatar-placeholder {
  transition:box-shadow var(--transition), transform var(--transition), border-color var(--transition);
}
.su-card:hover .su-avatar,
.su-card:hover .su-avatar-placeholder {
  transform:scale(1.06);
  box-shadow:0 0 18px rgba(212,168,67,.3);
}

/* ════════════════════════════════════════════════════════════════
   ██████████  DESIGN SYSTÈME v2  ██████████
   Langage visuel "Rôles" étendu à toute l'interface :
   • Bandes supérieures colorées + shimmer
   • Glow overlay au hover via ::after
   • border-radius-xl sur toutes les cartes
   • Hero headers animés
   • Buttons & inputs premium
   Compatible tous les 4 thèmes.
   ════════════════════════════════════════════════════════════════ */

/* ── Keyframes globaux v2 ─────────────────────────────────── */
@keyframes v2-band-shimmer {
  0%        { transform:translateX(-100%); }
  55%,100%  { transform:translateX(220%); }
}
@keyframes v2-icon-float {
  0%,100% { transform:translateY(0) rotate(-4deg); }
  50%     { transform:translateY(-6px) rotate(4deg); }
}
@keyframes v2-icon-pulse {
  0%,100% { box-shadow:0 0 0 0 var(--accent-glow), 0 0 18px var(--accent-glow); }
  50%     { box-shadow:0 0 0 7px transparent, 0 0 28px var(--accent-glow); }
}
@keyframes v2-card-in {
  from { opacity:0; transform:translateY(10px); }
  to   { opacity:1; transform:none; }
}

/* ════════════════════════════════════════════════════════════════
   FORM CARDS — bande supérieure colorée
   ════════════════════════════════════════════════════════════════ */
/* Surcharge la règle existante (height:1px) par une bande accent 4px */
.form-card::before {
  height:4px !important;
  background:linear-gradient(90deg, var(--accent), var(--gold), var(--accent)) !important;
  opacity:.78;
}
/* Shimmer animé sur la bande */
.form-card {
  border-radius:var(--radius-xl) !important;
  border-left:none !important;
  overflow:hidden;
  transition:box-shadow .22s ease, border-color .22s ease !important;
}
.form-card:hover {
  box-shadow:0 8px 32px var(--accent-glow), var(--shadow-xs) !important;
  border-color:rgba(139,92,246,.3) !important;
}
.form-card:focus-within {
  border-color:var(--accent) !important;
  box-shadow:0 0 0 2px var(--accent-glow), 0 8px 28px var(--accent-glow) !important;
}
/* Retire la barre verticale gauche et améliore le titre */
.form-card-title {
  border-left:none !important;
  font-size:.75rem !important;
  text-transform:uppercase !important;
  letter-spacing:.1em !important;
  color:var(--gold) !important;
  font-family:var(--font-heading) !important;
  display:flex; align-items:center; gap:.55rem;
  padding-top:.7rem !important;
}
.form-card-title::before { display:none !important; }
/* Séparateur doré sous le titre */
.form-card-title::after {
  content:'';
  flex:1; height:1px;
  background:linear-gradient(90deg, var(--border), transparent);
}

/* ════════════════════════════════════════════════════════════════
   FORM SECTIONS — bande + header gold
   ════════════════════════════════════════════════════════════════ */
.form-section {
  border-radius:var(--radius-xl) !important;
  overflow:hidden;
  position:relative;
  transition:border-color .22s ease, box-shadow .22s ease;
}
/* Bande accent en haut */
.form-section::before {
  content:'';
  position:absolute;
  top:0; left:0; right:0;
  height:3px;
  background:linear-gradient(90deg, var(--accent), var(--gold), var(--accent));
  opacity:.65;
  z-index:1;
  pointer-events:none;
}
.form-section:focus-within {
  border-color:var(--accent);
  box-shadow:0 0 0 2px var(--accent-glow);
}
.form-section-header {
  margin-top:3px !important;   /* espace sous la bande */
  color:var(--gold) !important;
  font-size:.65rem !important;
  letter-spacing:.13em !important;
  background:linear-gradient(180deg, var(--bg-raised) 0%, var(--bg-surface) 100%) !important;
  border-bottom:1px solid var(--border) !important;
  gap:.5rem !important;
}
/* Séparateur sur les titres de groupes de permissions */
.perm-group-title {
  font-family:var(--font-heading) !important;
  font-size:.63rem !important;
  text-transform:uppercase !important;
  letter-spacing:.14em !important;
  color:var(--gold) !important;
  display:flex; align-items:center; gap:.5rem;
  margin-bottom:.55rem !important;
}
.perm-group-title::after {
  content:'';
  flex:1; height:1px;
  background:linear-gradient(90deg, var(--border-light), transparent);
}

/* ════════════════════════════════════════════════════════════════
   FORM PAGE HEADER — hero animé
   ════════════════════════════════════════════════════════════════ */
.form-page-header {
  background:var(--bg-surface);
  border:1px solid var(--border);
  border-radius:var(--radius-xl);
  padding:1.25rem 1.4rem;
  margin-bottom:1.45rem;
  position:relative;
  overflow:hidden;
  box-shadow:var(--shadow-xs), inset 0 1px 0 rgba(255,255,255,.05);
}
/* Bande dorée en haut */
.form-page-header::before {
  content:'';
  position:absolute;
  top:0; left:0; right:0; height:3px;
  background:linear-gradient(90deg, transparent, var(--gold), var(--accent), var(--gold), transparent);
  opacity:.7;
}
/* Glow radial derrière l'icône */
.form-page-header::after {
  content:'';
  position:absolute; inset:0;
  background:radial-gradient(ellipse 55% 100% at 0% 50%, var(--accent-glow), transparent 70%);
  pointer-events:none;
}
.fph-icon {
  width:52px !important; height:52px !important;
  border-radius:14px !important;
  background:var(--accent-glow) !important;
  border:1.5px solid rgba(139,92,246,.38) !important;
  font-size:1.5rem !important;
  box-shadow:0 0 22px var(--accent-glow);
  animation:v2-icon-float 4s ease-in-out infinite, v2-icon-pulse 3s ease-in-out infinite;
  position:relative; z-index:1;
}
.fph-title {
  position:relative; z-index:1;
  font-size:1.12rem !important;
  font-family:var(--font-heading) !important;
  letter-spacing:.025em;
  background:linear-gradient(135deg, var(--gold) 0%, var(--accent-2) 100%) !important;
  -webkit-background-clip:text !important;
  -webkit-text-fill-color:transparent !important;
  background-clip:text !important;
}
.fph-sub {
  position:relative; z-index:1;
  font-size:.79rem !important;
  font-style:italic;
}
/* Thèmes parchemin — icône couleur chaude */
[data-theme="parchment"] .fph-icon,
[data-theme="parchment-dark"] .fph-icon {
  background:rgba(200,120,32,.12) !important;
  border-color:rgba(212,168,67,.4) !important;
  box-shadow:0 0 22px rgba(200,120,32,.2);
}
/* Parchemin clair — gradient sombre sur fond crème (text-primary=#1e1208, accent=#7c3600) */
/* ⚠ Ne PAS utiliser background:none : avec background-clip:text, ça rend le texte invisible */
[data-theme="parchment"] .fph-title {
  background:linear-gradient(135deg, var(--text-primary) 0%, var(--accent) 60%) !important;
  -webkit-background-clip:text !important;
  background-clip:text !important;
  -webkit-text-fill-color:transparent !important;
}
/* Parchemin sombre — sous-titre plus lisible (text-muted trop faible = 2.9:1) */
[data-theme="parchment-dark"] .fph-sub {
  color:var(--text-secondary) !important;
}
[data-theme="parchment"] .fph-sub {
  color:var(--text-secondary) !important;
}

/* ════════════════════════════════════════════════════════════════
   SUBJECT CARDS — même langage v2
   ════════════════════════════════════════════════════════════════ */
.subject-card {
  border-radius:var(--radius-xl) !important;
  overflow:hidden !important;
  position:relative;
  transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease !important;
}
/* Bande supérieure */
.subject-card::before {
  content:'' !important;
  position:absolute !important;
  top:0; left:0; right:0;
  height:3px !important;
  background:linear-gradient(90deg, var(--accent), var(--gold)) !important;
  display:block !important;
  opacity:.7;
  pointer-events:none;
  z-index:1;
}
/* Glow overlay hover */
.subject-card::after {
  content:'' !important;
  position:absolute; inset:0;
  background:radial-gradient(ellipse 80% 40% at 50% 0%, var(--accent-glow), transparent 68%);
  opacity:0 !important;
  transition:opacity .25s ease !important;
  pointer-events:none;
}
.subject-card:hover {
  transform:translateY(-4px) !important;
  box-shadow:0 12px 38px var(--accent-glow), var(--shadow-sm) !important;
  border-color:var(--accent) !important;
}
.subject-card:hover::after { opacity:1 !important; }

/* ════════════════════════════════════════════════════════════════
   ROOM CARDS — même langage v2
   ════════════════════════════════════════════════════════════════ */
.room-card {
  border-radius:var(--radius-xl) !important;
  overflow:hidden !important;
  position:relative;
  transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease !important;
}
.room-card::before {
  content:'' !important;
  position:absolute !important;
  top:0; left:0; right:0;
  height:3px !important;
  background:linear-gradient(90deg, var(--gold), var(--accent)) !important;
  display:block !important;
  opacity:.65;
  pointer-events:none;
  z-index:1;
}
.room-card::after {
  content:'' !important;
  position:absolute; inset:0;
  background:radial-gradient(ellipse 80% 40% at 50% 0%, var(--accent-glow), transparent 68%);
  opacity:0 !important;
  transition:opacity .25s ease !important;
  pointer-events:none;
}
.room-card:hover {
  transform:translateY(-4px) !important;
  box-shadow:0 12px 38px var(--accent-glow), var(--shadow-sm) !important;
  border-color:var(--accent) !important;
}
.room-card:hover::after { opacity:1 !important; }

/* ════════════════════════════════════════════════════════════════
   ADMIN CARDS — hero v2
   ════════════════════════════════════════════════════════════════ */
.admin-card {
  border-radius:var(--radius-xl) !important;
  overflow:hidden !important;
  position:relative;
  transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease !important;
}
.admin-card::before {
  content:'' !important;
  position:absolute !important;
  top:0; left:0; right:0;
  height:3px !important;
  background:linear-gradient(90deg, var(--accent), var(--gold), var(--accent)) !important;
  display:block !important;
  opacity:.65;
  pointer-events:none;
  z-index:1;
}
.admin-card::after {
  content:'' !important;
  position:absolute; inset:0;
  background:radial-gradient(ellipse 80% 50% at 50% 0%, var(--accent-glow), transparent 65%);
  opacity:0 !important;
  transition:opacity .25s ease !important;
  pointer-events:none;
}
.admin-card:hover {
  transform:translateY(-5px) !important;
  box-shadow:0 14px 44px var(--accent-glow), var(--shadow-sm) !important;
  border-color:var(--accent) !important;
}
.admin-card:hover::after { opacity:1 !important; }
.admin-card-icon {
  animation:v2-icon-float 4.5s ease-in-out infinite;
  display:inline-block;
  filter:drop-shadow(0 0 10px var(--accent-glow));
  position:relative; z-index:1;
}
.admin-card h3,.admin-card p { position:relative; z-index:1; }

/* ════════════════════════════════════════════════════════════════
   STAT CARDS — accent top border
   ════════════════════════════════════════════════════════════════ */
.stat-card {
  border-radius:var(--radius-xl) !important;
  overflow:hidden !important;
  border-top:3px solid var(--accent) !important;
  border-left:1px solid var(--border);
  transition:transform .22s ease, box-shadow .22s ease, border-top-color .22s ease !important;
}
/* Masque le reflet 1px existant pour ne garder que la bande 3px */
.stat-card::before { display:none !important; }
.stat-card:hover {
  transform:translateY(-4px) !important;
  box-shadow:0 10px 32px var(--accent-glow), var(--shadow-sm) !important;
  border-top-color:var(--gold) !important;
}

/* ════════════════════════════════════════════════════════════════
   DASHBOARD CARDS — bande subtile
   ════════════════════════════════════════════════════════════════ */
.dashboard-card {
  border-radius:var(--radius-xl) !important;
  overflow:hidden !important;
  position:relative;
  transition:border-color .22s ease, box-shadow .22s ease !important;
}
/* Remplace le reflet 1px par une bande colorée douce */
.dashboard-card::before {
  height:3px !important;
  background:linear-gradient(90deg, var(--accent), var(--gold), var(--accent)) !important;
  opacity:.5;
}
.dashboard-card:hover {
  border-color:rgba(139,92,246,.22) !important;
  box-shadow:var(--shadow-xs), 0 4px 18px var(--accent-glow) !important;
}

/* ════════════════════════════════════════════════════════════════
   PAGE HEADER BLOCK — hero léger
   ════════════════════════════════════════════════════════════════ */
.page-header-block {
  background:var(--bg-surface);
  border:1px solid var(--border);
  border-radius:var(--radius-xl);
  padding:.95rem 1.35rem;
  margin-bottom:1.25rem;
  position:relative;
  overflow:hidden;
  box-shadow:var(--shadow-xs);
}
.page-header-block::before {
  content:'';
  position:absolute;
  top:0; left:0; right:0; height:2px;
  background:linear-gradient(90deg, transparent, var(--gold), var(--accent), var(--gold), transparent);
  opacity:.55;
}
.page-header-block::after {
  content:'';
  position:absolute; inset:0;
  background:radial-gradient(ellipse 40% 100% at 0% 50%, var(--accent-glow), transparent 72%);
  pointer-events:none;
}
.phb-title { position:relative; z-index:1; letter-spacing:.02em; }
.phb-actions { position:relative; z-index:1; }

/* ════════════════════════════════════════════════════════════════
   FORM ACTIONS & FOOTER — barre stylée
   ════════════════════════════════════════════════════════════════ */
.form-actions,
.form-footer {
  background:var(--bg-surface);
  border:1px solid var(--border);
  border-radius:var(--radius-xl);
  padding:.85rem 1.25rem;
  box-shadow:var(--shadow-xs), inset 0 1px 0 rgba(255,255,255,.04);
  margin-top:1.25rem !important;
  position:relative;
  overflow:hidden;
}
.form-actions::before,
.form-footer::before {
  content:'';
  position:absolute;
  top:0; left:0; right:0; height:2px;
  background:linear-gradient(90deg, transparent, var(--accent), transparent);
  opacity:.4;
}

/* ════════════════════════════════════════════════════════════════
   INPUTS & SELECTS — premium
   ════════════════════════════════════════════════════════════════ */
.form-input,
.form-select,
.form-textarea {
  padding:.52rem .88rem !important;
  border:1.5px solid var(--border) !important;
  border-radius:calc(var(--radius) + 1px) !important;
  transition:border-color .17s ease, box-shadow .17s ease, background .17s ease !important;
}
.form-input:hover:not(:focus),
.form-select:hover:not(:focus),
.form-textarea:hover:not(:focus) {
  border-color:var(--border-light) !important;
  background:var(--bg-hover) !important;
}
.form-input:focus,
.form-select:focus,
.form-textarea:focus {
  border-color:var(--accent) !important;
  box-shadow:0 0 0 3px var(--accent-glow), 0 2px 8px rgba(0,0,0,.08) !important;
  background:var(--bg-surface) !important;
}

/* ── Labels ────────────────────────────────────────────────── */
.form-group label {
  font-size:.71rem !important;
  font-family:var(--font-heading) !important;
  text-transform:uppercase !important;
  letter-spacing:.1em !important;
  color:var(--text-muted);
}

/* ── Checkboxes ────────────────────────────────────────────── */
.checkbox-label {
  padding:.22rem .42rem !important;
  border-radius:7px !important;
  transition:background .14s ease !important;
}
.checkbox-label:hover { background:var(--accent-glow) !important; }
.checkbox-label input[type="checkbox"] {
  accent-color:var(--accent);
  cursor:pointer;
  width:15px; height:15px;
}

/* ════════════════════════════════════════════════════════════════
   BUTTONS — micro-animations renforcées
   ════════════════════════════════════════════════════════════════ */
.btn {
  border-radius:var(--radius) !important;
  font-weight:600 !important;
  letter-spacing:.02em;
  transition:all .18s ease !important;
}
.btn:not(:disabled):hover  { transform:translateY(-1px); }
.btn:not(:disabled):active { transform:translateY(0) scale(.97); }
.btn-primary {
  box-shadow:0 2px 14px var(--accent-glow), 0 1px 3px rgba(0,0,0,.18) !important;
}
.btn-primary:not(:disabled):hover {
  box-shadow:0 6px 22px var(--accent-glow), 0 2px 6px rgba(0,0,0,.25) !important;
}
.btn-danger {
  box-shadow:0 2px 10px rgba(239,68,68,.28) !important;
}
.btn-danger:not(:disabled):hover {
  box-shadow:0 6px 20px rgba(239,68,68,.44) !important;
}

/* ════════════════════════════════════════════════════════════════
   TABLES — header gold premium
   ════════════════════════════════════════════════════════════════ */
.arcane-table { border-radius:var(--radius-xl) !important; }
.arcane-table th {
  color:var(--gold) !important;
  letter-spacing:.12em !important;
  font-size:.67rem !important;
}

/* ════════════════════════════════════════════════════════════════
   THÈME PARCHEMIN — ajustements bandes
   ════════════════════════════════════════════════════════════════ */
[data-theme="parchment"] .form-card::before,
[data-theme="parchment"] .form-section::before,
[data-theme="parchment"] .subject-card::before,
[data-theme="parchment"] .room-card::before,
[data-theme="parchment"] .admin-card::before,
[data-theme="parchment"] .dashboard-card::before,
[data-theme="parchment"] .form-page-header::before,
[data-theme="parchment"] .page-header-block::before {
  background:linear-gradient(90deg, var(--accent), var(--gold), var(--accent)) !important;
  opacity:.58;
}
[data-theme="parchment-dark"] .form-card::before,
[data-theme="parchment-dark"] .form-section::before,
[data-theme="parchment-dark"] .subject-card::before,
[data-theme="parchment-dark"] .room-card::before,
[data-theme="parchment-dark"] .admin-card::before,
[data-theme="parchment-dark"] .dashboard-card::before,
[data-theme="parchment-dark"] .form-page-header::before,
[data-theme="parchment-dark"] .page-header-block::before {
  background:linear-gradient(90deg, var(--accent), var(--gold)) !important;
  opacity:.72;
}
[data-theme="parchment"] .stat-card,
[data-theme="parchment-dark"] .stat-card {
  border-top-color:var(--gold) !important;
}

/* Thème clair */
[data-theme="light"] .form-page-header::after,
[data-theme="light"] .page-header-block::after {
  background:radial-gradient(ellipse 40% 100% at 0% 50%, rgba(124,58,237,.07), transparent 72%);
}

/* ════════════════════════════════════════════════════════════════
   COMPOSANTS GLOBAUX v2 — Dashboard, Profil, Planning, Stats
   Applique le même langage visuel sur toutes les pages.
   ════════════════════════════════════════════════════════════════ */

/* ── dash-section (dashboard, profil) ─────────────────────── */
.dash-section {
  border-radius:var(--radius-xl) !important;
  overflow:hidden;
  position:relative;
  transition:border-color .2s ease, box-shadow .2s ease;
}
.dash-section::before {
  content:'';
  position:absolute;
  top:0; left:0; right:0; height:3px;
  background:linear-gradient(90deg, var(--accent), var(--gold), var(--accent));
  opacity:.45;
  pointer-events:none;
}
.dash-section-head {
  color:var(--gold) !important;
  font-family:var(--font-heading) !important;
  font-size:.72rem !important;
  text-transform:uppercase !important;
  letter-spacing:.12em !important;
  margin-top:3px !important;
}

/* ── dash-stat (dashboard, profil, courses/stats) ──────────── */
.dash-stat {
  border-radius:var(--radius-xl) !important;
  overflow:hidden;
  position:relative;
  border-top:3px solid var(--accent) !important;
  transition:transform .2s ease, box-shadow .2s ease !important;
}
.dash-stat:hover {
  transform:translateY(-3px) !important;
  box-shadow:0 8px 26px var(--accent-glow), var(--shadow-xs) !important;
}
.ds-val {
  background:linear-gradient(135deg, var(--text-primary) 0%, var(--accent) 100%);
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  background-clip:text;
}
[data-theme="parchment"] .dash-stat,
[data-theme="parchment-dark"] .dash-stat {
  border-top-color:var(--gold) !important;
}

/* ── week-nav ────────────────────────────────────────────── */
.week-nav {
  border-radius:var(--radius-xl) !important;
  overflow:hidden;
  position:relative;
  border-top:2px solid rgba(139,92,246,.3) !important;
  background:var(--bg-surface) !important;
  box-shadow:var(--shadow-xs) !important;
}
[data-theme="parchment"] .week-nav,
[data-theme="parchment-dark"] .week-nav {
  border-top-color:rgba(212,168,67,.35) !important;
}

/* ── table-card (users index, materials) ─────────────────── */
.table-card {
  border-radius:var(--radius-xl) !important;
  overflow:hidden !important;
  position:relative;
  transition:border-color .2s ease, box-shadow .2s ease;
}
.table-card::before {
  content:'';
  position:absolute;
  top:0; left:0; right:0; height:3px;
  background:linear-gradient(90deg, var(--accent), var(--gold), var(--accent));
  opacity:.55;
  pointer-events:none;
}
.table-card:hover {
  border-color:rgba(139,92,246,.2) !important;
  box-shadow:0 4px 18px var(--accent-glow) !important;
}
.tchead {
  color:var(--gold) !important;
  font-family:var(--font-heading) !important;
  font-size:.72rem !important;
  text-transform:uppercase !important;
  letter-spacing:.12em !important;
  margin-top:3px !important;
}

/* ── profile-card ────────────────────────────────────────── */
.profile-card {
  border-radius:var(--radius-xl) !important;
  position:relative;
  overflow:hidden !important;
  background:var(--bg-surface) !important;
  box-shadow:var(--shadow-xs), 0 4px 18px var(--accent-glow) !important;
  border-top:3px solid var(--accent) !important;
}
.pc-name {
  background:linear-gradient(135deg, var(--gold) 0%, var(--accent) 100%);
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  background-clip:text;
}
.pc-avatar {
  border:2px solid var(--accent) !important;
  box-shadow:0 0 14px var(--accent-glow);
}
[data-theme="parchment"] .profile-card,
[data-theme="parchment-dark"] .profile-card {
  border-top-color:var(--gold) !important;
}

/* ── recap-card (users stats recap) ─────────────────────── */
.recap-card {
  border-radius:var(--radius-xl) !important;
  position:relative;
  overflow:hidden;
  transition:transform .2s ease, box-shadow .2s ease !important;
  border-top:3px solid var(--accent) !important;
}
.recap-card:hover {
  transform:translateY(-3px) !important;
  box-shadow:0 8px 24px var(--accent-glow) !important;
}
.recap-card-num {
  background:linear-gradient(135deg, var(--accent) 0%, var(--gold) 100%);
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  background-clip:text;
}

/* ── filters-bar (matrix, planning) ─────────────────────── */
.filters-bar {
  background:var(--bg-surface);
  border:1px solid var(--border);
  border-radius:var(--radius-xl);
  padding:.65rem 1rem;
  margin-bottom:1.1rem;
  display:flex; align-items:center; gap:.65rem; flex-wrap:wrap;
  position:relative;
  overflow:hidden;
  box-shadow:var(--shadow-xs);
}
.filters-bar::before {
  content:'';
  position:absolute;
  top:0; left:0; right:0; height:2px;
  background:linear-gradient(90deg, transparent, var(--accent), var(--gold), var(--accent), transparent);
  opacity:.4;
}

/* ── mmg-column (matrix grid) ───────────────────────────── */
.mmg-column {
  border-radius:var(--radius-xl) !important;
  overflow:hidden !important;
  position:relative;
  transition:box-shadow .2s ease, border-color .2s ease !important;
}
.mmg-column:hover {
  box-shadow:0 4px 18px var(--accent-glow) !important;
}
.mmg-header {
  border-radius:0 !important;
}
/* Chips d'années multiples dans matrix */
.mmg-item-years {
  display:flex; flex-wrap:wrap; gap:.2rem; margin-top:.25rem;
}
.mmg-year-chip {
  font-size:.62rem; font-weight:600;
  padding:.1rem .32rem;
  background:var(--accent-glow);
  border:1px solid rgba(139,92,246,.28);
  border-radius:6px;
  color:var(--accent);
  white-space:nowrap;
  display:inline-block;
}
[data-theme="parchment"] .mmg-year-chip,
[data-theme="parchment-dark"] .mmg-year-chip {
  background:rgba(200,120,32,.1);
  border-color:rgba(212,168,67,.3);
  color:var(--gold);
}

/* ── settings-block (profile) ─────────────────────────── */
.settings-block {
  border-radius:var(--radius-xl) !important;
  overflow:hidden !important;
  position:relative;
  border-top:3px solid rgba(139,92,246,.3) !important;
  transition:box-shadow .2s ease !important;
}
.settings-block:hover {
  box-shadow:0 4px 18px var(--accent-glow) !important;
}
[data-theme="parchment"] .settings-block,
[data-theme="parchment-dark"] .settings-block {
  border-top-color:rgba(212,168,67,.3) !important;
}

/* ════════════════════════════════════════════════════════════════
   CRAMOISI — overrides composants
   ════════════════════════════════════════════════════════════════ */
[data-theme="crimson"] .topbar { background:rgba(16,4,10,.92); box-shadow:0 1px 0 rgba(220,38,38,.14), var(--shadow-xs); }
[data-theme="crimson"] .form-input,
[data-theme="crimson"] .form-select,
[data-theme="crimson"] .form-textarea { background:var(--bg-raised); color:var(--text-primary); }
[data-theme="crimson"] .form-input:focus,
[data-theme="crimson"] .form-select:focus,
[data-theme="crimson"] .form-textarea:focus { border-color:var(--accent); box-shadow:0 0 0 3px rgba(220,38,38,.18); }
[data-theme="crimson"] .btn-primary { background:linear-gradient(135deg, var(--accent), #9a1818); border-color:var(--accent); box-shadow:0 2px 8px rgba(220,38,38,.32); }
[data-theme="crimson"] .btn-primary:hover { background:linear-gradient(135deg, var(--accent-2), var(--accent)); box-shadow:0 4px 14px rgba(220,38,38,.48); color:#fff; }
[data-theme="crimson"] .btn-secondary { background:var(--bg-raised); color:var(--text-primary); border-color:var(--border-light); }
[data-theme="crimson"] .btn-secondary:hover { background:var(--bg-hover); border-color:var(--accent); }
[data-theme="crimson"] .btn-ghost { color:var(--text-secondary); }
[data-theme="crimson"] .arcane-table { background:var(--bg-surface); }
[data-theme="crimson"] .ctx-nav-btn.active { background:rgba(220,38,38,.14); color:var(--accent-2); border:1px solid rgba(220,38,38,.3); }
[data-theme="crimson"] .page-btn.active { background:linear-gradient(135deg, var(--accent), #9a1818); border-color:var(--accent); }
[data-theme="crimson"] .info-box { background:rgba(220,38,38,.12); border-color:var(--accent); }
[data-theme="crimson"] .login-page { background-image:radial-gradient(ellipse 60% 50% at 50% 0%, rgba(220,38,38,.1), transparent); }
[data-theme="crimson"] .login-card { box-shadow:var(--shadow), 0 0 40px rgba(220,38,38,.14); }
[data-theme="crimson"] .stat-card:hover { border-color:rgba(220,38,38,.28); box-shadow:var(--shadow-sm); }
[data-theme="crimson"] .admin-card:hover { border-color:var(--accent); box-shadow:var(--shadow-glow); }
[data-theme="crimson"] .dash-stat { border-top-color:var(--accent) !important; }
[data-theme="crimson"] .profile-card { border-top-color:var(--accent) !important; }
[data-theme="crimson"] .settings-block { border-top-color:rgba(220,38,38,.3) !important; }
[data-theme="crimson"] .week-nav { border-top-color:rgba(220,38,38,.3) !important; }
[data-theme="crimson"] .mmg-year-chip { background:rgba(220,38,38,.1); border-color:rgba(248,113,113,.3); color:var(--accent-2); }
[data-theme="crimson"] .form-card::before,
[data-theme="crimson"] .form-section::before,
[data-theme="crimson"] .subject-card::before,
[data-theme="crimson"] .room-card::before,
[data-theme="crimson"] .admin-card::before,
[data-theme="crimson"] .dashboard-card::before,
[data-theme="crimson"] .page-header-block::before { background:linear-gradient(90deg, var(--accent), var(--gold)) !important; opacity:.72; }
[data-theme="crimson"] .stat-card { border-top-color:var(--accent) !important; }
[data-theme="crimson"] .quick-search-input:focus { border-color:var(--accent); box-shadow:0 0 0 3px rgba(220,38,38,.14); }

/* ════════════════════════════════════════════════════════════════
   ÉMERAUDE — overrides composants
   ════════════════════════════════════════════════════════════════ */
[data-theme="emerald"] .topbar { background:rgba(4,14,8,.92); box-shadow:0 1px 0 rgba(16,185,129,.14), var(--shadow-xs); }
[data-theme="emerald"] .form-input,
[data-theme="emerald"] .form-select,
[data-theme="emerald"] .form-textarea { background:var(--bg-raised); color:var(--text-primary); }
[data-theme="emerald"] .form-input:focus,
[data-theme="emerald"] .form-select:focus,
[data-theme="emerald"] .form-textarea:focus { border-color:var(--accent); box-shadow:0 0 0 3px rgba(16,185,129,.18); }
[data-theme="emerald"] .btn-primary { background:linear-gradient(135deg, var(--accent), #0a7c55); border-color:var(--accent); box-shadow:0 2px 8px rgba(16,185,129,.32); }
[data-theme="emerald"] .btn-primary:hover { background:linear-gradient(135deg, var(--accent-2), var(--accent)); box-shadow:0 4px 14px rgba(16,185,129,.48); color:#fff; }
[data-theme="emerald"] .btn-secondary { background:var(--bg-raised); color:var(--text-primary); border-color:var(--border-light); }
[data-theme="emerald"] .btn-secondary:hover { background:var(--bg-hover); border-color:var(--accent); }
[data-theme="emerald"] .btn-ghost { color:var(--text-secondary); }
[data-theme="emerald"] .arcane-table { background:var(--bg-surface); }
[data-theme="emerald"] .ctx-nav-btn.active { background:rgba(16,185,129,.14); color:var(--accent-2); border:1px solid rgba(16,185,129,.3); }
[data-theme="emerald"] .page-btn.active { background:linear-gradient(135deg, var(--accent), #0a7c55); border-color:var(--accent); }
[data-theme="emerald"] .info-box { background:rgba(16,185,129,.12); border-color:var(--accent); }
[data-theme="emerald"] .login-page { background-image:radial-gradient(ellipse 60% 50% at 50% 0%, rgba(16,185,129,.1), transparent); }
[data-theme="emerald"] .login-card { box-shadow:var(--shadow), 0 0 40px rgba(16,185,129,.14); }
[data-theme="emerald"] .stat-card:hover { border-color:rgba(16,185,129,.28); box-shadow:var(--shadow-sm); }
[data-theme="emerald"] .admin-card:hover { border-color:var(--accent); box-shadow:var(--shadow-glow); }
[data-theme="emerald"] .dash-stat { border-top-color:var(--accent) !important; }
[data-theme="emerald"] .profile-card { border-top-color:var(--accent) !important; }
[data-theme="emerald"] .settings-block { border-top-color:rgba(16,185,129,.3) !important; }
[data-theme="emerald"] .week-nav { border-top-color:rgba(16,185,129,.3) !important; }
[data-theme="emerald"] .mmg-year-chip { background:rgba(16,185,129,.1); border-color:rgba(52,211,153,.3); color:var(--accent-2); }
[data-theme="emerald"] .form-card::before,
[data-theme="emerald"] .form-section::before,
[data-theme="emerald"] .subject-card::before,
[data-theme="emerald"] .room-card::before,
[data-theme="emerald"] .admin-card::before,
[data-theme="emerald"] .dashboard-card::before,
[data-theme="emerald"] .page-header-block::before { background:linear-gradient(90deg, var(--accent), var(--gold)) !important; opacity:.72; }
[data-theme="emerald"] .stat-card { border-top-color:var(--accent) !important; }
[data-theme="emerald"] .quick-search-input:focus { border-color:var(--accent); box-shadow:0 0 0 3px rgba(16,185,129,.14); }

/* ════════════════════════════════════════════════════════════════
   RESPONSIVE MOBILE
   ════════════════════════════════════════════════════════════════ */

/* ── Tablette / Mobile large (≤ 900px) ─────────────────────────── */
@media(max-width:900px) {
  .dashboard-row { grid-template-columns:1fr; }
  .stats-grid { grid-template-columns:repeat(auto-fill,minmax(130px,1fr)); }
  .card-grid { grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); }
  .admin-grid { grid-template-columns:repeat(auto-fill,minmax(180px,1fr)); }
  .course-matrix-grid,
  .materials-matrix-grid { grid-template-columns:repeat(auto-fill,minmax(180px,1fr)); }
  .topbar-clock { display:none !important; }
}

/* ── Tablette (≤ 768px) ─────────────────────────────────────────── */
@media(max-width:768px) {
  /* --- Sidebar --- */
  .sidebar { transform:translateX(-100%); width:var(--sidebar-w) !important; z-index:200; }
  .sidebar.open { transform:translateX(0); box-shadow:var(--shadow); }
  .sidebar-toggle { display:flex; }
  .main-content { margin-left:0 !important; }

  /* Overlay quand la sidebar est ouverte */
  body.sidebar-open::after {
    content:''; position:fixed; inset:0; background:rgba(0,0,0,.5); z-index:150;
  }

  /* --- Layout général --- */
  .page-content { padding:.9rem; }
  .form-grid { grid-template-columns:1fr; }
  .form-grid .form-group.full { grid-column:1; }
  .dashboard-row { grid-template-columns:1fr; }
  .ctx-nav { display:none; }

  /* --- Topbar --- */
  .topbar { gap:.4rem; }
  .page-title { font-size:.9rem; }
  .quick-search-input { width:110px; }
  .quick-search-input:focus { width:160px; }

  /* --- Tables — scroll horizontal --- */
  .table-responsive {
    overflow-x:auto; -webkit-overflow-scrolling:touch;
    border-radius:var(--radius-lg); box-shadow:var(--shadow-sm);
  }
  .arcane-table { min-width:600px; }
  .table-actions { flex-wrap:nowrap; gap:.2rem; }
  .table-actions .btn { padding:.26rem .5rem; font-size:.72rem; }

  /* --- Stats --- */
  .stats-grid { grid-template-columns:repeat(auto-fill,minmax(120px,1fr)); gap:.65rem; }
  .stat-val { font-size:1.45rem; }

  /* --- Cards --- */
  .card-grid { grid-template-columns:1fr 1fr; gap:.75rem; }
  .admin-grid { grid-template-columns:1fr 1fr; gap:.65rem; }
  .course-matrix-grid,
  .materials-matrix-grid { grid-template-columns:1fr 1fr; gap:.65rem; }

  /* --- Formulaires --- */
  .arcane-form,.form-page { max-width:100%; }
  .form-actions { flex-wrap:wrap; }
  .page-actions { flex-wrap:wrap; gap:.4rem; }
  .form-inline { flex-direction:column; }
  .form-inline .form-group { flex:unset; width:100%; }
  .filters-bar { flex-direction:column; align-items:stretch; gap:.4rem; }
  .filters-bar .form-select,
  .filters-bar .form-input { width:100%; }

  /* --- Page header --- */
  .page-header-block { flex-direction:column; align-items:flex-start; }
  .phb-actions { flex-wrap:wrap; }

  /* --- Éditeur — stack vertical sur tablette --- */
  .editor-layout { flex-direction:column; height:auto; margin:0; }
  .editor-sidebar { width:100%; max-height:260px; border-right:none; border-bottom:1px solid var(--border); }
  .editor-main { min-height:400px; }

  /* --- Planning --- */
  .planning-item { padding:.48rem .65rem .48rem .75rem; gap:.55rem; }
  .pi-id { display:none; }
  .pi-time { min-width:110px; }
  .pi-subject { min-width:140px; }

  /* --- Profil --- */
  .profile-page { max-width:100%; }
  .profile-identity { flex-direction:column; text-align:center; }
  .pi-details { align-items:center; }
  .profile-stats-grid { grid-template-columns:repeat(3,1fr); }

  /* --- Timetable --- */
  .timetable-wrapper { overflow-x:auto; }

  /* --- Breadcrumbs --- */
  .breadcrumbs { flex-wrap:wrap; row-gap:.15rem; }

  /* --- Material content --- */
  .material-content { font-size:1rem; }

  /* --- Alertes --- */
  .room-alert { max-width:calc(100vw - 2rem); }
  #room-alert-container { left:1rem; right:1rem; }

  /* --- Quick search results --- */
  .qs-results { width:calc(100vw - 2rem); right:auto; left:50%; transform:translateX(-50%); }

  /* --- Matrix summary --- */
  .matrix-summary { flex-direction:column; gap:.32rem; }
}

/* ── Mobile (≤ 480px) ───────────────────────────────────────────── */
@media(max-width:480px) {
  /* --- Layout --- */
  .page-content { padding:.6rem; }
  .topbar { padding:0 .6rem; gap:.3rem; }
  .quick-search { display:none; }
  .breadcrumbs { padding:.3rem .6rem; }

  /* --- Cards une colonne --- */
  .card-grid { grid-template-columns:1fr; }
  .admin-grid { grid-template-columns:1fr; }
  .stats-grid { grid-template-columns:repeat(2,1fr); gap:.5rem; }
  .course-matrix-grid,
  .materials-matrix-grid { grid-template-columns:1fr; }
  .profile-stats-grid { grid-template-columns:repeat(2,1fr); }

  /* --- Boutons --- */
  .btn { font-size:.8rem; padding:.38rem .75rem; }
  .btn-sm { font-size:.72rem; padding:.24rem .5rem; }
  .page-actions .btn-sm { padding:.28rem .55rem; }

  /* --- Tables --- */
  .arcane-table th,
  .arcane-table td { padding:.48rem .6rem; }
  .arcane-table th { font-size:.65rem; }

  /* --- Cours row --- */
  .course-row { flex-wrap:wrap; }
  .cr-time { font-size:.76rem; }
  .cr-actions { margin-left:auto; }

  /* --- Planning --- */
  .planning-item { flex-wrap:wrap; gap:.4rem; }
  .pi-actions { margin-left:auto; }
  .pi-meta { gap:.4rem; }

  /* --- Profil --- */
  .profile-identity { padding:.85rem; }
  .pi-avatar img,
  .pi-avatar-placeholder { width:56px; height:56px; font-size:1.4rem; }
  .pi-name { font-size:1rem; }

  /* --- Pagination --- */
  .pagination { gap:.22rem; }
  .page-btn { padding:.26rem .55rem; font-size:.76rem; }

  /* --- Login --- */
  .login-card { padding:1.5rem 1.1rem; }
  .login-title { font-size:1.25rem; }

  /* --- Flash --- */
  .flash { margin:.45rem .6rem 0; font-size:.82rem; }

  /* --- Topbar titre --- */
  .page-title { font-size:.85rem; max-width:45vw; }

  /* --- Editor sidebar compacte --- */
  .editor-sidebar { max-height:200px; padding:.65rem; }
  .editor-sidebar .btn { font-size:.8rem; }

  /* --- Timetable — masquer colonnes salle sur très petit écran --- */
  .tt-room-label { width:50px; padding:0 .3rem; font-size:.7rem; }

  /* --- Form section --- */
  .form-section-body { padding:.85rem; }
  .form-card { padding:1rem; }
  .form-page-header { flex-direction:column; gap:.55rem; }

  /* --- Stats résumé --- */
  .stats-summary-row { flex-direction:column; align-items:flex-start; }
  .stats-matrix-wrap { font-size:.76rem; }

  /* --- Buffer alert --- */
  .buffer-alert { flex-direction:column; gap:.55rem; }
  .ba-icon { font-size:1.4rem; }
}

/* ── Très petit mobile (≤ 360px) ───────────────────────────────── */
@media(max-width:360px) {
  .sidebar-appname { font-size:.82rem; }
  .sidebar-subtitle { display:none; }
  .stats-grid { grid-template-columns:1fr 1fr; }
  .arcane-table { min-width:480px; }
  .page-title { max-width:38vw; }
}