/* ════════════════════════════════════════════════════════════
   AMGOS DESIGN TOKENS — Single source of truth — v5.8.0
   ────────────────────────────────────────────────────────────
   Todos os PHP/JS devem usar var(--token), NUNCA hex direto.
   Cada tema (dark/light/apple) sobrescreve os tokens.
   ════════════════════════════════════════════════════════════ */

/* ── DARK THEME (default) ───────────────────────────────── */
:root,
[data-theme="dark"] {
  /* SURFACES */
  --bg:                  #050B18;
  --surface:             #0D1424;
  --surface-2:           #111827;
  --surface-3:           #1E293B;
  --surface-elevated:    #131C30;
  --surface-overlay:     rgba(13,20,36,0.85);

  /* TEXT — branco puro pro contraste correto em dark */
  --text:                #FFFFFF;
  --text-strong:         #FFFFFF;
  --text-secondary:      #CBD5E1;
  --muted:               #94A3B8;
  --text-on-brand:       #FFFFFF;
  --text-on-dark:        #FFFFFF;
  --text-on-light:       #0F172A;

  /* BRAND (sobrescritível por white-label) */
  --brand-color:         #3B82F6;
  --brand-color-2:       #7C3AED;
  --brand-color-hover:   #2563EB;
  --brand-gradient:      linear-gradient(135deg, #2563EB, #7C3AED);
  --brand-glow:          rgba(59,130,246,0.30);
  --brand-glow-soft:     rgba(59,130,246,0.12);
  --brand-glow-faint:    rgba(59,130,246,0.06);

  /* PRIMARY (alias = brand-color) */
  --primary:             var(--brand-color);
  --primary-hover:       var(--brand-color-hover);
  --primary-glow:        var(--brand-glow);

  /* BORDERS */
  --border:              rgba(255,255,255,0.07);
  --border-hover:        rgba(255,255,255,0.14);
  --border-strong:       rgba(255,255,255,0.20);
  --divider:             rgba(255,255,255,0.05);
  --divider-soft:        rgba(255,255,255,0.03);

  /* STATUS — Success (verde) */
  --success:             #10B981;
  --success-bg:          rgba(16,185,129,0.12);
  --success-border:      rgba(16,185,129,0.25);
  --success-text:        #10B981;

  /* STATUS — Warning (amber) */
  --warning:             #F59E0B;
  --warning-bg:          rgba(245,158,11,0.12);
  --warning-border:      rgba(245,158,11,0.25);
  --warning-text:        #F59E0B;

  /* STATUS — Danger (red) */
  --danger:              #EF4444;
  --danger-bg:           rgba(239,68,68,0.12);
  --danger-border:       rgba(239,68,68,0.25);
  --danger-text:         #FCA5A5;

  /* STATUS — Info (blue) */
  --info:                #3B82F6;
  --info-bg:             rgba(59,130,246,0.12);
  --info-border:         rgba(59,130,246,0.25);
  --info-text:           #60A5FA;

  /* STATUS — Neutral (purple) */
  --neutral:             #8B5CF6;
  --neutral-bg:          rgba(139,92,246,0.12);
  --neutral-text:        #C4B5FD;

  /* ACCENT (alias) */
  --teal:                #06B6D4;
  --purple:              var(--brand-color-2);
  --pink:                #EC4899;
  --green:               var(--success);
  --red:                 var(--danger);
  --amber:               var(--warning);

  /* SHADOWS */
  --shadow-xs:           0 1px 2px rgba(0,0,0,0.3);
  --shadow-sm:           0 2px 8px rgba(0,0,0,0.3);
  --shadow-md:           0 8px 24px rgba(0,0,0,0.4);
  --shadow-lg:           0 16px 48px rgba(0,0,0,0.5);
  --shadow-card:         0 1px 3px rgba(0,0,0,0.18), 0 8px 24px rgba(0,0,0,0.20);
  --shadow-card-hover:   0 2px 6px rgba(0,0,0,0.30), 0 16px 40px rgba(0,0,0,0.35);
  --shadow-popover:      0 4px 12px rgba(0,0,0,0.30), 0 24px 64px rgba(0,0,0,0.40);
  --shadow-button:       0 1px 2px rgba(0,0,0,0.25);
  --shadow-button-primary: 0 4px 14px rgba(37,99,235,0.45), 0 1px 2px rgba(37,99,235,0.20);

  /* RADIUS */
  --r-xs:                4px;
  --r-sm:                8px;
  --r-md:                12px;
  --r-lg:                16px;
  --r-xl:                20px;
  --r-2xl:               24px;
  --r-pill:              9999px;

  /* SPACING */
  --gap-2xs:             4px;
  --gap-xs:              8px;
  --gap-sm:              12px;
  --gap-md:              16px;
  --gap-lg:              20px;
  --gap-xl:              24px;
  --gap-2xl:             32px;
  --gap-3xl:             40px;

  --card-pad-sm:         18px;
  --card-pad-md:         22px;
  --card-pad-lg:         26px;

  /* TYPOGRAPHY */
  --font:                'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-display:        'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  --font-mono:           ui-monospace, SF Mono, Consolas, monospace;

  /* TRANSITIONS */
  --t-fast:              120ms cubic-bezier(.4,0,.2,1);
  --t-med:               220ms cubic-bezier(.4,0,.2,1);
  --t-slow:              380ms cubic-bezier(.16,1,.3,1);

  /* THEME META */
  --theme-name:          "dark";
  color-scheme:          dark;
}

/* ── LIGHT THEME ────────────────────────────────────────── */
[data-theme="light"] {
  /* SURFACES */
  --bg:                  #F4F6FA;
  --surface:             #FFFFFF;
  --surface-2:           #F8FAFC;
  --surface-3:           #F1F5F9;
  --surface-elevated:    #FFFFFF;
  --surface-overlay:     rgba(255,255,255,0.85);

  /* TEXT */
  --text:                #0F172A;
  --text-strong:         #020617;
  --text-secondary:      #475569;
  --muted:               #94A3B8;
  --text-on-brand:       #FFFFFF;
  --text-on-dark:        #FFFFFF;
  --text-on-light:       #0F172A;

  /* BRAND — same brand color but visual context muda */
  --brand-color:         #3B82F6;
  --brand-color-2:       #7C3AED;
  --brand-color-hover:   #2563EB;
  --brand-gradient:      linear-gradient(135deg, #2563EB, #7C3AED);
  --brand-glow:          rgba(59,130,246,0.20);
  --brand-glow-soft:     rgba(59,130,246,0.10);
  --brand-glow-faint:    rgba(59,130,246,0.04);

  --primary:             var(--brand-color);
  --primary-hover:       var(--brand-color-hover);
  --primary-glow:        var(--brand-glow);

  /* BORDERS — clear contrast on light bg */
  --border:              rgba(15,23,42,0.06);
  --border-hover:        rgba(15,23,42,0.12);
  --border-strong:       rgba(15,23,42,0.20);
  --divider:             rgba(15,23,42,0.05);
  --divider-soft:        rgba(15,23,42,0.03);

  /* STATUS */
  --success:             #10B981;
  --success-bg:          rgba(16,185,129,0.10);
  --success-border:      rgba(16,185,129,0.25);
  --success-text:        #047857;

  --warning:             #F59E0B;
  --warning-bg:          rgba(245,158,11,0.10);
  --warning-border:      rgba(245,158,11,0.25);
  --warning-text:        #B45309;

  --danger:              #EF4444;
  --danger-bg:           rgba(239,68,68,0.08);
  --danger-border:       rgba(239,68,68,0.20);
  --danger-text:         #B91C1C;

  --info:                #3B82F6;
  --info-bg:             rgba(59,130,246,0.10);
  --info-border:         rgba(59,130,246,0.20);
  --info-text:           #1D4ED8;

  --neutral:             #8B5CF6;
  --neutral-bg:          rgba(139,92,246,0.10);
  --neutral-text:        #6D28D9;

  --teal:                #06B6D4;
  --purple:              var(--brand-color-2);
  --pink:                #EC4899;
  --green:               var(--success);
  --red:                 var(--danger);
  --amber:               var(--warning);

  /* SHADOWS — sutis sobre claro */
  --shadow-xs:           0 1px 2px rgba(15,23,42,0.04);
  --shadow-sm:           0 1px 3px rgba(15,23,42,0.06);
  --shadow-md:           0 4px 14px rgba(15,23,42,0.08);
  --shadow-lg:           0 12px 32px rgba(15,23,42,0.10);
  --shadow-card:         0 1px 3px rgba(15,23,42,0.04), 0 6px 18px rgba(15,23,42,0.04);
  --shadow-card-hover:   0 2px 6px rgba(15,23,42,0.06), 0 14px 34px rgba(15,23,42,0.08);
  --shadow-popover:      0 4px 14px rgba(15,23,42,0.08), 0 24px 60px rgba(15,23,42,0.10);
  --shadow-button:       0 1px 2px rgba(15,23,42,0.06);
  --shadow-button-primary: 0 4px 14px rgba(37,99,235,0.30), 0 1px 2px rgba(37,99,235,0.16);

  --theme-name:          "light";
  color-scheme:          light;
}

/* ── APPLE THEME ────────────────────────────────────────── */
[data-theme="apple"] {
  /* SURFACES */
  --bg:                  #F5F5F7;
  --surface:             #FFFFFF;
  --surface-2:           #F5F5F7;
  --surface-3:           #FAFAFC;
  --surface-elevated:    #FFFFFF;
  --surface-overlay:     rgba(255,255,255,0.85);

  /* TEXT */
  --text:                #1D1D1F;
  --text-strong:         #000000;
  --text-secondary:      #333333;
  --muted:               #7A7A7A;
  --text-on-brand:       #FFFFFF;
  --text-on-dark:        #FFFFFF;
  --text-on-light:       #1D1D1F;

  /* BRAND — Action Blue único */
  --brand-color:         #0066CC;
  --brand-color-2:       #0066CC;
  --brand-color-hover:   #0071E3;
  --brand-gradient:      #0066CC;
  --brand-glow:          rgba(0,102,204,0.20);
  --brand-glow-soft:     rgba(0,102,204,0.10);
  --brand-glow-faint:    rgba(0,102,204,0.04);

  --primary:             var(--brand-color);
  --primary-hover:       var(--brand-color-hover);
  --primary-glow:        var(--brand-glow);

  /* BORDERS — Apple hairlines */
  --border:              #E0E0E0;
  --border-hover:        rgba(0,0,0,0.12);
  --border-strong:       rgba(0,0,0,0.18);
  --divider:             #F0F0F0;
  --divider-soft:        rgba(0,0,0,0.04);

  /* STATUS — todos derivados do brand (Apple usa apenas Action Blue) */
  --success:             var(--brand-color);
  --success-bg:          rgba(0,102,204,0.08);
  --success-border:      rgba(0,102,204,0.18);
  --success-text:        var(--brand-color);

  --warning:             #1D1D1F;
  --warning-bg:          rgba(0,0,0,0.06);
  --warning-border:      rgba(0,0,0,0.12);
  --warning-text:        #333333;

  --danger:              #FF3B30;
  --danger-bg:           rgba(255,59,48,0.10);
  --danger-border:       rgba(255,59,48,0.20);
  --danger-text:         #FF3B30;

  --info:                var(--brand-color);
  --info-bg:             rgba(0,102,204,0.08);
  --info-border:         rgba(0,102,204,0.18);
  --info-text:           var(--brand-color);

  --neutral:             #7A7A7A;
  --neutral-bg:          rgba(0,0,0,0.04);
  --neutral-text:        #333333;

  --teal:                var(--brand-color);
  --purple:              var(--brand-color);
  --pink:                #1D1D1F;
  --green:               var(--brand-color);
  --red:                 var(--danger);
  --amber:               #1D1D1F;

  /* SHADOWS — Apple uses NO shadows on UI (chrome recede) */
  --shadow-xs:           none;
  --shadow-sm:           none;
  --shadow-md:           none;
  --shadow-lg:           none;
  --shadow-card:         none;
  --shadow-card-hover:   none;
  --shadow-popover:      0 20px 80px rgba(0,0,0,0.20);
  --shadow-button:       none;
  --shadow-button-primary: none;

  /* RADIUS — Apple specific scale */
  --r-xs:                5px;
  --r-sm:                8px;
  --r-md:                11px;
  --r-lg:                18px;
  --r-pill:              9999px;

  /* TYPOGRAPHY */
  --font:                'SF Pro Text', system-ui, -apple-system, BlinkMacSystemFont, 'Inter', sans-serif;
  --font-display:        'SF Pro Display', system-ui, -apple-system, BlinkMacSystemFont, 'Inter', sans-serif;

  --theme-name:          "apple";
  color-scheme:          light;
}

/* ── NÃO TEMÁTICO (cores fixas de marcas terceiras) ─────── */
:root {
  --color-facebook:      #1877F2;
  --color-instagram-1:   #F09433;
  --color-instagram-2:   #DC2743;
  --color-instagram-3:   #BC1888;
  --color-whatsapp:      #25D366;
  --color-google:        #4285F4;
}