/* ── RESET & VARIABLES ── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
/* Default = WARM LIGHT (food-appetizing cream + terracotta + basil) */
:root{
  --bg:#faf5ea;             /* airy warm cream — lighter, less saturated */
  --surface:#fffdf8;        /* paper-white on cream */
  --surface2:#f2ead7;
  --surface3:#e8dfc9;
  --gold:#c05a3c;           /* terracotta — primary accent / CTA */
  --gold-dim:#9c4527;       /* darker terracotta for borders */
  --gold-light:#a04730;     /* readable terracotta for text on cream */
  --text:#2a1f14;           /* warm deep brown-black (high contrast) */
  --text2:#5a4d3e;          /* warm medium brown */
  --text3:#6e6050;          /* warm muted brown for hints (4.6:1 on #faf5ea = WCAG AA) */
  --border:#ece2cc;
  --border2:#d8cdb4;
  --green:#5e8841;          /* basil — positive signal */
  --red:#b84830;
  --honey:#c48828;          /* honey — highlights / badges */
  --accent:#c05a3c;
  --r:14px;
  --r-lg:20px;
  --shadow-sm:0 1px 3px rgba(70,50,30,.08);
  --shadow-md:0 4px 14px rgba(70,50,30,.1);
  --shadow-lg:0 10px 28px rgba(70,50,30,.14);
  --glow-gold:0 0 18px rgba(192,90,60,.14);
  --glow-gold-lg:0 0 40px rgba(192,90,60,.18);
}
/* Dark = warm dark (brown-black, brighter terracotta for contrast) */
[data-theme="dark"]{
  --bg:#1c1813;
  --surface:#26201a;
  --surface2:#2e2721;
  --surface3:#3a3128;
  --gold:#d87a5c;
  --gold-dim:#9c4527;
  --gold-light:#e8a489;
  --text:#f5ede0;
  --text2:#c4b8a5;
  --text3:#8a7f6e;
  --border:#342c24;
  --border2:#453a30;
  --green:#9ec877;
  --red:#d9664a;
  --honey:#e8b86c;
  --accent:#d87a5c;
  --shadow-sm:0 1px 3px rgba(0,0,0,.3);
  --shadow-md:0 4px 14px rgba(0,0,0,.35);
  --shadow-lg:0 10px 28px rgba(0,0,0,.4);
  --glow-gold:0 0 20px rgba(216,122,92,.2);
  --glow-gold-lg:0 0 40px rgba(216,122,92,.25);
}
/* theme-icon-dark = sun (shown in dark mode); theme-icon-light = moon (shown in light/default) */
.theme-icon-dark{display:none}
.theme-icon-light{display:inline}
[data-theme="dark"] .theme-icon-dark{display:inline}
[data-theme="dark"] .theme-icon-light{display:none}
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
input[type=number]{-moz-appearance:textfield}
html{scroll-behavior:smooth;height:100%}
body{font-family:'Outfit',sans-serif;background:var(--bg);color:var(--text);min-height:100vh;-webkit-font-smoothing:antialiased;font-weight:300}

/* ── INLINE ICONS ── */
.i{display:inline-block;vertical-align:middle;flex-shrink:0;position:relative;top:-1px}
button .i,a .i,.tag .i,.craving-tag .i{margin-right:4px}
.nutri-toggle-lbl .i,.day-snack-lbl .i,.modal-snack-lbl .i,.kids-alt .i,.recipe-ai-note .i{margin-right:3px}
.empty-icon .i{opacity:.5;top:0}

/* ── SCROLLBAR ── */
::-webkit-scrollbar{width:4px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:var(--border2);border-radius:2px}

/* ── LAYOUT ── */
.page{max-width:600px;margin:0 auto;padding:0 0 6rem}
.layout{display:flex;flex-direction:column}

/* ── KEYFRAMES ── */
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.3}}
@keyframes bounce{0%,80%,100%{transform:scale(.6);opacity:.4}40%{transform:scale(1);opacity:1}}
@keyframes chip-in{from{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}
@keyframes slide-in{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}
@keyframes fade-in{from{opacity:0}to{opacity:1}}
@keyframes modal-up{from{transform:translateY(40px);opacity:0}to{transform:translateY(0);opacity:1}}
@keyframes shimmer{0%{background-position:-200% center}100%{background-position:200% center}}
@keyframes glowPulse{0%,100%{opacity:.4}50%{opacity:.7}}

/* ── PREMIUM UTILS ── */
.glow-text{
  background:linear-gradient(135deg,var(--gold),var(--gold-light),var(--gold));
  background-size:200% auto;
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;
  background-clip:text;
  animation:shimmer 4s linear infinite;
}