/* ==========================================================================
   light.css — Kai-Signals light mode surface/text variables
   Applied on :root (default). Dark mode overrides are in dark.css.
   ========================================================================== */

:root {
  /* Tells Safari (and other browsers) to use light-mode native form
     control chrome, scrollbars and default selection colours — without
     this the browser guesses from the OS setting regardless of which
     theme is actually active on the page. */
  color-scheme: light;

  /* ── Surfaces ────────────────────────────────────────────────────────── */
  --surface-page:     #F4F5F7;
  --surface-raised:   #FFFFFF;
  --surface-overlay:  #FFFFFF;
  --surface-sunken:   #EAEDF1;
  --surface-subtle:   #EEF1F4;
  --surface-border:   #D0D5DD;
  --surface-hover:    #ECEEF2;

  /* ── Signal kind accent (stripe + lifecycle track) ──────────────────────
     Mirrors mobile's `signalAccent` token set — never red/green.
     Deviation logged: docs/01-architecture.md §11. */
  --signal-accent-entry:    #37ABA8;
  --signal-accent-exit:     #B45309;
  --signal-accent-congress: #6366F1;
  --performance-benchmark:  #6366F1;

  /* ── 9A: price/%gain tint — teal/amber, never red/green ─────────────── */
  --signal-price-entry:    #0F766E;
  --signal-price-exit:     #9A3412;
  --signal-price-congress: #4338CA;

  /* ── 9A: faint per-kind tint for identity block + header chip/pill ──── */
  --signal-tint-entry-block:        #EFF8F8;
  --signal-tint-entry-block-border: #CDEAE9;
  --signal-tint-entry-chip:         #D8EFEC;
  --signal-tint-entry-on-chip:      #0F766E;
  --signal-tint-entry-pill:         #D8EFEC;
  --signal-tint-entry-on-pill:      #0F766E;
  --signal-tint-entry-divider:      #CDEAE9;

  --signal-tint-exit-block:        #F9F1EB;
  --signal-tint-exit-block-border: #ECD4C2;
  --signal-tint-exit-chip:         #F3E3D8;
  --signal-tint-exit-on-chip:      #B45309;
  --signal-tint-exit-pill:         #F3E3D8;
  --signal-tint-exit-on-pill:      #9A3412;
  --signal-tint-exit-divider:      #ECD4C2;

  --signal-tint-congress-block:        #F3F3FE;
  --signal-tint-congress-block-border: #D8D9FC;
  --signal-tint-congress-chip:         #E0E0FF;
  --signal-tint-congress-on-chip:      #4338CA;
  --signal-tint-congress-pill:         #E0E0FF;
  --signal-tint-congress-on-pill:      #4338CA;
  --signal-tint-congress-divider:      #D8D9FC;

  /* ── 9A: Início/Fim lifecycle track inset box ────────────────────────── */
  --track-box-bg:          #F7F9FA;
  --track-box-border:      #EDF0F2;
  --track-base-line:       #DBE0E4;
  --track-empty-dot-border: #CBD2D9;

  /* ── Text ────────────────────────────────────────────────────────────── */
  --text-primary:   #111827;
  --text-secondary: #4B5563;
  --text-tertiary:  #6B7280;
  --text-inverse:   #FFFFFF;
  --text-brand:     var(--color-brand-cta);
  --text-link:      var(--color-brand-teal-strong);
  --text-link-hover: var(--color-brand-teal);

  /* ── Component — button primary ─────────────────────────────────────── */
  --btn-primary-bg:      var(--color-brand-cta);
  --btn-primary-bg-hover: var(--color-brand-cta-hover);
  --btn-primary-text:    #FFFFFF;

  /* ── Component — button secondary ───────────────────────────────────── */
  --btn-secondary-bg:      transparent;
  --btn-secondary-border:  var(--color-brand-teal);
  --btn-secondary-text:    var(--color-brand-teal-strong);
  --btn-secondary-bg-hover: var(--color-brand-teal-muted);

  /* ── Component — card ────────────────────────────────────────────────── */
  --card-bg:      var(--surface-raised);
  --card-border:  var(--surface-border);
  --card-shadow:  0 2px 5px rgba(0, 0, 0, 0.06), 0 6px 16px rgba(0, 0, 0, 0.08);

  /* ── Component — input ───────────────────────────────────────────────── */
  --input-bg:          var(--surface-overlay);
  --input-border:      #CED4DA;
  --input-border-focus: var(--color-brand-teal-strong);
  --input-text:        var(--text-primary);
  --input-placeholder: var(--text-tertiary);
  --select-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8' fill='none'%3E%3Cpath d='M1 1.5L6 6.5L11 1.5' stroke='%23111827' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");

  /* ── Component — navbar ──────────────────────────────────────────────── */
  --nav-bg:        var(--surface-overlay);
  --nav-border:    var(--surface-border);
  --nav-text:      var(--text-primary);
  --nav-text-muted: var(--text-secondary);

  /* ── Component — badge ───────────────────────────────────────────────── */
  --badge-brand-bg:   var(--color-brand-teal-muted);
  --badge-brand-text: var(--color-brand-teal-strong);

  /* ── Component — chip (status pill, e.g. congress trade direction) ──────
     Mirrors mobile's Chip 'info'/'warning' variants exactly. ────────────── */
  --chip-info-bg:      #dbeafe;
  --chip-info-text:    #1e40af;
  --chip-warning-bg:   #fef3c7;
  --chip-warning-text: #92400e;
  --chip-success-bg:   #d1fae5;
  --chip-success-text: #065f46;
  --chip-danger-bg:    #fee2e2;
  --chip-danger-text:  #991b1b;

  /* ── Component — status chip (admin/account status pills — suspended,
     pending, warning, danger). Separate name from --chip-warning-bg/
     --chip-danger-bg above: those are the congress-trade-direction pill and
     collided with these at equal specificity when both lived in tokens.css. */
  --chip-status-warning-bg: #FFF7ED;  --chip-warning-fg:   #C2410C;
  --chip-status-danger-bg:  #FEF2F2;  --chip-danger-fg:    #B91C1C;
  --chip-suspended-bg:      #FEFCE8;  --chip-suspended-fg: #854D0E;
  --chip-pending-bg:        #EFF6FF;  --chip-pending-fg:   #1D4ED8;
}

