/* ============================================================
 * farpa DS · component tokens · v1.0.0
 * ------------------------------------------------------------
 * Tokens específicos por componente · referenciam semantic.
 * Componentes usam ESTAS variáveis quando precisam de granularidade.
 * ============================================================ */

:root {
  /* ---------- Button ---------- */
  --btn-bg:           var(--accent);
  --btn-fg:           var(--accent-fg);
  --btn-bg-hover:     var(--accent-strong);
  --btn-bg-active:    var(--c-blood-900);
  --btn-bg-disabled:  var(--bg-strong);
  --btn-border:       transparent;
  --btn-radius:       var(--r-3);
  --btn-padding-x:    var(--sp-5);
  --btn-padding-y:    var(--sp-3);

  /* Button secondary (outline) */
  --btn-secondary-bg:        transparent;
  --btn-secondary-fg:        var(--fg);
  --btn-secondary-border:    var(--border-strong);
  --btn-secondary-bg-hover:  var(--bg-subtle);

  /* ---------- Input ---------- */
  --input-bg:           var(--bg);
  --input-fg:           var(--fg);
  --input-border:       var(--border);
  --input-border-focus: var(--border-focus);
  --input-radius:       var(--r-2);
  --input-padding-x:    var(--sp-3);
  --input-padding-y:    var(--sp-2);
  --input-shadow-focus: var(--focus-ring);

  /* ---------- Card ----------
   * v1.1.0 · 2026-05-10 · Nicole: 4px (não 12px) · zero shadow default. */
  --card-bg:        var(--bg);
  --card-border:    var(--border);
  --card-radius:    var(--r-2);
  --card-padding:   var(--sp-5);
  --card-shadow:    none;

  /* ---------- Nav ---------- */
  --nav-bg:           var(--bg);
  --nav-fg:           var(--fg);
  --nav-border:       var(--border);
  --nav-link-hover:   var(--accent);
  --nav-height:       4rem;

  /* ---------- Footer ---------- */
  --footer-bg:        var(--bg-subtle);
  --footer-fg:        var(--fg-soft);
  --footer-border:    var(--border);

  /* ---------- Modal ---------- */
  --modal-bg:           var(--bg);
  --modal-fg:           var(--fg);
  --modal-border:       var(--border);
  --modal-radius:       var(--r-5);
  --modal-shadow:       var(--shadow-xl);
  --modal-overlay:      rgba(26, 26, 26, 0.55);
  --modal-padding:      var(--sp-6);

  /* ---------- Toast ---------- */
  --toast-bg:           var(--fg);
  --toast-fg:           var(--fg-inverse);
  --toast-radius:       var(--r-3);
  --toast-shadow:       var(--shadow-lg);
  --toast-padding:      var(--sp-3) var(--sp-4);

  /* ---------- Lang switcher ---------- */
  --lang-bg:            transparent;
  --lang-fg:            var(--fg-soft);
  --lang-fg-active:     var(--accent);
  --lang-radius:        var(--r-2);

  /* ---------- HC Toggle ---------- */
  --hc-toggle-bg:       var(--bg-subtle);
  --hc-toggle-fg:       var(--fg);
  --hc-toggle-border:   var(--border-strong);
  --hc-toggle-radius:   var(--r-full);
}