/* =============================================================================
   مرجع اعتیاد — Design Tokens
   -----------------------------------------------------------------------------
   Same semantic-alias structure as farasai-web's design-tokens.css (--bg, --fg1/2/3,
   --accent, --border, --surface, --link, ...) so the shared block library and
   soledit-document.css plug in the same way. Values are new: a calm, hopeful,
   non-clinical palette (deep blue + warm amber) distinct from farasai's teal-on-cream.
   See docs/superpowers/specs/2026-07-19-etiyad-web-design.md §6.
   ============================================================================= */

:root {
  /* ── Surfaces ──────────────────────────────────────────────────────── */
  --etd-bg:              #f7f8fb;
  --etd-bg-elevated:     #ffffff;
  --etd-bg-alt:          #eef1f7;
  --etd-bg-warm:         #fdf6ec;

  /* ── Borders ───────────────────────────────────────────────────────── */
  --etd-border:          #dde2ea;
  --etd-border-strong:   #c3cad6;

  /* ── Ink scale ─────────────────────────────────────────────────────── */
  --etd-ink:             #1c2333;
  --etd-ink-muted:       #5b6478;
  --etd-body:            #333b4d;

  /* ── Brand accents ─────────────────────────────────────────────────── */
  --etd-accent:          #2f5c8a;  /* deep calm blue — primary */
  --etd-accent-hover:    #244a70;
  --etd-warm:            #d97a3f;  /* warm amber — hope/support accent, used sparingly */
  --etd-warm-hover:      #bf6530;

  /* ── Semantic state ────────────────────────────────────────────────── */
  --etd-success:         #3d8b63;
  --etd-danger:          #b3453f;

  /* ── Inverted chrome (footer) ─────────────────────────────────────── */
  --etd-ink-900:         #161b26;

  /* ── Radii ─────────────────────────────────────────────────────────── */
  --etd-radius-sm:       0.375rem;
  --etd-radius-md:       0.625rem;
  --etd-radius-lg:       1rem;

  /* ── Spacing ───────────────────────────────────────────────────────── */
  --etd-section-py:      clamp(3rem, 7vw, 5.5rem);
  --etd-content-max:     64rem;

  /* ── Type ──────────────────────────────────────────────────────────── */
  --etd-font-en:         ui-sans-serif, system-ui, -apple-system, 'Segoe UI', sans-serif;
  --etd-font-fa:         'Vazir', Tahoma, 'Segoe UI', sans-serif;

  /* ── Semantic aliases — reach for these first ─────────────────────── */
  --bg:            var(--etd-bg);
  --bg-alt:        var(--etd-bg-alt);
  --bg-warm:       var(--etd-bg-warm);
  --surface:       var(--etd-bg-elevated);

  --fg1:           var(--etd-ink);
  --fg2:           var(--etd-body);
  --fg3:           var(--etd-ink-muted);
  --fg-on-invert:  #f7f8fb;

  --border:        var(--etd-border);
  --border-strong: var(--etd-border-strong);

  --accent:        var(--etd-accent);
  --accent-hover:  var(--etd-accent-hover);
  --link:          var(--etd-accent);
  --link-hover:    var(--etd-accent-hover);

  --sans-body:     var(--etd-font-en);
  --sans-fa:       var(--etd-font-fa);
}

html.dark {
  --bg:            #10131c;
  --bg-alt:        #171b26;
  --bg-warm:       #1b1710;
  --surface:       #1c2130;

  --fg1:           #eef1f7;
  --fg2:           #cbd2e0;
  --fg3:           #8b93a7;

  --border:        #2c3242;
  --border-strong: #3a4155;

  --accent:        #7fa8d6;
  --accent-hover:  #a4c3e6;
  --link:          #7fa8d6;
  --link-hover:    #a4c3e6;

  --soledit-text:       #eef1f7;
  --soledit-text-muted: #8b93a7;
  --soledit-link:       #7fa8d6;
  --soledit-link-hover: #a4c3e6;
}

:root[dir="rtl"] {
  --soledit-font-body: var(--sans-fa);
  --soledit-font-display: var(--sans-fa);
}