/* ==============================================
   PEDIDOLINK - DESIGN TOKENS
   ============================================== */

:root {
  /* Listas nativas (select, date, etc.) seguem tema escuro como o restante do site */
  color-scheme: dark;

  /* ── Brand Colors ── */
  --brand:          #C8420F;
  --brand-light:    #E85D26;
  --brand-hover:    #F06A30;
  --brand-glow:     rgba(200, 66, 15, 0.25);
  --brand-border:   rgba(200, 66, 15, 0.45);

  /* Purple do logo */
  --purple:         #6B21A8;
  --purple-light:   #9B5EC7;
  --purple-mid:     rgba(107, 33, 168, 0.32);
  --purple-glow:    rgba(107, 33, 168, 0.22);

  /* Teal accent glassmorphism */
  --teal:           #00C8D4;
  --teal-light:     #2AEAF5;
  --teal-glow:      rgba(0, 200, 212, 0.16);

  /* ── Backgrounds - midnight dark, roxo sutil ── */
  --bg-root:        #07071A;
  --bg-app:         #09091E;
  --bg-surface:     #0F0E24;
  --bg-card:        #151428;
  --bg-card-2:      #1A1930;
  --bg-hover:       #201E38;
  --bg-active:      #252340;

  /* ── Borders ── */
  --border-dim:     rgba(255, 255, 255, 0.08);
  --border-mid:     rgba(255, 255, 255, 0.15);
  --border-strong:  rgba(255, 255, 255, 0.26);
  --border-brand:   rgba(200, 66, 15, 0.45);

  /* ── Text ── */
  --text-1:  #FFFFFF;
  --text-2:  #C4C4E2;
  --text-3:  #8E8EB0;
  --text-4:  #646488;

  /* Aliases semânticos */
  --text-primary: #FFFFFF;
  --text-dim:     #8E8EB0;
  --surface:      #0F0E24;
  --border:       rgba(255,255,255,0.12);
  --radius-lg:    14px;
  --radius-md:    10px;

  /* ── Semantic ── */
  --success:        #1FC876;
  --success-bg:     rgba(31, 200, 118, 0.12);
  --success-border: rgba(31, 200, 118, 0.30);

  --warning:        #F0A020;
  --warning-bg:     rgba(240, 160, 32, 0.12);
  --warning-border: rgba(240, 160, 32, 0.30);

  --info:           #4B9EFF;
  --info-bg:        rgba(75, 158, 255, 0.12);
  --info-border:    rgba(75, 158, 255, 0.30);

  --danger:         #FF4F4F;
  --danger-bg:      rgba(255, 79, 79, 0.12);
  --danger-border:  rgba(255, 79, 79, 0.30);

  /* ── Radius ── */
  --r-xs:  4px;
  --r-sm:  6px;
  --r-md:  10px;
  --r-lg:  14px;
  --r-xl:  20px;

  /* ── Spacing ── */
  --space-1:  4px;
  --space-2:  8px;
  --space-3:  12px;
  --space-4:  16px;
  --space-5:  20px;
  --space-6:  24px;
  --space-8:  32px;
  --space-10: 40px;

  /* ── Typography ── */
  --font-sans: 'Plus Jakarta Sans', sans-serif;
  --font-mono: 'JetBrains Mono', monospace;

  /* ── Layout ── */
  --sidebar-width:     220px;
  --topbar-height:     56px;
  --content-max-width: 1400px;

  /* ── Transitions ── */
  --transition-fast:   0.12s ease;
  --transition-base:   0.18s ease;
  --transition-slow:   0.3s ease;

  /* ── Glass tokens - white-based (true glassmorphism) ── */
  --glass-blur:             24px;
  --glass-blur-strong:      36px;
  --glass-blur-modal:       44px;
  --glass-bg:               rgba(255, 255, 255, 0.05);
  --glass-bg-elevated:      rgba(255, 255, 255, 0.09);
  --glass-bg-deep:          rgba(0, 0, 0, 0.32);
  --glass-bg-card:          rgba(255, 255, 255, 0.06);
  --glass-bg-card-hover:    rgba(255, 255, 255, 0.11);
  --glass-border:           rgba(255, 255, 255, 0.12);
  --glass-border-bright:    rgba(255, 255, 255, 0.20);
  --glass-inner-light:      inset 0 1px 0 rgba(255, 255, 255, 0.16);
  --glass-shadow:           0 8px 48px rgba(0, 0, 0, 0.65), 0 0 0 1px rgba(255,255,255,0.07);
  --glass-shadow-soft:      0 4px 28px rgba(0, 0, 0, 0.48);
  --glass-shadow-inset:     inset 0 0 0 1px rgba(255, 255, 255, 0.08);
}
