:root{
  --app-bg:#f5f7fb;
  --app-panel:#ffffff;
  --app-panel-2:#f8fafc;
  --app-text:#1f2937;
  --app-muted:#6b7280;
  --app-line:#dfe4ec;
  --app-input:#ffffff;
  --app-accent:#c96c3b;
  --app-soft:#eef2f7;
  --app-success-bg:#edf8f0;
  --app-success:#277449;
  --app-danger-bg:#fff1f0;
  --app-danger:#9c2f27;
  --app-shadow:0 8px 24px rgba(15,23,42,.06);
}

html[data-theme="dark"]{
  --app-bg:#15191f;
  --app-panel:#1d232b;
  --app-panel-2:#232a33;
  --app-text:#eef2f7;
  --app-muted:#a8b0bc;
  --app-line:#37414d;
  --app-input:#171c22;
  --app-accent:#d78354;
  --app-soft:#2a333d;
  --app-success-bg:#183226;
  --app-success:#9bd3ad;
  --app-danger-bg:#3a2222;
  --app-danger:#f2aaa3;
  --app-shadow:0 10px 28px rgba(0,0,0,.22);
}

html,body{
  width:100%;
  min-height:100%;
}

body{
  background:var(--app-bg)!important;
  color:var(--app-text)!important;
  transition:background .18s ease,color .18s ease;
}

.wrap{
  width:100%!important;
  max-width:none!important;
  margin-left:auto!important;
  margin-right:auto!important;
  padding-left:clamp(10px,1.4vw,24px)!important;
  padding-right:clamp(10px,1.4vw,24px)!important;
}

.card,.hero,.box,.sheet,.planner,
section.card,section.hero{
  background:var(--app-panel)!important;
  color:var(--app-text)!important;
  border-color:var(--app-line)!important;
  box-shadow:var(--app-shadow);
}

.top{
  background:var(--app-panel)!important;
  color:var(--app-text)!important;
  border-color:var(--app-line)!important;
}

.muted,
.field label,
th{
  color:var(--app-muted)!important;
}

.btn{
  background:var(--app-panel)!important;
  color:var(--app-text)!important;
  border-color:var(--app-line)!important;
}

.btn.primary{
  background:var(--app-accent)!important;
  border-color:var(--app-accent)!important;
  color:#fff!important;
}

.btn.danger{
  color:var(--app-danger)!important;
}

input,select,textarea{
  background:var(--app-input)!important;
  color:var(--app-text)!important;
  border-color:var(--app-line)!important;
}

table th,
table td,
.plan th,
.plan td{
  border-color:var(--app-line)!important;
}

table th,
.plan th,
.time{
  background:var(--app-panel-2)!important;
  color:var(--app-text)!important;
}

.day-check,
.empty{
  background:var(--app-panel)!important;
  color:var(--app-text)!important;
  border-color:var(--app-line)!important;
}

.lesson{
  background:var(--app-panel)!important;
  color:var(--app-text)!important;
  /* Ne pas forcer border-color ici :
     la bordure gauche porte la couleur de la matière. */
}

.period,
.status,
.type,
.day-pill,
.summary span,
.period-tab span,
.badge{
  background:var(--app-soft)!important;
  color:var(--app-text)!important;
}

.msg,.ok{
  background:var(--app-success-bg)!important;
  color:var(--app-success)!important;
}

.error{
  background:var(--app-danger-bg)!important;
  color:var(--app-danger)!important;
}

html[data-theme="dark"] .pause,
html[data-theme="dark"] .slot-break{
  background:#2f291e!important;
  color:#e9c88b!important;
}

html[data-theme="dark"] .lunch,
html[data-theme="dark"] .slot-lunch{
  background:#252b32!important;
  color:#c7ced8!important;
}

html[data-theme="dark"] .slot-other{
  background:#212a34!important;
}

html[data-theme="dark"] .cell.empty:hover{
  background:#252c35!important;
}

html[data-theme="dark"] a{
  color:inherit;
}

/* Largeur et tables réellement adaptatives */
table:not(.plan){
  width:100%!important;
}

.planner{
  width:100%!important;
  overflow:auto!important;
}

.plan{
  width:100%!important;
  min-width:760px!important;
}

