/* ============================================================
   SOUTH ZONE — COLOR TOKENS
   Pure-veg, neighbourhood-warm palette.
   Base values first, semantic aliases second.
   ============================================================ */

:root {
  /* ---- Brand core ---- */
  --sz-saffron:      #FEBC11;  /* Primary — backgrounds, CTAs, highlights */
  --sz-espresso:     #21170E;  /* Primary dark — text on yellow, dark panels */
  --sz-chilli:       #D7263D;  /* Accent — price tags, bullets, urgency */
  --sz-cream:        #EFE1D5;  /* Secondary bg — light panels, cards on dark */
  --sz-leaf:         #537033;  /* Accent — garnish, pure-veg badge */
  --sz-terracotta:   #BA4526;  /* Accent — decorative use */
  --sz-white:        #FFFFFF;  /* Text on dark backgrounds */

  /* ---- Saffron tints / shades (derived, harmonious) ---- */
  --sz-saffron-600:  #E5A800;  /* hover / pressed CTA */
  --sz-saffron-300:  #FFD972;  /* soft highlight */
  --sz-saffron-100:  #FFF1CC;  /* faint wash on light */

  /* ---- Espresso tints / shades ---- */
  --sz-espresso-900: #160F08;  /* deepest panel */
  --sz-espresso-700: #3B2A1F;  /* raised brown surface */
  --sz-espresso-500: #60442C;  /* brown line / muted text on cream */

  /* ---- Cream shades ---- */
  --sz-cream-200:    #E4D2C2;  /* cream border / divider */

  /* ---- Functional ---- */
  --sz-veg-green:    #1F8A3B;  /* the regulation pure-veg mark green */
  --sz-success:      #2E7D32;
  --sz-warning:      #E5A800;
  --sz-danger:       #D7263D;

  /* ============================================================
     SEMANTIC ALIASES — reach for these in product code
     ============================================================ */

  /* Surfaces */
  --surface-brand:        var(--sz-saffron);     /* the signature yellow page */
  --surface-dark:         var(--sz-espresso);    /* dark hero / footer */
  --surface-dark-raised:  var(--sz-espresso-700);
  --surface-light:        var(--sz-cream);       /* light card on dark */
  --surface-paper:        var(--sz-white);        /* clean menu / minimal */

  /* Text */
  --text-on-saffron:      var(--sz-espresso);
  --text-on-dark:         var(--sz-white);
  --text-on-dark-soft:    var(--sz-cream);
  --text-on-light:        var(--sz-espresso);
  --text-muted:           var(--sz-espresso-500);
  --text-accent:          var(--sz-chilli);

  /* Lines & borders */
  --border-on-dark:       var(--sz-saffron);
  --border-on-light:      var(--sz-cream-200);
  --border-dashed:        var(--sz-espresso-500);

  /* Interactive */
  --cta-bg:               var(--sz-saffron);
  --cta-bg-hover:         var(--sz-saffron-600);
  --cta-text:             var(--sz-espresso);
  --price-bg:             var(--sz-chilli);
  --price-text:           var(--sz-white);
  --veg-mark:             var(--sz-veg-green);
}