:root[data-theme="light"] {
  color-scheme: light;

  /* ── Surfaces ────────────────────────────────────────────────────────── */
  --surface-page:     #F4F5F7;
  --surface-raised:   #FFFFFF;
  --surface-overlay:  #FFFFFF;
  --surface-sunken:   #EAEDF1;
  --surface-subtle:   #EEF1F4;
  --surface-border:   #D0D5DD;
  --surface-hover:    #ECEEF2;

  /* ── Signal kind accent (stripe + lifecycle track) ──────────────────────
     Mirrors mobile's `signalAccent` token set — never red/green.
     Deviation logged: docs/01-architecture.md §11. */
  --signal-accent-entry:    #37ABA8;
  --signal-accent-exit:     #B45309;
  --signal-accent-congress: #6366F1;
  --performance-benchmark:  #6366F1;

  /* ── 9A: price/%gain tint — teal/amber, never red/green ─────────────── */
  --signal-price-entry:    #0F766E;
  --signal-price-exit:     #9A3412;
  --signal-price-congress: #4338CA;

  /* ── 9A: faint per-kind tint for identity block + header chip/pill ──── */
  --signal-tint-entry-block:        #EFF8F8;
  --signal-tint-entry-block-border: #CDEAE9;
  --signal-tint-entry-chip:         #D8EFEC;
  --signal-tint-entry-on-chip:      #0F766E;
  --signal-tint-entry-pill:         #D8EFEC;
  --signal-tint-entry-on-pill:      #0F766E;
  --signal-tint-entry-divider:      #CDEAE9;

  --signal-tint-exit-block:        #F9F1EB;
  --signal-tint-exit-block-border: #ECD4C2;
  --signal-tint-exit-chip:         #F3E3D8;
  --signal-tint-exit-on-chip:      #B45309;
  --signal-tint-exit-pill:         #F3E3D8;
  --signal-tint-exit-on-pill:      #9A3412;
  --signal-tint-exit-divider:      #ECD4C2;

  --signal-tint-congress-block:        #F3F3FE;
  --signal-tint-congress-block-border: #D8D9FC;
  --signal-tint-congress-chip:         #E0E0FF;
  --signal-tint-congress-on-chip:      #4338CA;
  --signal-tint-congress-pill:         #E0E0FF;
  --signal-tint-congress-on-pill:      #4338CA;
  --signal-tint-congress-divider:      #D8D9FC;

  /* ── 9A: Início/Fim lifecycle track inset box ────────────────────────── */
  --track-box-bg:          #F7F9FA;
  --track-box-border:      #EDF0F2;
  --track-base-line:       #DBE0E4;
  --track-empty-dot-border: #CBD2D9;

  /* ── Text ────────────────────────────────────────────────────────────── */
  --text-primary:   #111827;
  --text-secondary: #4B5563;
  --text-tertiary:  #6B7280;
  --text-inverse:   #FFFFFF;
  --text-brand:     var(--color-brand-cta);
  --text-link:      var(--color-brand-teal-strong);
  --text-link-hover: var(--color-brand-teal);

  /* ── Component — button primary ─────────────────────────────────────── */
  --btn-primary-bg:      var(--color-brand-cta);
  --btn-primary-bg-hover: var(--color-brand-cta-hover);
  --btn-primary-text:    #FFFFFF;

  /* ── Component — button secondary ───────────────────────────────────── */
  --btn-secondary-bg:      transparent;
  --btn-secondary-border:  var(--color-brand-teal);
  --btn-secondary-text:    var(--color-brand-teal-strong);
  --btn-secondary-bg-hover: var(--color-brand-teal-muted);

  /* ── Component — card ────────────────────────────────────────────────── */
  --card-bg:      var(--surface-raised);
  --card-border:  var(--surface-border);
  --card-shadow:  0 2px 5px rgba(0, 0, 0, 0.06), 0 6px 16px rgba(0, 0, 0, 0.08);

  /* ── Component — input ───────────────────────────────────────────────── */
  --input-bg:          var(--surface-overlay);
  --input-border:      #CED4DA;
  --input-border-focus: var(--color-brand-teal-strong);
  --input-text:        var(--text-primary);
  --input-placeholder: var(--text-tertiary);
  --select-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8' fill='none'%3E%3Cpath d='M1 1.5L6 6.5L11 1.5' stroke='%23111827' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");

  /* ── Component — navbar ──────────────────────────────────────────────── */
  --nav-bg:        var(--surface-overlay);
  --nav-border:    var(--surface-border);
  --nav-text:      var(--text-primary);
  --nav-text-muted: var(--text-secondary);

  /* ── Component — badge ───────────────────────────────────────────────── */
  --badge-brand-bg:   var(--color-brand-teal-muted);
  --badge-brand-text: var(--color-brand-teal-strong);

  /* ── Component — chip (status pill, e.g. congress trade direction) ──────
     Mirrors mobile's Chip 'info'/'warning' variants exactly. ────────────── */
  --chip-info-bg:      #dbeafe;
  --chip-info-text:    #1e40af;
  --chip-warning-bg:   #fef3c7;
  --chip-warning-text: #92400e;
  --chip-success-bg:   #d1fae5;
  --chip-success-text: #065f46;
  --chip-danger-bg:    #fee2e2;
  --chip-danger-text:  #991b1b;

  /* ── Component — status chip (admin/account status pills — suspended,
     pending, warning, danger). Separate name from --chip-warning-bg/
     --chip-danger-bg above: those are the congress-trade-direction pill and
     collided with these at equal specificity when both lived in tokens.css. */
  --chip-status-warning-bg: #FFF7ED;  --chip-warning-fg:   #C2410C;
  --chip-status-danger-bg:  #FEF2F2;  --chip-danger-fg:    #B91C1C;
  --chip-suspended-bg:      #FEFCE8;  --chip-suspended-fg: #854D0E;
  --chip-pending-bg:        #EFF6FF;  --chip-pending-fg:   #1D4ED8;
}