/**
 * Thème « Craie & grain » (proposition B) — couleurs de référence.
 * Accents « action » (CTA, barres de progression) : tons A (brun-encre plus clair).
 * Démo complète : frontend/pages/palette-demo.html
 *
 * DA « Carnet lumineux » (aperçu) : frontend/css/da-carnet-lumineux-tokens.css + pages/da-carnet-preview.html
 *
 * Usage : lier cette feuille puis utiliser var(--theme-b-…)
 * ou appliquer la classe .theme-craie-grain sur un ancêtre (hérite des variables).
 */

:root {
  /* Fond & surfaces */
  --theme-b-bg: #faf7f2;
  --theme-b-surface: #ffffff;
  --theme-b-subtle: #f0ebe3;
  --theme-b-page-shell: #e8e6e1;

  /* Texte */
  --theme-b-text: #252320;
  --theme-b-text-muted: #6a645e;

  /* Contours */
  --theme-b-border: #e2ded7;
  --theme-b-border-strong: rgba(63, 52, 40, 0.35);
  --theme-b-tag-border: rgba(58, 48, 38, 0.12);

  /* Primaire structurel B (navigation active, texte sur secondaire, etc.) */
  --theme-b-primary: #3f3428;
  --theme-b-primary-hover: #2e261d;
  --theme-b-on-primary: #fffdfb;

  /* Action A — boutons principaux, progression (hybride validé) */
  --theme-b-action: #6d5d4b;
  --theme-b-action-hover: #5a4c3d;
  --theme-b-on-action: #faf8f5;

  /* Tags */
  --theme-b-tag-bg: #ddd4c8;
  --theme-b-tag-text: #3a3026;

  /* Sauge (DA carnet) — halos, détails ; surchargé par .theme-carnet-lumineux si besoin */
  --theme-b-accent-sage: #7d8b7e;

  /* Succès / complétion */
  --theme-b-success-bg: #d4eadc;
  --theme-b-success-text: #1e4d32;
  --theme-b-success-border: rgba(30, 77, 50, 0.2);

  /* Ombres — bouton principal (action A) */
  --theme-b-btn-shadow: 0 2px 12px rgba(109, 93, 75, 0.28);
  --theme-b-btn-shadow-hover: 0 4px 18px rgba(90, 76, 61, 0.34);

  /* Piste de progression */
  --theme-b-progress-track: rgba(37, 35, 32, 0.08);

  /* Erreurs de formulaire */
  --theme-b-danger: #b42318;
  --theme-b-danger-muted: #c45c54;

  /* Force mot de passe (barre) — tons harmonisés avec le thème */
  --theme-b-strength-1: #b45346;
  --theme-b-strength-2: #c67f2e;
  --theme-b-strength-3: #6b8f6b;
  --theme-b-strength-4: #2f5d40;
}

.theme-craie-grain {
  background-color: var(--theme-b-bg);
  color: var(--theme-b-text);
}