@media (max-width:1000px){
  .grid,.grid2{
    grid-template-columns:1fr!important;
  }
  .wrap{
    padding-left:10px!important;
    padding-right:10px!important;
  }
}

@media (max-width:700px){
  .top{
    gap:8px;
    flex-wrap:wrap;
  }
  .nav{
    gap:5px!important;
  }
  .btn{
    padding:7px 9px!important;
  }
  .row2{
    grid-template-columns:1fr!important;
  }
}

/* Bouton de thème dans la barre supérieure */
.theme-user-zone{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}
#themeToggle{
  position:static;
  z-index:auto;
  border:1px solid var(--app-line);
  background:var(--app-panel);
  color:var(--app-text);
  border-radius:999px;
  padding:7px 11px;
  font:700 12px/1 "Segoe UI",Arial,sans-serif;
  box-shadow:none;
  cursor:pointer;
  white-space:nowrap;
}
#themeToggle:hover{
  background:var(--app-panel-2);
}
@media print{
  /* V2.9.1 — les contrôles de l'interface ne doivent jamais apparaître
     dans les impressions papier ou PDF. */
  #themeToggle,
  button,
  .btn,
  a.btn,
  input[type="button"],
  input[type="submit"],
  input[type="reset"],
  .nav,
  .global-page-actions,
  [data-gmc-global-actions],
  .theme-user-zone,
  .form-actions,
  .modal-close,
  .hero-actions,
  .dashboard-actions{
    display:none!important;
  }

  body{background:#fff!important;color:#111!important}
  .sheet{box-shadow:none!important}
}


/* V2.2.3 — liseré matière du planning.
   Il est indépendant de border-color afin de rester visible
   en mode clair, sombre et même avec une ancienne feuille en cache. */
.lesson::before{
  background:var(--subject-color,#64748b)!important;
}


/* ==========================================================
   V2.4.2 — mise en valeur visuelle des boutons et sections
   ========================================================== */

/* Barre du haut */
.top{
  box-shadow:0 8px 20px rgba(15,23,42,.06);
  position:sticky;
  top:0;
  z-index:30;
}

/* Navigation */
.nav{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  margin-bottom:16px;
}
.nav .btn{
  background:var(--app-panel-2)!important;
  border-color:var(--app-line)!important;
  font-weight:700;
}
.nav .btn:hover{
  transform:translateY(-1px);
  box-shadow:0 8px 20px rgba(15,23,42,.08);
}

/* Boutons généraux */
.btn{
  transition:transform .12s ease, box-shadow .12s ease, background .12s ease, border-color .12s ease;
  box-shadow:0 1px 0 rgba(255,255,255,.25) inset;
}
.btn:hover{
  transform:translateY(-1px);
  box-shadow:0 10px 18px rgba(15,23,42,.08);
}
.btn:active{
  transform:translateY(0);
}
.btn.primary{
  box-shadow:0 8px 18px rgba(201,108,59,.22)!important;
}
.btn.primary:hover{
  box-shadow:0 12px 24px rgba(201,108,59,.28)!important;
}
.btn.danger{
  background:var(--app-danger-bg)!important;
  border-color:transparent!important;
}
.btn.icon{
  min-width:34px;
  justify-content:center;
  text-align:center;
  font-weight:800;
}

/* Cartes et sections */
.card,
.hero,
.weeks-section,
.table-wrap,
.kpi,
.period-col,
.item,
.planner,
.sheet{
  position:relative;
  overflow:hidden;
}
.card::before,
.hero::before,
.weeks-section::before,
.table-wrap::before,
.kpi::before,
.period-col::before,
.sheet::before{
  content:"";
  position:absolute;
  left:0;
  top:0;
  width:100%;
  height:4px;
  background:linear-gradient(90deg,var(--app-accent),rgba(201,108,59,0));
  opacity:.95;
}

/* Titres de sections */
.card > h1:first-child,
.card > h2:first-child,
.hero > h1:first-child,
.hero > h2:first-child,
.weeks-section > h2:first-child,
.sheet h1:first-child{
  margin-top:0;
  padding-left:12px;
  position:relative;
}
.card > h1:first-child::before,
.card > h2:first-child::before,
.hero > h1:first-child::before,
.hero > h2:first-child::before,
.weeks-section > h2:first-child::before,
.sheet h1:first-child::before{
  content:"";
  position:absolute;
  left:0;
  top:.25em;
  bottom:.25em;
  width:4px;
  border-radius:999px;
  background:var(--app-accent);
}

/* Champs de formulaire */
.field{
  margin-bottom:12px;
}
.field label{
  font-weight:700;
  letter-spacing:.01em;
}
input:focus, select:focus, textarea:focus{
  outline:none;
  border-color:var(--app-accent)!important;
  box-shadow:0 0 0 3px rgba(201,108,59,.15);
}

/* Messages */
.msg, .error, .ok{
  border-left:5px solid currentColor;
  box-shadow:var(--app-shadow);
}

/* Tableaux */
table th{
  font-weight:800;
}
table tbody tr:hover{
  background:rgba(148,163,184,.07);
}

/* KPI more obvious */
.kpi strong{
  display:block;
  margin-bottom:4px;
}

/* Weeks cards */
.week-card{
  border:1px solid var(--app-line)!important;
  box-shadow:0 6px 16px rgba(15,23,42,.05);
}
.week-card::before{
  content:"";
  position:absolute;
  left:0;top:0;right:0;height:4px;
  background:linear-gradient(90deg,var(--app-accent),rgba(201,108,59,0));
}
.week-main .btn.primary{
  font-size:13px;
  padding:10px 12px!important;
}
.week-secondary .btn{
  background:var(--app-panel-2)!important;
}
.week-order{
  box-shadow:0 4px 10px rgba(15,23,42,.08);
}

/* Planner cells */
.lesson,
.day-check,
.empty{
  box-shadow:0 4px 12px rgba(15,23,42,.04);
}
.lesson:hover,
.day-check:hover{
  box-shadow:0 8px 18px rgba(15,23,42,.08);
}

/* Progress table counts */
.count{
  font-weight:800;
}
.covered .count{
  background:rgba(34,197,94,.12)!important;
}

/* Small screens */
@media(max-width:700px){
  .nav .btn{
    font-size:12px;
    padding:7px 9px!important;
  }
  .btn{
    font-size:12px;
  }
}


/* ==========================================================
   V2.4.3 — correction visuelle générale
   ========================================================== */

/* Surface globale plus soignée */
body{
  background:
    radial-gradient(circle at top left, rgba(201,108,59,.06), transparent 30%),
    linear-gradient(180deg, rgba(255,255,255,.12), rgba(255,255,255,0)),
    var(--app-bg) !important;
}

/* Cartes plus lisibles */
.card,
.hero,
.weeks-section,
.table-wrap,
.kpi,
.sheet,
.period-col,
.week-card{
  border-radius:18px !important;
}

/* Boutons : contraste plus affirmé */
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  min-height:42px;
  padding:10px 14px !important;
  border-width:1px !important;
  font-weight:800 !important;
  letter-spacing:.01em;
  color:var(--app-text) !important;
  background:var(--app-panel) !important;
}

.nav .btn{
  background:var(--app-panel) !important;
  border-color:var(--app-line) !important;
  color:var(--app-text) !important;
}

.nav .btn:hover,
.btn:hover{
  filter:none;
}

.btn.primary{
  color:#fff !important;
  background:linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,0)), var(--app-accent) !important;
}

