/* ═══════════════════════════════════════════
   DESIGN TOKENS — Light Theme (default)
═══════════════════════════════════════════ */
:root {
  /* Brand — La Cesta de la YaYa */
  --brand-dark:       #1A0D2E;
  --brand-primary:    #7C4A9E;
  --brand-primary-h:  #6B3A8E;
  --brand-secondary:  #C9A8E0;
  --brand-accent:     #E8A838;
  --brand-gold:       #E8A838;
  --brand-cream:      #F0E6D3;

  /* Backgrounds */
  --bg-app:           #EFEFEF;
  --bg-surface:       #FFFFFF;
  --bg-surface-2:     #F7F7F8;
  --bg-surface-3:     #EBEBED;
  --bg-overlay:       rgba(0, 0, 0, 0.45);

  /* Text */
  --text-primary:     #1A1A2E;
  --text-secondary:   #6B7280;
  --text-tertiary:    #9CA3AF;
  --text-inverse:     #FFFFFF;
  --text-on-brand:    #FFFFFF;

  /* Borders — más oscuros para que se vean igual que en dark mode */
  --border:           #C8CDD6;
  --border-focus:     var(--brand-primary);

  /* Status */
  --success:          #10B981;
  --warning:          #F59E0B;
  --danger:           #EF4444;
  --info:             #3B82F6;

  /* Shadows — más pronunciadas en light para dar profundidad */
  --shadow-sm:        0 1px 3px rgba(0,0,0,.10), 0 1px 2px rgba(0,0,0,.06);
  --shadow-md:        0 4px 12px rgba(0,0,0,.12), 0 2px 4px rgba(0,0,0,.08);
  --shadow-lg:        0 10px 30px rgba(0,0,0,.14), 0 4px 10px rgba(0,0,0,.09);
  --shadow-brand:     0 4px 16px rgba(124,74,158,.35);

  /* Radius */
  --radius-sm:        8px;
  --radius-md:        12px;
  --radius-lg:        18px;
  --radius-xl:        24px;
  --radius-full:      9999px;

  /* Spacing */
  --space-xs:         4px;
  --space-sm:         8px;
  --space-md:         16px;
  --space-lg:         24px;
  --space-xl:         32px;
  --space-2xl:        48px;

  /* Typography */
  --font-family:      -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --font-size-xs:     0.75rem;
  --font-size-sm:     0.875rem;
  --font-size-md:     1rem;
  --font-size-lg:     1.125rem;
  --font-size-xl:     1.25rem;
  --font-size-2xl:    1.5rem;
  --font-size-3xl:    1.875rem;

  /* Layout */
  --sidebar-width:    260px;
  --topbar-height:    60px;
  --bottom-nav-height:68px;
  --content-max:      720px;

  /* Transitions */
  --transition-fast:  150ms ease;
  --transition-base:  250ms ease;
  --transition-slow:  400ms cubic-bezier(.4,0,.2,1);

  /* Category colors */
  --cat-frutas:       #FF6B6B;
  --cat-verduras:     #51CF66;
  --cat-carnes:       #CC5DE8;
  --cat-pescados:     #339AF0;
  --cat-congelados:   #74C0FC;
  --cat-bebidas:      #FF922B;
  --cat-limpieza:     #20C997;
  --cat-higiene:      #F06595;
  --cat-mascotas:     #FCC419;
  --cat-bebe:         #A9E34B;
  --cat-otros:        #868E96;
  --cat-custom:       #845EF7;
}