/* AiShopper Bootstrap 5 theme — load after bootstrap.css */
:root {
  --ai-leaf: #2fa84f;
  --ai-forest: #087443;
  --ai-deep: #062a24;
  --ai-lime: #9bd66b;
  --ai-orange: #ff9700;
  --ai-tomato: #f4512a;
  --ai-cream: #fffdf4;
  --ai-ink: #102d2b;
  --ai-mist: #eaf5d8;
  --bs-primary: var(--ai-leaf);
  --bs-primary-rgb: 47, 168, 79;
  --bs-success: var(--ai-forest);
  --bs-success-rgb: 8, 116, 67;
  --bs-body-color: var(--ai-ink);
  --bs-body-bg: var(--ai-cream);
  --bs-border-color: #cfe5b7;
  --bs-link-color: var(--ai-forest);
  --bs-link-hover-color: var(--ai-leaf);
  --bs-font-sans-serif: Nunito, "Avenir Next", "Segoe UI", sans-serif;
  --bs-border-radius: 1rem;
  --bs-border-radius-lg: 1.5rem;
}

body { background: var(--ai-cream); color: var(--ai-ink); }
.navbar.ai-navbar { background: rgba(255, 253, 244, .94); border-bottom: 1px solid var(--ai-mist); }
.ai-gradient { background: linear-gradient(135deg, var(--ai-forest), var(--ai-leaf) 58%, var(--ai-lime)); color: var(--ai-cream); }
.ai-dark { background: var(--ai-deep); color: var(--ai-cream); }
.bg-ai-cream { background-color: var(--ai-cream) !important; }
.bg-ai-mist { background-color: var(--ai-mist) !important; }
.text-ai-forest { color: var(--ai-forest) !important; }
.text-ai-deep { color: var(--ai-deep) !important; }
.text-ai-orange { color: var(--ai-orange) !important; }
.btn-ai-primary { --bs-btn-color: #fffdf4; --bs-btn-bg: var(--ai-forest); --bs-btn-border-color: var(--ai-forest); --bs-btn-hover-bg: var(--ai-leaf); --bs-btn-hover-border-color: var(--ai-leaf); --bs-btn-focus-shadow-rgb: 8,116,67; }
.btn-ai-accent { --bs-btn-color: var(--ai-deep); --bs-btn-bg: var(--ai-orange); --bs-btn-border-color: var(--ai-orange); --bs-btn-hover-bg: #ffad2e; --bs-btn-hover-border-color: #ffad2e; }
.card.ai-card { background: #fff; border-color: var(--ai-mist); box-shadow: 0 .5rem 1.5rem rgba(6, 42, 36, .08); }
.form-control:focus, .form-select:focus { border-color: var(--ai-leaf); box-shadow: 0 0 0 .25rem rgba(47, 168, 79, .2); }
.badge.ai-badge { background: var(--ai-mist); color: var(--ai-forest); }
.ai-pattern { background: var(--ai-cream) url("../backgrounds/grocery-pattern.png") center / cover; }
.ai-dark-glow { background: var(--ai-deep) url("../backgrounds/dark-glow.png") center / cover; }