.btn.danger{
  color:var(--app-danger) !important;
  background:var(--app-danger-bg) !important;
}

.btn[disabled],
.btn:disabled{
  opacity:.45 !important;
  cursor:not-allowed;
  box-shadow:none !important;
  transform:none !important;
}

/* Accueil / dashboard */
.dashboard-hero{
  background:
    linear-gradient(135deg, rgba(201,108,59,.11), rgba(201,108,59,0) 50%),
    var(--app-panel) !important;
  border:1px solid var(--app-line) !important;
  border-radius:22px !important;
  padding:26px 24px !important;
  margin-bottom:18px;
  box-shadow:var(--app-shadow);
}
.dashboard-hero h1{
  font-size:clamp(34px, 3vw, 52px);
  line-height:1.03;
  margin:0 0 10px 0;
}
.dashboard-hero p{
  margin:0;
  font-size:16px;
}
.dashboard-subtitle{
  display:block;
  margin-top:8px;
  color:var(--app-muted);
  font-size:15px;
}
.dashboard-badge{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:7px 12px;
  border-radius:999px;
  background:var(--app-soft);
  color:var(--app-text);
  font-size:12px;
  font-weight:800;
  margin-bottom:12px;
}
.dashboard-actions{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  margin-top:22px;
}
.dashboard-actions .btn{
  min-width:190px;
  border-radius:14px !important;
  box-shadow:0 8px 20px rgba(15,23,42,.08);
}
.dashboard-actions .btn.primary{
  min-width:220px;
}

