/* ============================================
   PRIMEIROS SABORES — Design Tokens
   ============================================ */

:root {
  /* ── Brand Colors ── */
  --color-coral:          #F27059;
  --color-coral-dark:     #E05A43;
  --color-coral-light:    #FFEBE6;
  --color-coral-hover:    #D94F3A;

  /* ── Semantic (aliases usados no app) ── */
  --color-primary:        #F27059;   /* = coral (marca) */
  --color-primary-dark:   #E05A43;
  --color-primary-light:  #FFEBE6;
  --color-primary-hover:  #D94F3A;

  /* Azul secundário (ações "Compras", links, títulos de seção) */
  --color-secondary:      #1A5C8C;
  --color-secondary-dark: #14496F;
  --color-secondary-light:#E8F1F8;
  --color-blue-deep:      #1E3A8A;   /* títulos de destaque */

  /* Âmbar (freezer / avisos) */
  --color-amber:          #F59E0B;
  --color-amber-dark:     #78350F;
  --color-amber-light:    #FEF3C7;

  /* Marrom (títulos de topo — Cardápio, Receita) */
  --color-brown:          #5E4631;

  /* Ações destrutivas / sair */
  --color-danger:         #DC2626;
  --color-danger-bg:      #FEE2E2;

  /* ── Background ── */
  --color-bg:             #FDF6EE;
  --color-bg-warm:        #FFF8F0;
  --color-bg-card:        #FFFFFF;
  --color-bg-overlay:     rgba(0, 0, 0, 0.4);

  /* ── Meal Type Colors ── */
  --color-cafe:           #5DADE2;
  --color-cafe-bg:        #E8F4FD;
  --color-cafe-text:      #2E86C1;

  --color-almoco:         #F5A623;
  --color-almoco-bg:      #FFF3E0;
  --color-almoco-text:    #E09100;

  --color-lanche:         #6BCB77;
  --color-lanche-bg:      #E8F5E9;
  --color-lanche-text:    #4CAF50;

  --color-jantar:         #7C6BC4;
  --color-jantar-bg:      #F0ECFA;
  --color-jantar-text:    #5E4DB2;

  /* ── Text ── */
  --color-text-primary:   #2D3A5C;
  --color-text-body:      #3D4F6F;
  --color-text-secondary: #7A8599;
  --color-text-light:     #A0AEBF;
  --color-text-white:     #FFFFFF;

  /* ── UI ── */
  --color-border:         #E8E0D8;
  --color-border-light:   #F0EBE4;
  --color-divider:        #F5F0EA;
  --color-star:           #FFD93D;
  --color-heart:          #F27059;
  --color-green-check:    #4CAF50;
  --color-badge:          #F27059;

  /* ── Decorative ── */
  --color-deco-heart:     #F2A09E;
  --color-deco-star:      #FFD93D;
  --color-deco-leaf:      #A8D8A8;
  --color-deco-blue:      #B3D9F2;

  /* ── Typography ── */
  --font-body:            'Nunito', -apple-system, BlinkMacSystemFont, sans-serif;
  --font-display:         'Baloo 2', cursive;

  --text-xs:              0.6875rem;   /* 11px */
  --text-sm:              0.8125rem;   /* 13px */
  --text-base:            0.9375rem;   /* 15px */
  --text-md:              1rem;        /* 16px */
  --text-lg:              1.125rem;    /* 18px */
  --text-xl:              1.25rem;     /* 20px */
  --text-2xl:             1.5rem;      /* 24px */
  --text-3xl:             1.875rem;    /* 30px */
  --text-4xl:             2.25rem;     /* 36px */

  --weight-regular:       400;
  --weight-medium:        500;
  --weight-semibold:      600;
  --weight-bold:          700;
  --weight-extrabold:     800;

  --line-height-tight:    1.2;
  --line-height-normal:   1.5;
  --line-height-relaxed:  1.7;

  /* ── Spacing ── */
  --space-2xs:            2px;
  --space-xs:             4px;
  --space-sm:             8px;
  --space-md:             12px;
  --space-base:           16px;
  --space-lg:             20px;
  --space-xl:             24px;
  --space-2xl:            32px;
  --space-3xl:            40px;
  --space-4xl:            48px;

  /* ── Border Radius ── */
  --radius-xs:            4px;
  --radius-sm:            8px;
  --radius-md:            12px;
  --radius-lg:            16px;
  --radius-xl:            20px;
  --radius-2xl:           24px;
  --radius-pill:          50px;
  --radius-full:          50%;

  /* ── Shadows ── */
  --shadow-xs:            0 1px 3px rgba(45, 58, 92, 0.04);
  --shadow-sm:            0 2px 8px rgba(45, 58, 92, 0.06);
  --shadow-md:            0 4px 16px rgba(45, 58, 92, 0.08);
  --shadow-lg:            0 8px 24px rgba(45, 58, 92, 0.10);
  --shadow-xl:            0 12px 40px rgba(45, 58, 92, 0.14);
  --shadow-card:          0 2px 12px rgba(45, 58, 92, 0.07);
  --shadow-navbar:        0 -2px 12px rgba(45, 58, 92, 0.06);

  /* ── Layout ── */
  --navbar-height:        68px;
  --header-height:        56px;
  --max-width:            430px;
  --content-padding:      16px;

  /* ── Transitions ── */
  --transition-fast:      150ms ease;
  --transition-normal:    250ms ease;
  --transition-slow:      400ms ease;
  --transition-bounce:    400ms cubic-bezier(0.34, 1.56, 0.64, 1);
}