/* Sama Correction 3.0 — style « Cahier »
   Le langage visuel de la page d'accueil appliqué à toute la plateforme :
   papier réglé Seyès, marge corail, titres Space Grotesk soulignés au stylo,
   cartes blanches arrondies et ombrées, boutons sarcelle lumineux, bandes ardoise.
   Couche « cahier » : passe après les styles de pages, avant les utilitaires. */

@layer cahier{
  :root{
    --sc-r:16px;--sc-r-l:22px;--sc-r-xl:32px;
    --sc-ombre:0 1px 2px rgba(18,32,43,.04),0 12px 30px -20px rgba(18,32,43,.28);
    --sc-ombre-haute:0 30px 60px -24px rgba(18,32,43,.35),0 2px 6px rgba(18,32,43,.06);
    --sc-ombre-bouton:0 12px 24px -12px rgba(11,110,99,.7);
    --sc-seyes:repeating-linear-gradient(0deg,transparent 0 31px,rgba(11,110,99,.14) 31px 32px),repeating-linear-gradient(0deg,transparent 0 7px,rgba(11,110,99,.05) 7px 8px);
    --sc-seyes-doux:repeating-linear-gradient(0deg,transparent 0 31px,rgba(11,110,99,.10) 31px 32px);
    --sc-marge-corail:rgba(194,65,12,.45);
    --sc-souligne:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 300 18' preserveAspectRatio='none'%3E%3Cpath d='M3 12 C 70 4, 150 3, 297 9' fill='none' stroke='%23C2410C' stroke-width='5' stroke-linecap='round'/%3E%3C/svg%3E");
  }

  /* ---------- Typographie ---------- */
  h1,h2,h3,.sc-titre{font-family:var(--sc-police-titre);letter-spacing:-.02em}
  h1{letter-spacing:-.03em}
  .sc-souligne,h1 em,.sc-page-head h1 em{font-style:normal;color:var(--sc-sarcelle);background:var(--sc-souligne) left bottom/100% .28em no-repeat;padding-bottom:.1em}
  .sc-kicker,.sc-surtitre{font:600 var(--sc-t-13)/1.3 var(--sc-police);letter-spacing:.08em;text-transform:uppercase;color:var(--sc-sarcelle)}

  /* ---------- En-tête de page : une feuille de copie ---------- */
  .sc-page-head{position:relative;align-items:center;padding:28px 32px 28px 60px;margin-bottom:28px;background-color:var(--sc-surface);background-image:var(--sc-seyes);border:1px solid var(--sc-ligne);border-radius:var(--sc-r-l);box-shadow:var(--sc-ombre);overflow:hidden}
  .sc-page-head::before{content:"";position:absolute;top:0;bottom:0;left:38px;width:2px;background:var(--sc-marge-corail)}
  .sc-page-head h1{font-size:clamp(28px,3vw,40px);line-height:1.08}
  .sc-page-head p{font-size:var(--sc-t-16);color:#3E4954;max-width:68ch}
  .sc-page-head .sc-actions{position:relative}
  @media (max-width:640px){
    .sc-page-head{padding:22px 18px 22px 40px;border-radius:18px}
    .sc-page-head::before{left:24px}
  }

  /* ---------- Cartes, indicateurs, tableaux ---------- */
  .sc-card,.bo-panel,.bo-table-card,.bo-form-card,.sc-card-details,.sc-details,details.sc-long-panel{border-radius:var(--sc-r-l);border-color:var(--sc-ligne);box-shadow:var(--sc-ombre)}
  .sc-card-head h2,.bo-panel-head h2{font:600 20px/1.25 var(--sc-police-titre);letter-spacing:-.02em}
  .sc-stat,.bo-kpi,.sc-indicateur{position:relative;border-radius:20px;box-shadow:var(--sc-ombre);padding:22px}
  .sc-stat strong,.bo-kpi strong,.sc-indicateur strong{font:700 34px/1.05 var(--sc-police-titre);letter-spacing:-.02em}
  .sc-table-wrap,.sc-table-scroll,.bo-table-wrap{border-radius:20px;box-shadow:var(--sc-ombre)}
  .sc-table th,.bo-table th{letter-spacing:.06em;text-transform:uppercase;background:var(--sc-surface-2)}
  .sc-table tbody tr:hover,.bo-table tbody tr:hover{background:var(--sc-sarcelle-clair)}

  /* Tableaux en cartes sur téléphone : l'ancienne largeur minimale (760 px) masquait les valeurs */
  @media (max-width:767px){.sc-table-cartes{min-width:0}}

  /* ---------- Boutons ---------- */
  .sc-btn,.bo-btn{border-radius:12px;min-height:46px;padding:0 20px;font-weight:600;transition:transform .15s ease,box-shadow .15s ease,background-color .15s ease}
  .sc-btn:not(.sc-btn-secondary):not(.sc-btn-danger):not([disabled]),.bo-btn-primary{box-shadow:var(--sc-ombre-bouton)}
  .sc-btn:not([disabled]):hover,.bo-btn:not([disabled]):hover{transform:translateY(-1px)}
  .sc-btn-secondary,.bo-btn-ghost,.bo-btn-soft{background:var(--sc-surface);border:1.5px solid #CFCBC1;box-shadow:none}
  .sc-btn-sm{min-height:38px;padding:0 14px;border-radius:10px}
  .sc-btn-lg{min-height:54px;padding:0 26px;font-size:var(--sc-t-16)}
  .sc-btn-sm:not(.sc-btn-secondary){box-shadow:0 8px 16px -10px rgba(11,110,99,.7)}
  @media (prefers-reduced-motion:reduce){.sc-btn,.bo-btn{transition:none}.sc-btn:hover,.bo-btn:hover{transform:none}}

  /* ---------- Formulaires ---------- */
  .sc-input,.sc-form input:not([type=checkbox]):not([type=radio]):not([type=file]):not([type=hidden]),.sc-form select,.sc-form textarea,.sc-field input:not([type=checkbox]):not([type=radio]):not([type=file]),.sc-field select,.sc-field textarea,.bo-input{border-radius:12px;min-height:48px;border:1.5px solid var(--sc-ligne-forte);background:var(--sc-surface)}
  .sc-form textarea,.sc-field textarea{min-height:110px}
  .sc-input:focus,.sc-form input:focus,.sc-form select:focus,.sc-form textarea:focus,.sc-field input:focus,.sc-field select:focus,.sc-field textarea:focus{border-color:var(--sc-sarcelle);box-shadow:0 0 0 4px rgba(11,110,99,.14);outline:0}

  /* ---------- Pastilles, alertes, états vides ---------- */
  .sc-badge,.sc-chip,.sc-status,.bo-status,.sc-source-chip,.sc-ai-chip,.sc-pedagogy-chip,.sc-mini-status{border-radius:999px;padding:5px 11px;font-weight:600}
  .sc-alert,.sc-inline-note,.sc-inline-notice,.sc-context-tip{border-radius:14px}
  .sc-empty,.bo-empty{position:relative;background-color:var(--sc-surface);background-image:var(--sc-seyes-doux);border:1.5px dashed var(--sc-ligne-forte);border-radius:20px;color:var(--sc-gris)}
  .sc-empty h2,.sc-empty h3,.sc-empty strong{font-family:var(--sc-police-titre);color:var(--sc-encre)}

  /* ---------- Progression et étapes ---------- */
  .sc-progress{border-radius:999px;background:var(--sc-papier-fonce)}
  .sc-progress>i,.sc-progress>span{border-radius:999px;background:var(--sc-sarcelle)}
  .sc-workflow-step{border-top-width:5px;border-radius:2px}

  /* ---------- Fenêtres ---------- */
  .sc-confirm-dialog,.sc-modal-dialog,.sc-processing-card,.sc-auth-card{border-radius:var(--sc-r-l);box-shadow:var(--sc-ombre-haute)}
  .sc-menu-actions-liste,.sc-compte-menu{border-radius:16px;box-shadow:var(--sc-ombre-haute)}

  /* ---------- Gabarit de l'application ---------- */
  .sc-app-haut{background:color-mix(in srgb,var(--sc-papier) 88%,transparent);backdrop-filter:saturate(1.4) blur(10px);-webkit-backdrop-filter:saturate(1.4) blur(10px);border-bottom:1px solid var(--sc-ligne)}
  .sc-recherche input{border-radius:12px}
  .sc-app-nav a{border-radius:10px}

  /* ---------- Pages publiques : tout le fond est une copie ---------- */
  body.sc-public{background-color:var(--sc-papier);background-image:var(--sc-seyes);background-attachment:fixed}
  body.sc-public:not(.sc-page-accueil)::before{content:"";position:fixed;top:0;bottom:0;left:max(16px,calc(50% - 628px));width:2px;background:var(--sc-marge-corail);pointer-events:none;z-index:0}
  body.sc-public .sc-app{position:relative;z-index:1;background:transparent}
  body.sc-public .sc-app-contenu{background:transparent;min-height:calc(100dvh - 84px);display:flex;flex-direction:column}
  body.sc-public .sc-app-contenu>.sc-pied{margin-top:auto}
  body.sc-public .sc-auth-wrap,body.sc-public .sc-auth-page,body.sc-public main{background-color:transparent}
  .sc-public-haut{max-width:1280px;padding:20px 40px}
  .sc-public-haut .sc-app-marque span{font:600 21px/1.2 var(--sc-police-titre)}
  .sc-public-haut .sc-app-marque svg{width:40px;height:40px}
  .sc-public-haut .sc-lien-connexion{color:var(--sc-encre);font-weight:500;text-decoration:none}
  body.sc-public .sc-pied{background:var(--sc-ardoise);color:#A9B4BE;border-top:0;padding:28px max(24px,calc(50% - 600px))}
  body.sc-public .sc-pied a{color:#E3E8EC}
  @media (max-width:760px){.sc-public-haut nav{display:none}.sc-public-haut{padding:16px 20px;flex-wrap:nowrap}body.sc-public::before{left:10px}}
  @media (max-width:520px){
    .sc-public-haut{gap:10px}
    .sc-public-haut .sc-app-marque span{font-size:17px;white-space:nowrap}
    .sc-public-haut .sc-app-marque svg{width:32px;height:32px}
    .sc-public-haut .sc-actions{flex-wrap:nowrap;gap:10px;font-size:14px}
    .sc-public-haut .sc-btn{min-height:40px;padding:0 12px;font-size:14px;white-space:nowrap}
    .sc-public-haut .sc-lien-connexion{white-space:nowrap;display:inline-flex;align-items:center;min-height:44px;padding:0 14px;border:1.5px solid #CFCBC1;border-radius:12px;background:#fff;font-weight:600}
    .sc-public-haut .sc-lien-connexion+.sc-btn{display:none}
  }

  /* Connexion / inscription : formulaire posé sur la copie, panneau ardoise */
  .sc-connexion-formulaire{background:transparent}
  .sc-connexion-formulaire>div{background:var(--sc-surface);border:1px solid var(--sc-ligne);border-radius:var(--sc-r-l);box-shadow:var(--sc-ombre-haute);padding:clamp(24px,4vw,40px)}
  .sc-connexion-formulaire h1{font-size:clamp(30px,3.4vw,42px)}
  .sc-connexion-aside{background-color:var(--sc-ardoise);background-image:repeating-linear-gradient(0deg,transparent 0 31px,rgba(255,255,255,.05) 31px 32px)}
  .sc-connexion-aside h2{font-family:var(--sc-police-titre);letter-spacing:-.025em}
  .sc-onglets-auth{border-radius:14px}

  /* ---------- Illustrations (version B « En images ») ---------- */
  .sc-illustration{display:block;width:100%;height:auto;border-radius:22px;background:#E7D6BA;box-shadow:0 24px 50px -28px rgba(18,32,43,.45)}
  /* États vides avec titre : illustration au-dessus du message */
  .sc-empty:has(>h2,>h3)::before{content:"";display:block;width:min(300px,80%);aspect-ratio:560/400;margin:0 auto 20px;border-radius:18px;background:#E7D6BA url("../img/illustrations/bureau.0f7eadf93bb7.svg") center/cover no-repeat;box-shadow:0 20px 40px -26px rgba(18,32,43,.45)}
  /* Cartes d'authentification (mot de passe, vérification, double authentification) : bandeau illustré */
  .sc-auth-card{overflow:hidden}
  .sc-auth-card::before{content:"";display:block;height:150px;margin:calc(-1 * var(--sc-e-8)) calc(-1 * var(--sc-e-8)) var(--sc-e-6);background:#DCE9E5 url("../img/illustrations/ordinateur.cff742091903.svg") center 38%/cover no-repeat;border-bottom:1px solid var(--sc-ligne)}
  /* En-têtes de pages publiques : image à droite */
  .sc-page-head:has(.sc-page-illustration){flex-wrap:nowrap}
  .sc-page-head:has(.sc-page-illustration)>div:first-child{flex:1 1 auto}
  .sc-page-head .sc-page-illustration{flex:0 0 clamp(150px,22%,240px);position:relative}
  .sc-page-head .sc-page-illustration img{display:block;width:100%;height:auto;border-radius:16px;box-shadow:0 18px 36px -22px rgba(18,32,43,.45)}
  @media (max-width:900px){.sc-page-head .sc-page-illustration{display:none}}
  /* Panneau de connexion : image du bureau */
  .sc-connexion-image{display:block;width:100%;max-width:440px;height:auto;border-radius:22px;box-shadow:0 30px 60px -30px rgba(0,0,0,.6)}
  /* Pages d'erreur */
  .sc-erreur{max-width:1080px;margin:0 auto;padding:clamp(32px,6vw,72px) clamp(20px,4vw,40px);display:flex;flex-wrap:wrap;align-items:center;gap:48px}
  .sc-erreur>div{flex:1 1 380px;min-width:0;display:flex;flex-direction:column;gap:18px}
  .sc-erreur>.sc-erreur-image{flex:1 1 420px}
  .sc-erreur h1{font-size:clamp(34px,4.6vw,52px);line-height:1.06}
  .sc-erreur p{font-size:18px;line-height:1.6;color:#3E4954}
  .sc-erreur-code{font:700 clamp(64px,10vw,120px)/1 var(--sc-police-titre);color:var(--sc-corail);letter-spacing:-.04em}

  kbd{display:inline-block;min-width:1.6em;padding:0 5px;border:1px solid var(--sc-ligne-forte);border-bottom-width:2px;border-radius:6px;background:var(--sc-surface);font:600 12px/1.6 var(--sc-police);text-align:center;color:var(--sc-encre)}
}