.info-strip{
  display:grid;
  grid-template-columns:repeat(3,minmax(180px,1fr));
  gap:12px;
  margin-top:18px;
}
.info-tile{
  background:var(--app-panel);
  border:1px solid var(--app-line);
  border-radius:16px;
  padding:14px 15px;
  box-shadow:0 6px 16px rgba(15,23,42,.05);
}
.info-tile small{
  display:block;
  color:var(--app-muted);
  margin-bottom:4px;
  font-size:12px;
  font-weight:700;
}
.info-tile strong{
  font-size:17px;
}

/* Titres et sous-textes plus élégants */
.page-lead{
  color:var(--app-muted);
  font-size:15px;
  margin-top:4px;
}

/* Mobile */
@media(max-width:850px){
  .dashboard-actions .btn{
    min-width:0;
    width:100%;
  }
  .info-strip{
    grid-template-columns:1fr;
  }
}


/* ==========================================================
   V2.4.5 — boutons colorés + bouton actif mis en avant
   ========================================================== */

/* Palette fonctionnelle */
.btn.tone-home{
  --tone:#475569; --tone-soft:#eef2f7; --tone-text:#334155; --tone-ring:rgba(71,85,105,.25);
}
.btn.tone-years{
  --tone:#2563eb; --tone-soft:#eaf1ff; --tone-text:#1d4ed8; --tone-ring:rgba(37,99,235,.28);
}
.btn.tone-classes{
  --tone:#16835f; --tone-soft:#e6f6ef; --tone-text:#12694d; --tone-ring:rgba(22,131,95,.28);
}
.btn.tone-setup{
  --tone:#64748b; --tone-soft:#edf1f5; --tone-text:#475569; --tone-ring:rgba(100,116,139,.28);
}
.btn.tone-weeks{
  --tone:#0891b2; --tone-soft:#e3f7fb; --tone-text:#0e7490; --tone-ring:rgba(8,145,178,.28);
}
.btn.tone-planning{
  --tone:#d97706; --tone-soft:#fff3df; --tone-text:#b45309; --tone-ring:rgba(217,119,6,.30);
}
.btn.tone-agenda{
  --tone:#0f766e; --tone-soft:#e2f5f3; --tone-text:#0f5f59; --tone-ring:rgba(15,118,110,.28);
}
.btn.tone-sequences{
  --tone:#db2777; --tone-soft:#fdeaf3; --tone-text:#be185d; --tone-ring:rgba(219,39,119,.28);
}
.btn.tone-programming{
  --tone:#7c3aed; --tone-soft:#f1eafe; --tone-text:#6d28d9; --tone-ring:rgba(124,58,237,.28);
}
.btn.tone-competencies{
  --tone:#4f46e5; --tone-soft:#ececff; --tone-text:#4338ca; --tone-ring:rgba(79,70,229,.28);
}
.btn.tone-progress{
  --tone:#0284c7; --tone-soft:#e5f4fc; --tone-text:#0369a1; --tone-ring:rgba(2,132,199,.28);
}
.btn.tone-demo{
  --tone:#9333ea; --tone-soft:#f5eafd; --tone-text:#7e22ce; --tone-ring:rgba(147,51,234,.28);
}
.btn.tone-schema{
  --tone:#ca8a04; --tone-soft:#fff7d9; --tone-text:#a16207; --tone-ring:rgba(202,138,4,.28);
}
.btn.tone-journal{
  --tone:#0f766e; --tone-soft:#e2f5f3; --tone-text:#0f5f59; --tone-ring:rgba(15,118,110,.28);
}
.btn.tone-logout{
  --tone:#dc2626; --tone-soft:#fdeaea; --tone-text:#b91c1c; --tone-ring:rgba(220,38,38,.28);
}

