/* ==========================================================================
   Bagdad Bread Factory - NAV THEME (PC + phone, one look)
   Same palette everywhere: cream header, white bar, brand green accents.
   Loaded after buttons-pro.css. Styling only - no links/text/scripts change.
   ========================================================================== */
:root{
  --nv-cream:#fffdf8; --nv-white:#fff; --nv-ink:#17231c; --nv-muted:#536057;
  --nv-green:#087f3e; --nv-green-d:#066a33; --nv-tint:rgba(8,127,62,.09); --nv-line:rgba(8,127,62,.14);
}

/* ---------- PC: link bar ---------- */
html body .primary-nav a:not(#_):not(#_){
  font-size:13px !important; font-weight:700 !important; letter-spacing:.01em !important;
  color:var(--nv-muted) !important; min-height:40px !important; padding:0 16px !important; border-radius:999px !important;
  transition:background-color .2s ease,color .2s ease !important;
}
html body .primary-nav a:not(#_):not(#_)::after{ content:none !important; display:none !important; }
html body .primary-nav a:not(#_):not(#_):hover,
html body .primary-nav a:not(#_):not(#_):focus-visible{
  background:var(--nv-tint) !important; color:var(--nv-green) !important; font-weight:700 !important; transform:none !important;
}
html body .primary-nav a:not(#_):not(#_)[aria-current="page"],
html body .primary-nav a:not(#_):not(#_).active{
  background:var(--nv-tint) !important; color:var(--nv-green) !important; font-weight:800 !important;
  box-shadow:inset 0 0 0 1px var(--nv-line) !important;
}
html body .primary-nav:not(#_){ gap:clamp(6px,1vw,14px) !important; }

/* ---------- Phone: top header ---------- */
@media (max-width:900px){
  html body .site-header:not(#_), html body .header-main:not(#_){
    background:var(--nv-cream) !important; border-bottom:1px solid var(--nv-line) !important; box-shadow:none !important;
  }
  html body .mobile-menu:not(#_), html body .menu-toggle:not(#_){ color:var(--nv-green-d) !important; }
  html body .mobile-menu:not(#_)::before{ background:var(--nv-green-d) !important; box-shadow:0 10px 0 var(--nv-green-d),0 20px 0 var(--nv-green-d) !important; }
  html body .header-main:not(#_):not(#_){ border-bottom:0 !important; }
  html body #mobileNav .drawer-close svg:not(#_){ stroke:var(--nv-green-d) !important; }

  /* ---------- Phone: bottom bar (light, like the PC bar) ---------- */
  html body .mobile-bottom-nav:not(#_):not(#_){
    background:rgba(255,253,248,.97) !important; color:var(--nv-muted) !important;
    border-top:1px solid var(--nv-line) !important; box-shadow:0 -6px 22px rgba(8,127,62,.10) !important;
    -webkit-backdrop-filter:blur(14px) saturate(130%) !important; backdrop-filter:blur(14px) saturate(130%) !important;
  }
  html body .mobile-bottom-nav a:not(#_):not(#_), html body .mobile-bottom-nav button:not(#_):not(#_){
    color:var(--nv-muted) !important; font-weight:700 !important; letter-spacing:.04em !important;
  }
  html body .mobile-bottom-nav svg:not(#_):not(#_){ stroke:currentColor !important; }
  html body .mobile-bottom-nav a:not(#_):not(#_):active, html body .mobile-bottom-nav button:not(#_):not(#_):active,
  html body .mobile-bottom-nav a:not(#_):not(#_)[aria-current="page"], html body .mobile-bottom-nav a:not(#_):not(#_).active{
    color:var(--nv-green) !important;
  }
  html body .mobile-bottom-nav .mb-count:not(#_):not(#_){ background:var(--nv-green) !important; color:#fff !important; }

  /* ---------- Phone: side menu (drawer) ---------- */
  :root{
    --dr-bg:var(--nv-cream); --dr-accent:var(--nv-green); --dr-gold:var(--nv-green);
    --dr-line:var(--nv-line); --dr-text:var(--nv-ink); --dr-muted:var(--nv-muted);
  }
  html body .mobile-nav-overlay:not(#_){ background:rgba(16,40,28,.42) !important; }
  html body #mobileNav.mobile-nav:not(#_){
    background:radial-gradient(120% 40% at 0% 0%,rgba(8,127,62,.08),transparent 60%),var(--nv-cream) !important;
    box-shadow:24px 0 60px rgba(16,40,28,.22) !important;
  }
  html body #mobileNav .drawer-logo img:not(#_){ border:2px solid var(--nv-line) !important; box-shadow:0 4px 14px rgba(8,127,62,.14) !important; }
  html body #mobileNav .drawer-brand b:not(#_){ color:var(--nv-green-d) !important; }
  html body #mobileNav .drawer-close:not(#_){ border:1.5px solid var(--nv-line) !important; background:var(--nv-white) !important; color:var(--nv-green-d) !important; }
  html body #mobileNav .drawer-close:active:not(#_){ background:var(--nv-tint) !important; }
  html body #mobileNav .mobile-drawer-search:not(#_){ background:var(--nv-white) !important; border:1px solid var(--nv-line) !important; }
  html body #mobileNav .mobile-drawer-search input:not(#_){ color:var(--nv-ink) !important; }
  html body #mobileNav .mobile-drawer-search input::placeholder{ color:#8a968f !important; }
  html body #mobileNav .drawer-quick a:not(#_){ border:1px solid var(--nv-line) !important; background:var(--nv-white) !important; color:var(--nv-green-d) !important; }
  html body #mobileNav .drawer-quick .dq-order:not(#_){ background:linear-gradient(135deg,#0a9a4b,#087f3e) !important; border-color:transparent !important; color:#fff !important; }
  html body #mobileNav .drawer-label:not(#_){ color:var(--nv-green) !important; }
  html body #mobileNav .drawer-label::after{ background:linear-gradient(90deg,rgba(8,127,62,.35),transparent) !important; }
  html body #mobileNav a.drawer-link:not(#_){ color:var(--nv-ink) !important; border-bottom:1px solid var(--nv-line) !important; }
  html body #mobileNav a.drawer-link i:not(#_){ color:rgba(8,127,62,.65) !important; }
  html body #mobileNav a.drawer-link span:not(#_){ font:700 16px/1.2 Inter,Arial,sans-serif !important; letter-spacing:.005em !important; }
  html body #mobileNav a.drawer-link:active:not(#_), html body #mobileNav a.drawer-link.is-active:not(#_){ color:var(--nv-green) !important; }
  html body #mobileNav a.drawer-link.is-active:not(#_){ background:var(--nv-tint) !important; border-radius:12px !important; }
  html body #mobileNav .drawer-visit:not(#_){ background:var(--nv-white) !important; border:1px solid var(--nv-line) !important; }
  html body #mobileNav .drawer-visit h3:not(#_){ color:var(--nv-green-d) !important; font-family:Inter,Arial,sans-serif !important; font-weight:800 !important; font-size:22px !important; }
  html body #mobileNav .drawer-visit p:not(#_){ color:var(--nv-muted) !important; }
  html body #mobileNav .drawer-visit .dv-hours:not(#_){ color:var(--nv-ink) !important; }
  html body #mobileNav .drawer-visit a.dv-link:not(#_){ color:var(--nv-green-d) !important; }
  html body #mobileNav .drawer-status:not(#_){ background:rgba(8,127,62,.1) !important; color:var(--nv-green) !important; }
  html body #mobileNav .drawer-status.is-closed:not(#_){ background:rgba(200,40,40,.1) !important; color:#c42828 !important; }
  html body #mobileNav .drawer-social a:not(#_){ border:1px solid var(--nv-line) !important; color:var(--nv-green-d) !important; background:var(--nv-white) !important; }
  html body #mobileNav .drawer-social a:active:not(#_){ background:var(--nv-green) !important; border-color:var(--nv-green) !important; color:#fff !important; }
}