/* =============================================================
   COLORS — Manoella Melim
   Warm neutral palette. Five official tones, no pure black/white.
   ============================================================= */

:root {
  /* ---- Base palette (official, exact values) ---- */
  --mm-soft-violet: #e7e3df;   /* creme claro  — lightest surface   */
  --mm-westar:      #cec8bf;   /* bege quente claro — alt surface   */
  --mm-mud-puddle:  #b5b1aa;   /* greige neutro — hairlines         */
  --mm-goat:        #968377;   /* taupe / mocha — warm accent       */
  --mm-pine-cone:   #313436;   /* grafite quase preto — text/dark   */

  /* ---- Tints & shades derived from the base tones (oklch-tuned) ---- */
  --mm-soft-violet-deep: #ddd8d2; /* hover wash on light surfaces */
  --mm-goat-deep:        #7f6e63; /* darker accent (decorative)   */
  --mm-goat-deeper:      #6e5d50; /* deep taupe — AA text & text-bearing accent fill (4.9:1) */
  --mm-goat-deepest:     #5d4e44; /* darkest mocha — pressed fills/text (AA 6.2:1) */
  --mm-goat-soft:        #a89789; /* lighter accent, disabled     */
  --mm-mud-puddle-deep:  #5f5d58; /* deep greige — captions (AA contrast) */
  --mm-pine-cone-soft:   #4a4d4f; /* secondary text on dark       */

  /* ====== SEMANTIC ROLES ====== */

  /* Surfaces */
  --surface-base:    var(--mm-soft-violet);  /* page background        */
  --surface-alt:     var(--mm-westar);       /* alternating sections   */
  --surface-card:    var(--mm-soft-violet);  /* cards (flat, no shadow)*/
  --surface-inverse: var(--mm-pine-cone);    /* dark inverted sections */
  --surface-accent:  var(--mm-goat-deeper);  /* text-bearing accent blocks (AA) */

  /* Text */
  --text-primary:    var(--mm-pine-cone);    /* body & headings        */
  --text-secondary:  var(--mm-goat-deeper);  /* supporting / meta (AA 4.9:1) */
  --text-caption:    var(--mm-mud-puddle-deep);   /* captions, fine print   */
  --text-on-dark:    var(--mm-soft-violet);  /* text over inverse      */
  --text-on-accent:  var(--mm-soft-violet);  /* text over goat blocks  */

  /* Lines & borders (hairline system) */
  --border-hairline: var(--mm-mud-puddle);   /* 1px separators         */
  --border-strong:   var(--mm-goat);         /* emphasised border      */
  --border-on-dark:  rgba(231, 227, 223, 0.28);

  /* Interaction */
  --accent:          var(--mm-goat);         /* decorative accent: borders, underlines, non-text fills */
  --accent-text:     var(--mm-goat-deeper);  /* accent used AS foreground text/icon on light (AA 4.9:1) */
  --accent-fill:     var(--mm-goat-deeper);  /* accent fill that carries light text (hover, selected) */
  --accent-hover:    var(--mm-goat-deep);
  --accent-pressed:  var(--mm-goat-deepest); /* darker than hover fill; AA as fill or text */
  --hover-wash:      var(--mm-soft-violet-deep);
  --focus-ring:      var(--mm-pine-cone);    /* strong, square focus outline (9.8:1 on light) */

  /* Status (kept muted & warm — no candy colors) */
  --status-positive: #6f7a5e;
  --status-warning:  #b08a4e;
  --status-danger:   #9a5c50;  /* underline / state indicator (4.1:1) */
  --text-danger:     #8a4f44;  /* error MESSAGE text — deeper, AA 5.0:1 */
}