/* Tous les boutons sémantiques ont une couleur douce au repos */
.btn[class*="tone-"]{
  background:var(--tone-soft)!important;
  color:var(--tone-text)!important;
  border-color:color-mix(in srgb, var(--tone) 35%, transparent)!important;
  box-shadow:0 3px 10px rgba(15,23,42,.05)!important;
}

.btn[class*="tone-"]:hover{
  background:color-mix(in srgb, var(--tone-soft) 72%, var(--tone) 28%)!important;
  border-color:var(--tone)!important;
  color:var(--tone-text)!important;
  box-shadow:0 9px 20px var(--tone-ring)!important;
}

/* Page active : bouton plein et clairement en avant */
.btn.nav-active,
.btn.is-active{
  background:linear-gradient(180deg,rgba(255,255,255,.12),rgba(255,255,255,0)),var(--tone)!important;
  color:#fff!important;
  border-color:var(--tone)!important;
  box-shadow:
    0 10px 24px var(--tone-ring),
    0 0 0 3px color-mix(in srgb,var(--tone) 18%,transparent)!important;
  transform:translateY(-2px);
  position:relative;
  z-index:2;
}

.btn.nav-active:hover,
.btn.is-active:hover{
  color:#fff!important;
  background:var(--tone)!important;
  transform:translateY(-2px);
}

/* Petit témoin sur le bouton actif */
.btn.nav-active::before,
.btn.is-active::before{
  content:"";
  width:7px;
  height:7px;
  flex:0 0 7px;
  border-radius:999px;
  background:#fff;
  box-shadow:0 0 0 3px rgba(255,255,255,.20);
}

/* Les actions métier principales peuvent conserver leur couleur fonctionnelle */
.btn.primary[class*="tone-"]{
  background:var(--tone)!important;
  color:#fff!important;
  border-color:var(--tone)!important;
}

/* Sombre : teintes pastel adaptées */
html[data-theme="dark"] .btn[class*="tone-"]:not(.nav-active):not(.is-active){
  background:color-mix(in srgb,var(--tone) 20%,var(--app-panel))!important;
  color:color-mix(in srgb,var(--tone) 45%,#fff)!important;
  border-color:color-mix(in srgb,var(--tone) 55%,var(--app-line))!important;
}

/* Les boutons d'action dans les cartes restent compacts */
.class-actions .btn[class*="tone-"],
.week-secondary .btn[class*="tone-"]{
  min-height:36px;
}

/* Barre de navigation : active encore plus lisible */
.nav .btn.nav-active{
  font-weight:900!important;
}

/* Le bouton thème reste neutre et ne reçoit pas la palette */
#themeToggle{
  background:var(--app-panel)!important;
  color:var(--app-text)!important;
  border-color:var(--app-line)!important;
}


/* ==========================================================
   V2.5.0 — boutons sans texte gras + couleur Mises à jour
   ========================================================== */
.btn.tone-updates{
  --tone:#0f766e; --tone-soft:#e3f5f2; --tone-text:#0f5f59; --tone-ring:rgba(15,118,110,.28);
}

/* Les boutons restent lisibles par leur couleur et leur relief,
   mais leur texte n'est plus en gras. */
.btn,
a.btn,
button.btn,
.nav .btn,
.nav .btn.nav-active,
.btn.nav-active,
.btn.is-active,
#themeToggle{
  font-weight:500!important;
}


/* V2.6.0 — Référentiel Éducation nationale */
.btn.tone-reference{
  --tone:#2563a6; --tone-soft:#e8f1fb; --tone-text:#1d5a91; --tone-ring:rgba(37,99,166,.28);
}


/* ==========================================================
   V2.6.1 — boutons plus compacts + Utilisateurs
   ========================================================== */
.btn.tone-users{
  --tone:#0f766e; --tone-soft:#e3f5f2; --tone-text:#0f5f59; --tone-ring:rgba(15,118,110,.28);
}

