/* ============================================================================
   SRH ALOQOD — صرح العقود للعقارات
   tokens.css · colour layer
   ----------------------------------------------------------------------------
   Primitives are the ONLY place a colour literal may appear. Everything else
   in the system references a semantic token, never a primitive directly and
   never a raw hex.

   The three base colours were sampled from the approved Arabic logotype and
   are frozen. The three superseded values from the previous system are void.

   Contrast figures in comments are measured WCAG 2.1 ratios, not estimates.
   AA thresholds: 4.5 body text · 3.0 large text and non-text UI.
   ========================================================================= */

:root {
  /* ==========================================================================
     1 · PRIMITIVES
     15 approved steps. Do not add, remove or re-derive.
     ====================================================================== */

  /* --- Sand · the dominant surface family ------------------------------- */
  --sand-100: #F0E8E3;   /* BASE — sampled from the logotype */
  --sand-200: #E7DED8;
  --sand-400: #D6CAC1;
  --sand-600: #C1B2A6;
  --sand-800: #9E8B7A;

  /* --- Ink · structure and type ----------------------------------------- */
  --ink-600:  #5C4846;
  --ink-700:  #3F302E;
  --ink-800:  #2F1C1B;   /* BASE — sampled from the logotype */
  --ink-900:  #1C100F;

  /* --- Accent · limited emphasis ---------------------------------------- */
  /* 100–300 re-derived by mixing the base toward sand in Lab space:
     no channel clipping, hue drift <= 0.5deg, even ~17 dE steps.         */
  --accent-100: #F3D7CB;
  --accent-200: #F5B9A1;
  --accent-300: #F29B78;
  --accent-600: #E25A26;  /* BASE — sampled from the logotype */
  --accent-700: #BF4A1E;
  --accent-800: #983A17;


  /* ==========================================================================
     2 · SEMANTIC TOKENS
     Roles. Application code consumes these, not the primitives above.
     ====================================================================== */

  /* --- Surface ----------------------------------------------------------- */
  --surface-default: var(--sand-100);   /* page ground; ~86% of any layout   */
  --surface-subtle:  var(--sand-200);   /* cards, inputs, secondary panels   */
  --surface-hover:   var(--sand-400);   /* row and surface hover             */
  --surface-accent:  var(--accent-100); /* notices, tags · ink-800 = 11.82   */
  --surface-accent-hover: var(--accent-200); /* hover of surface-accent      */
  --surface-inverse: var(--ink-900);    /* filled dark fields                */

  /* --- Border ------------------------------------------------------------ */
  --border-subtle:  var(--sand-600);    /* 1.70 — visual dividers ONLY       */
  --border-default: var(--sand-800);    /* 2.46 — cards, resting inputs      */
  --border-strong:  var(--ink-700);     /* 9.46 — the only AA-safe UI border */
  --border-accent:  var(--accent-300);  /* 1.78 — decorative, never a state  */

  /* --- Text -------------------------------------------------------------- */
  --text-primary:    var(--ink-800);    /* 13.32 on surface-default          */
  --text-secondary:  var(--ink-700);    /* 10.37                             */
  --text-muted:      var(--ink-600);    /*  7.03 — lowest AA-safe ink        */
  --text-disabled:   var(--sand-800);   /*  2.70 — WCAG exempts disabled     */
  --text-link:       var(--accent-800); /*  5.88 — accent-600 would be 3.03  */
  --text-on-inverse: var(--sand-100);   /* 15.35 on surface-inverse          */
  --text-on-accent:  var(--ink-800);    /* 11.82 on surface-accent           */

  /* --- Action ------------------------------------------------------------ */
  /* The label colour flips with state: ink reads on the mid accent, sand
     reads on the dark ones. This is a semantic swap, not a new colour.     */
  --action-primary:  var(--accent-600); /* default fill                      */
  --action-hover:    var(--accent-700); /* hover fill                        */
  --action-active:   var(--accent-800); /* active / pressed fill             */
  --action-text:     var(--ink-900);    /*  5.06 on action-primary   · AA    */
  --action-text-alt: var(--sand-100);   /*  4.12 hover · 5.88 active         */

  /* --- Focus ------------------------------------------------------------- */
  /* ink-800 rather than accent-600: an accent ring drops to 2.69 over
     surface-accent and disappears. Ink holds everywhere.                   */
  --focus-ring: var(--ink-800);         /* 4.39 over accent · 13.32 on sand  */
  /* ink cannot be seen on ink: the ring drops to 1.15 over surface-inverse. */
  --focus-ring-inverse: var(--sand-100);/* 15.35 on surface-inverse          */
}


/* ============================================================================
   3 · GUARD RAILS
   ----------------------------------------------------------------------------
   · No colour literal outside the primitives block.
   · accent-600 is never text on sand (3.03) — use --text-link.
   · border-subtle never marks an interactive state (1.70) — use border-strong.
   · There is no surface lighter than --surface-default by design; raise a
     card with --surface-subtle plus a border, not with a lighter fill.
   · Elevation and shadow are deferred to a later stage and are not colours.
   · Component CSS lives in components.css, never here. This file defines
     primitives and roles only; earlier applied patterns were moved out so
     the two files cannot compete in the cascade.
   · The SRH ALOQOD master logotype is frozen and unaffected by this file.
   ========================================================================= */