/* ============================================================
   COLOR CONFIGURATION — Being Hungry
   Theme: Electric Yellow · Jet Black · Clean White
   Designed and Code written by Pusala Arun Kumar

   ✦ THIS is the ONLY file you change per restaurant.
   ✦ Paste your brand colors below and everything updates.
   ✦ Load this BEFORE restaurant-core.css in your HTML.
   ============================================================ */

:root {

  /* ────────────────────────────────────
     TYPOGRAPHY
     ──────────────────────────────────── */
  --font-display: 'Cormorant Garamond', Georgia, serif;
  --font-body:    'DM Sans', system-ui, sans-serif;
  --font-label:   'DM Sans', system-ui, sans-serif;

  /* ────────────────────────────────────
     LAYOUT TOKENS  (rarely change)
     ──────────────────────────────────── */
  --nav-h:      76px;
  --ease:       cubic-bezier(0.16, 1, 0.3, 1);
  --ease-back:  cubic-bezier(0.34, 1.56, 0.64, 1);

  /* ────────────────────────────────────
     SHADOWS  (yellow-warm, punchy)
     ──────────────────────────────────── */
  --shadow-xs:     0 1px 4px  rgba(0, 0, 0, 0.10);
  --shadow-sm:     0 3px 14px rgba(0, 0, 0, 0.14);
  --shadow-md:     0 8px 32px rgba(0, 0, 0, 0.18);
  --shadow-lg:     0 20px 60px rgba(0, 0, 0, 0.22);
  --shadow-accent: 0 8px 36px rgba(224, 210, 0, 0.40);

  /* ════════════════════════════════════
     ★  BRAND PALETTE  ★
     ════════════════════════════════════ */

  /* ── ELECTRIC YELLOW FAMILY (dominant brand color) ─────── */
  --brand-accent:        #E0D200;   /* ← pure brand yellow (logo bg)        */
  --brand-accent-light:  #EDE000;   /* ← brighter yellow                    */
  --brand-accent-soft:   #F0E860;   /* ← soft yellow tint                   */
  --brand-accent-pale:   #FAFACC;   /* ← faintest yellow wash               */
  --brand-accent-deep:   #C4B800;   /* ← deeper mustard (hover)             */
  --brand-accent-vivid:  #F5E800;   /* ← vivid pop yellow                   */

  /* ── JET BLACK FAMILY (secondary — logo text & icon) ───── */
  --brand-black:         #111111;   /* ← near-black (logo type)             */
  --brand-black-mid:     #222222;   /* ← dark gray-black                    */
  --brand-black-light:   #333333;   /* ← softer black                       */
  --brand-black-pale:    #F0F0F0;   /* ← light gray tint                    */
  --brand-black-mist:    #F8F8F8;   /* ← near-white tint                    */
  --brand-black-dark:    #000000;   /* ← pure black (footer)                */

  /* ── CLEAN WHITE FAMILY (light surfaces) ─────────────────  */
  --brand-cream:         #ffffff;   /* ← pure white                         */
  --brand-cream-light:   #fafafa;   /* ← off-white                          */
  --brand-cream-deep:    #f5f5f0;   /* ← warm off-white sections            */

  /* ────────────────────────────────────
     BACKGROUNDS  (white dominant)
     ──────────────────────────────────── */
  --color-bg:        #ffffff;              /* pure white — main canvas       */
  --color-bg-off:    #fafaf8;              /* very faint warm white          */
  --color-bg-cream:  #fafacc;              /* faint yellow tint section bg   */

  /* ────────────────────────────────────
     TEXT
     ──────────────────────────────────── */
  --color-text-ink:   #111111;             /* jet black headings             */
  --color-text-body:  #1a1a1a;             /* dark body text                 */
  --color-text-muted: #555555;             /* mid gray muted                 */
  --color-text-faint: #999999;             /* light gray faint               */

  /* Text on dark (black) backgrounds */
  --color-text-on-dark:       #ffffff;
  --color-text-on-dark-muted: rgba(255, 255, 255, 0.65);
  --color-text-on-dark-faint: rgba(255, 255, 255, 0.38);

  /* ────────────────────────────────────
     ACCENT COLORS
     ──────────────────────────────────── */
  --color-accent:                var(--brand-accent);
  --color-accent-deep:           var(--brand-accent-deep);
  --color-accent-dark:           var(--brand-black);  /* black used on light bg labels */

  /* Yellow gradients — CTA buttons, section highlights */
  --color-accent-gradient:       linear-gradient(135deg, #C4B800, #E0D200);
  --color-accent-gradient-soft:  linear-gradient(135deg, #FAFACC, #F0E860, #E0D200);
  --color-accent-gradient-rich:  linear-gradient(135deg, #A89E00, #E0D200, #F5E800);

  /* Black gradients — dark sections, hero overlays */
  --color-green-gradient:        linear-gradient(135deg, #111111, #222222);
  --color-green-gradient-rich:   linear-gradient(160deg, #000000, #111111, #222222);

  /* Brand signature — black to yellow */
  --color-brand-gradient:        linear-gradient(135deg, #111111, #E0D200);

  /* ────────────────────────────────────
     BORDERS
     ──────────────────────────────────── */
  --color-border-light:   rgba(224, 210, 0, 0.20);
  --color-border:         rgba(224, 210, 0, 0.45);
  --color-border-strong:  rgba(17, 17, 17, 0.40);
  --color-border-accent:  rgba(17, 17, 17, 0.22);
  --color-border-cream:   rgba(224, 210, 0, 0.18);

  /* Borders on dark (black) backgrounds */
  --color-border-on-dark: rgba(224, 210, 0, 0.38);   /* yellow border on black */

  /* ────────────────────────────────────
     HERO RADIAL GLOWS
     ──────────────────────────────────── */
  --color-hero-glow-1:  rgba(224, 210, 0, 0.12);    /* yellow glow           */
  --color-hero-glow-2:  rgba(17, 17, 17, 0.05);     /* black vignette        */
  --color-grid-line:    rgba(224, 210, 0, 0.07);

  /* ────────────────────────────────────
     BADGE / OFFER BOX
     ──────────────────────────────────── */
  --color-badge-bg:       var(--brand-accent-pale);
  --color-badge-green:    var(--brand-black-mist);

  /* ────────────────────────────────────
     PULSE RING  (hero badge dot)
     ──────────────────────────────────── */
  --color-pulse-ring: rgba(224, 210, 0, 0.32);

  /* ────────────────────────────────────
     INK (dark) SURFACES  (ribbon, CTA, promise, footer nav bar)
     ──────────────────────────────────── */
  --color-ink:        #111111;             /* jet black dark bg              */
  --color-on-ink:     #E0D200;             /* brand yellow text on black     */
  --color-ink-mid:    #222222;             /* mid black surface              */

  /* ────────────────────────────────────
     INK SECTION GLOWS
     ──────────────────────────────────── */
  --color-ink-glow-1: rgba(224, 210, 0, 0.14);    /* yellow shimmer on black */
  --color-ink-glow-2: rgba(255, 255, 255, 0.04);

  /* ────────────────────────────────────
     RIBBON
     ──────────────────────────────────── */
  --color-ribbon-border: rgba(224, 210, 0, 0.30);
  --color-ribbon-text:   rgba(224, 210, 0, 0.85);

  /* ────────────────────────────────────
     FOOTER
     ──────────────────────────────────── */
  --color-footer-bg: #000000;             /* pure black footer              */

}