/* Hauteur compacte dans toute l'application. */
.btn,
a.btn,
button.btn{
  min-height:32px!important;
  padding:5px 10px!important;
  line-height:1.2!important;
}

.nav .btn{
  min-height:34px!important;
  padding:6px 10px!important;
}

.week-main .btn.primary,
.dashboard-actions .btn,
.hero-actions .btn{
  min-height:34px!important;
  padding:6px 11px!important;
}

#themeToggle{
  min-height:30px!important;
  padding:5px 9px!important;
}


/* ==========================================================
   V2.7.0 — parcours guidé
   ========================================================== */
.btn.tone-guide{
  --tone:#c96c3b;
  --tone-soft:#fff0e7;
  --tone-text:#a94f22;
  --tone-ring:rgba(201,108,59,.30);
}


/* V2.7.4 — import ancien Planning */
.btn.tone-import{
  --tone:#7c3aed;
  --tone-soft:#f3e8ff;
  --tone-text:#6d28d9;
  --tone-ring:rgba(124,58,237,.28);
}


/* V2.9.1 — actions globales de navigation */
.global-page-actions{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 14px}.nav>[data-gmc-global-actions]{display:contents}
@media(max-width:620px){.global-page-actions .btn{flex:1 1 auto}}


/* ==========================================================
   V2.9.1 — fenêtres modales longues
   La règle générique .card utilise overflow:hidden.
   Une fenêtre modale doit au contraire pouvoir défiler sur
   les écrans dont la hauteur est limitée.
   ========================================================== */
.modal-backdrop .modal-card{
  overflow-y:auto!important;
  overflow-x:hidden!important;
  min-height:0!important;
  max-height:calc(100vh - 32px)!important;
  max-height:calc(100dvh - 32px)!important;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior:contain;
}
@media(max-width:700px){
  .modal-backdrop .modal-card{
    max-height:calc(100vh - 12px)!important;
    max-height:calc(100dvh - 12px)!important;
  }
}


/* ==========================================================
   V2.9.1 — barre de navigation supérieure
   ========================================================== */

/* Une vraie barre d'outils, plus lisible que des liens alignés. */
.nav{
  display:flex!important;
  align-items:center!important;
  gap:7px!important;
  flex-wrap:wrap!important;
  margin:0 0 16px!important;
  padding:8px!important;
  border:1px solid var(--app-line)!important;
  border-radius:14px!important;
  background:color-mix(in srgb,var(--app-panel) 94%,var(--app-soft) 6%)!important;
  box-shadow:0 5px 16px rgba(15,23,42,.06)!important;
}

/* Tous les liens de navigation prennent réellement l'apparence d'un bouton. */
.nav .btn,
.nav a.btn,
.nav button.btn{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:6px!important;
  min-height:36px!important;
  padding:7px 11px!important;
  margin:0!important;
  border:1px solid var(--app-line)!important;
  border-radius:9px!important;
  text-decoration:none!important;
  white-space:nowrap!important;
  line-height:1.15!important;
  font-size:13px!important;
  font-weight:500!important;
  box-shadow:none!important;
}

/* Les couleurs métier restent présentes mais avec un rendu plus discret. */
.nav .btn[class*="tone-"]:not(.nav-active):not(.is-active){
  background:color-mix(in srgb,var(--tone-soft) 78%,var(--app-panel) 22%)!important;
  border-color:color-mix(in srgb,var(--tone) 25%,var(--app-line))!important;
}

/* La page en cours reste identifiable sans le gros halo de l'ancienne version. */
.nav .btn.nav-active,
.nav .btn.is-active{
  transform:none!important;
  background:var(--tone)!important;
  color:#fff!important;
  border-color:var(--tone)!important;
  box-shadow:0 4px 10px var(--tone-ring)!important;
}
.nav .btn.nav-active::before,
.nav .btn.is-active::before{
  width:6px!important;
  height:6px!important;
  flex-basis:6px!important;
  box-shadow:none!important;
}

/* Retour = repère fixe du début de barre. */
.nav .nav-back{
  background:var(--app-panel)!important;
  color:var(--app-text)!important;
  border-color:var(--app-line)!important;
}
.nav .nav-back:hover{
  background:var(--app-panel-2)!important;
}

/* Séparation visuelle légère après les actions globales. */
.nav .nav-global:last-child{
  margin-right:3px!important;
}

/* Même rendu quand une page ne possède pas de .nav native. */
.global-page-actions{
  display:flex!important;
  gap:7px!important;
  flex-wrap:wrap!important;
  align-items:center!important;
  padding:8px!important;
  margin:0 0 16px!important;
  border:1px solid var(--app-line)!important;
  border-radius:14px!important;
  background:var(--app-panel)!important;
  box-shadow:0 5px 16px rgba(15,23,42,.06)!important;
}
.global-page-actions .btn{
  display:inline-flex!important;
  align-items:center!important;
  min-height:36px!important;
  padding:7px 11px!important;
  border-radius:9px!important;
  text-decoration:none!important;
}

html[data-theme="dark"] .nav{
  background:color-mix(in srgb,var(--app-panel) 92%,#000 8%)!important;
  box-shadow:0 6px 18px rgba(0,0,0,.18)!important;
}

@media(max-width:700px){
  .nav{
    gap:5px!important;
    padding:6px!important;
  }
  .nav .btn,
  .nav a.btn,
  .nav button.btn{
    min-height:34px!important;
    padding:6px 9px!important;
    font-size:12px!important;
  }
}


/* ==========================================================
   V2.9.9 — boutons plus agréables, légers et homogènes
   ========================================================== */

.btn,
a.btn,
button.btn{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:7px!important;
  min-height:38px!important;
  padding:8px 13px!important;
  border:1px solid color-mix(in srgb,var(--app-line) 82%, transparent)!important;
  border-radius:11px!important;
  background:linear-gradient(180deg, rgba(255,255,255,.94), rgba(255,255,255,.72)), var(--app-panel)!important;
  color:var(--app-text)!important;
  text-decoration:none!important;
  font-weight:700!important;
  letter-spacing:0!important;
  line-height:1.2!important;
  box-shadow:0 1px 2px rgba(15,23,42,.05), 0 8px 18px rgba(15,23,42,.04)!important;
  transition:transform .12s ease, box-shadow .18s ease, background .18s ease, border-color .18s ease, color .18s ease!important;
}

.btn:hover,
a.btn:hover,
button.btn:hover{
  transform:translateY(-1px)!important;
  border-color:color-mix(in srgb,var(--app-line) 45%, var(--app-accent) 20%)!important;
  background:linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.84)), var(--app-panel-2)!important;
  box-shadow:0 2px 5px rgba(15,23,42,.06), 0 10px 20px rgba(15,23,42,.06)!important;
  text-decoration:none!important;
}

.btn:active,
a.btn:active,
button.btn:active{
  transform:translateY(0)!important;
  box-shadow:0 1px 3px rgba(15,23,42,.08)!important;
}

.btn:focus-visible,
a.btn:focus-visible,
button.btn:focus-visible{
  outline:none!important;
  box-shadow:0 0 0 3px rgba(255,255,255,.85), 0 0 0 5px rgba(201,108,59,.22), 0 8px 18px rgba(15,23,42,.06)!important;
}

.btn.primary{
  background:linear-gradient(180deg, rgba(255,255,255,.12), rgba(255,255,255,0)), var(--app-accent)!important;
  border-color:color-mix(in srgb,var(--app-accent) 82%, #000 8%)!important;
  color:#fff!important;
  box-shadow:0 2px 6px rgba(201,108,59,.16), 0 10px 20px rgba(201,108,59,.16)!important;
}
.btn.primary:hover{
  background:linear-gradient(180deg, rgba(255,255,255,.18), rgba(255,255,255,0)), color-mix(in srgb,var(--app-accent) 90%, #fff 10%)!important;
  border-color:color-mix(in srgb,var(--app-accent) 92%, #000 8%)!important;
  color:#fff!important;
  box-shadow:0 3px 8px rgba(201,108,59,.18), 0 12px 24px rgba(201,108,59,.18)!important;
}

.btn.danger{
  background:linear-gradient(180deg, rgba(255,255,255,.92), rgba(255,255,255,.72)), var(--app-danger-bg)!important;
  border-color:color-mix(in srgb,var(--app-danger) 30%, transparent)!important;
  color:var(--app-danger)!important;
  box-shadow:0 1px 2px rgba(127,29,29,.04), 0 8px 18px rgba(220,38,38,.05)!important;
}
.btn.danger:hover{
  background:linear-gradient(180deg, rgba(255,255,255,.96), rgba(255,255,255,.82)), color-mix(in srgb,var(--app-danger-bg) 88%, #fff 12%)!important;
  border-color:color-mix(in srgb,var(--app-danger) 45%, transparent)!important;
  color:#991b1b!important;
}

.btn[class*="tone-"]{
  background:linear-gradient(180deg, rgba(255,255,255,.95), rgba(255,255,255,.78)), color-mix(in srgb,var(--tone-soft) 74%, var(--app-panel) 26%)!important;
  color:color-mix(in srgb,var(--tone-text) 88%, var(--app-text) 12%)!important;
  border-color:color-mix(in srgb,var(--tone) 24%, var(--app-line))!important;
  box-shadow:0 1px 2px rgba(15,23,42,.05), 0 8px 18px rgba(15,23,42,.04)!important;
}
.btn[class*="tone-"]:hover{
  background:linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.84)), color-mix(in srgb,var(--tone-soft) 68%, var(--tone) 12%, var(--app-panel) 20%)!important;
  color:color-mix(in srgb,var(--tone-text) 92%, #000 8%)!important;
  border-color:color-mix(in srgb,var(--tone) 42%, var(--app-line))!important;
  box-shadow:0 2px 5px rgba(15,23,42,.06), 0 10px 20px var(--tone-ring)!important;
}

.btn.nav-active,
.btn.is-active,
.nav .btn.nav-active,
.nav .btn.is-active{
  background:linear-gradient(180deg, rgba(255,255,255,.12), rgba(255,255,255,0)), var(--tone)!important;
  color:#fff!important;
  border-color:var(--tone)!important;
  box-shadow:0 2px 5px rgba(15,23,42,.08), 0 10px 20px var(--tone-ring)!important;
}

.btn[disabled],
.btn:disabled{
  opacity:.5!important;
  cursor:not-allowed!important;
  transform:none!important;
  box-shadow:none!important;
}

@media(max-width:700px){
  .btn,
  a.btn,
  button.btn{
    min-height:35px!important;
    padding:7px 11px!important;
    border-radius:10px!important;
    font-size:12px!important;
  }
}


/* ==========================================================
   V2.9.10 — boutons sans gras + cahier journal compact
   ========================================================== */

/* Aucun bouton n'utilise de graisse forte, y compris dans les barres de navigation. */
.btn,
a.btn,
button.btn,
.nav .btn,
.nav a.btn,
.nav button.btn,
.global-page-actions .btn,
.class-actions .btn,
.week-secondary .btn,
.dashboard-actions .btn{
  font-weight:500!important;
}

/* Le cahier journal privilégie des actions discrètes et compactes. */
.journal-page .btn,
.journal-page a.btn,
.journal-page button.btn,
.journal-page .nav .btn,
.journal-page .global-page-actions .btn{
  min-height:32px!important;
  padding:5px 9px!important;
  border-radius:8px!important;
  gap:5px!important;
  font-size:11.5px!important;
  font-weight:500!important;
  box-shadow:0 1px 2px rgba(15,23,42,.04), 0 4px 10px rgba(15,23,42,.035)!important;
}

.journal-page .btn:hover,
.journal-page a.btn:hover,
.journal-page button.btn:hover{
  box-shadow:0 1px 3px rgba(15,23,42,.05), 0 6px 12px rgba(15,23,42,.05)!important;
}

/* Le bouton d'action au bout de chaque séance reste très lisible sans dominer la ligne. */
.journal-page .lesson > .btn{
  min-width:78px!important;
  min-height:30px!important;
  padding:5px 8px!important;
  font-size:11px!important;
}

@media(max-width:700px){
  .journal-page .btn,
  .journal-page a.btn,
  .journal-page button.btn{
    min-height:31px!important;
    padding:5px 8px!important;
    font-size:11px!important;
  }
}