/* ============================================================
   Babylon Grill & Pizza — Web-App UI (dark + menu-yellow)
   ============================================================ */
:root{
  --bgp-bg:#1B1A16;
  --bgp-card:#26241E;
  --bgp-card-2:#2E2B23;
  --bgp-accent:#F5D91B;
  --bgp-accent-d:#E8B417;
  --bgp-on-accent:#1B1A16;
  --bgp-price:#F5D91B;
  --bgp-ink:#FAF6E9;
  --bgp-muted:#A79F8C;
  --bgp-line:rgba(250,246,233,.12);
  --bgp-radius:16px;
  --bgp-shadow:0 6px 20px rgba(0,0,0,.35);
  --bgp-shadow-lg:0 14px 40px rgba(0,0,0,.5);
  --bgp-font:'Poppins',-apple-system,'Segoe UI',Tahoma,sans-serif;
}

/* No horizontal panning, ever (clip doesn't create a scroll container, so
   position:sticky keeps working) */
html,body{overflow-x:clip !important;}

/* ---- Typography ---- */
body,button,input,select,textarea,.ast-container,
h1,h2,h3,h4,h5,h6,.orderable-product__title,.wp-block-woocommerce-checkout{font-family:var(--bgp-font) !important;}

/* ---- Brand base: dark "menu look" ---- */
body,#page,.site,.ast-separate-container,.ast-plain-container,
.ast-page-builder-template .site-content{background-color:var(--bgp-bg) !important;}
.ast-separate-container .ast-article-post,.ast-separate-container .ast-article-single{background-color:var(--bgp-bg) !important;}
body,.entry-content,.entry-content p{color:var(--bgp-ink);}
.entry-content a{color:var(--bgp-accent);}
h1,h2,h3,h4,h5,h6{color:var(--bgp-ink);}
.site-header,#masthead,.ast-primary-header-bar,.main-header-bar{background:#14130F !important;border-bottom:3px solid var(--bgp-accent) !important;}
.site-header{box-shadow:0 2px 8px rgba(0,0,0,.35);}
.site-header .site-title a,.site-header .ast-site-identity a,.main-header-menu a{color:var(--bgp-ink) !important;}
.site-title a:hover,.main-header-menu a:hover{color:var(--bgp-accent) !important;}
/* header: keep the logo left and pack the menu next to it (desktop) */
@media (min-width:922px){
  .ast-primary-header-bar .site-primary-header-wrap{display:flex !important;justify-content:flex-start !important;align-items:center !important;gap:30px;}
  .ast-primary-header-bar .site-header-primary-section-left{flex:0 0 auto !important;order:1 !important;}
  .ast-primary-header-bar .site-header-primary-section-right{flex:0 0 auto !important;order:2 !important;}
}

/* category headings: yellow boxed style like the printed menu */
h2.bgp-cat{background:transparent;color:var(--bgp-accent) !important;border:3px solid var(--bgp-accent);
  padding:10px 22px;border-radius:6px;display:table;
  margin:38px auto 8px;font-size:24px;font-weight:800;text-align:center;letter-spacing:.3px;}
p.bgp-cat-desc{text-align:center;color:var(--bgp-muted);font-size:13px;margin:0 auto 18px;max-width:640px;}

/* hide redundant page title on the front page (header already shows the name) */
.home .entry-title,.home .ast-single-entry-title{display:none !important;}

/* ---- Yellow top bar + doodle band ---- */
.bgp-topbar{background:var(--bgp-accent);color:var(--bgp-on-accent);text-align:center;padding:7px 10px;font-weight:800;font-size:13px;letter-spacing:.2px;}
.bgp-doodles{background:#14130F;color:var(--bgp-accent);display:flex;gap:20px;justify-content:center;align-items:center;flex-wrap:wrap;padding:12px 8px;overflow:hidden;border-bottom:1px solid var(--bgp-line);}
.bgp-doodles svg{width:30px;height:30px;flex:0 0 auto;}
@media (max-width:768px){.bgp-doodles{gap:15px;padding:10px 6px;}.bgp-doodles svg{width:26px;height:26px;}}
.price .amount,.woocommerce-Price-amount{color:var(--bgp-price);font-weight:700;}

/* ---- generic brand buttons (before FAB so FAB overrides) ---- */
.orderable-button,.single_add_to_cart_button,.button.checkout,.wc-block-components-button,
.woocommerce a.button,.woocommerce button.button,.woocommerce #respond input#submit{
  background:var(--bgp-accent) !important;border-color:var(--bgp-accent) !important;color:var(--bgp-on-accent) !important;
  border-radius:12px !important;font-weight:700 !important;}
.orderable-button:hover,.woocommerce a.button:hover,.woocommerce button.button:hover{background:var(--bgp-accent-d) !important;color:var(--bgp-on-accent) !important;}

/* ============================================================
   1) Menu list (classic menu rows: name, ingredients smaller underneath,
      price + quick-add on the right)
   ============================================================ */
.orderable-products-list--grid{display:grid !important;grid-template-columns:minmax(0,1fr);gap:0;
  max-width:760px;margin-inline:auto;}
@media (min-width:980px){.orderable-products-list--grid{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:44px;max-width:1100px;}}
.orderable-products-list__item{width:100% !important;max-width:none !important;flex:none !important;margin:0 !important;padding:0 !important;min-width:0;}

/* Product image placeholders hidden until real photos exist.
   To bring images back: delete the display:none rule below and restore the
   old card grid from git/backup — .orderable-product__hero holds the photo. */
.orderable-product__hero,.orderable-product__image{display:none !important;}

.orderable-product{position:relative;width:100%;min-width:0;background:transparent;border:none;box-shadow:none;
  border-radius:0;overflow:visible;display:flex;flex-direction:row !important;
  padding:0 !important;min-height:0 !important;height:auto !important;
  border-bottom:1px solid var(--bgp-line);animation:bgp-rise .5s both;}
.orderable-products-list__item:last-child .orderable-product{border-bottom:none;}
@media (hover:hover){.orderable-product:hover{background:rgba(250,246,233,.03);}}

.orderable-products-list--grid .orderable-product__content-wrap{display:flex !important;flex-direction:row !important;
  flex-wrap:nowrap !important;align-items:center !important;flex:1;min-width:0;padding:13px 4px !important;gap:12px;width:100% !important;}
.orderable-products-list--grid .orderable-product__content{padding:0 !important;flex:1 1 0 !important;min-width:0;
  max-width:none !important;display:flex !important;flex-direction:column !important;gap:3px;text-align:left !important;width:auto !important;}
.orderable-product__title{font-size:15.5px;font-weight:700;line-height:1.3;color:var(--bgp-ink);margin:0;
  overflow-wrap:break-word;text-align:left !important;}
/* ingredients: smaller, muted, under the name; only "Mix din egen" gets clamped (JS adds .bgp-clamp) */
.orderable-product__description{color:var(--bgp-muted);font-size:11.5px;line-height:1.45;margin:0;text-align:left !important;}
.orderable-product__description.bgp-clamp{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;cursor:pointer;}
.orderable-product__description.bgp-clamp.is-open{display:block;-webkit-line-clamp:unset;overflow:visible;}
.bgp-more{background:none;border:none;color:var(--bgp-accent);font-weight:800;font-size:11px;
  padding:2px 0 0;margin:0;cursor:pointer;text-align:left;font-family:var(--bgp-font);align-self:flex-start;}
.orderable-products-list--grid .orderable-product__actions{position:static !important;inset:auto !important;
  margin:0 !important;display:flex !important;
  flex-direction:row !important;align-items:center !important;gap:10px;padding:0 !important;flex:0 0 auto !important;width:auto !important;}
/* hide the "From:" prefix on variable products — show just the price */
.orderable-product__actions-price{margin:0;white-space:nowrap;font-size:0 !important;color:transparent;}
.orderable-product__actions-price .amount{color:var(--bgp-price);font-weight:800;font-size:15px;}
.orderable-product__actions-button{margin:0;}

/* circular "+" quick-add (skips product page, already AJAX) */
.orderable-product__add-to-order,.orderable-product [data-orderable-trigger="add-to-cart"]{
  width:38px !important;height:38px !important;min-width:0 !important;padding:0 !important;border-radius:50% !important;
  background:var(--bgp-accent) !important;border:none !important;color:var(--bgp-on-accent) !important;
  box-shadow:0 4px 12px rgba(245,217,27,.25);display:inline-flex !important;align-items:center;justify-content:center;
  font-size:0 !important;line-height:0;cursor:pointer;transition:transform .18s ease,background .2s ease;}
.orderable-product__add-to-order > *{display:none !important;}
.orderable-product__add-to-order::before,.orderable-product [data-orderable-trigger="add-to-cart"]::before{
  content:"+";font-size:24px;font-weight:700;line-height:1;color:var(--bgp-on-accent);}
.orderable-product__add-to-order:hover{background:var(--bgp-accent-d) !important;transform:scale(1.09);}

/* ============================================================
   2) Cart drawer flyout polish (drawer content stays light)
   ============================================================ */
.orderable-drawer{transition:transform .45s cubic-bezier(.16,1,.3,1) !important;
  box-shadow:var(--bgp-shadow-lg) !important;border-start-start-radius:22px;border-end-start-radius:22px;overflow:hidden;
  background:#211F19 !important;color:var(--bgp-ink) !important;}
.orderable-drawer h1,.orderable-drawer h2,.orderable-drawer h3,.orderable-drawer h4,
.orderable-drawer label,.orderable-drawer .orderable-mini-cart__title,
.orderable-drawer .orderable-mini-cart__item,.orderable-drawer .orderable-mini-cart__item-name,
.orderable-drawer .orderable-mini-cart__totals,.orderable-drawer p{color:var(--bgp-ink) !important;}
.orderable-drawer .orderable-mini-cart__item{border-color:var(--bgp-line) !important;}
.orderable-drawer select,.orderable-drawer input[type="text"],.orderable-drawer input[type="number"]{
  background:#FAF6E9 !important;color:#1B1A16 !important;border-radius:10px !important;}
.orderable-drawer .orderable-drawer__close,.orderable-drawer [data-orderable-trigger="drawer.close"] svg{color:var(--bgp-ink);}
.orderable-drawer .orderable-quantity-roller,.orderable-drawer .orderable-quantity{border-color:var(--bgp-line) !important;color:var(--bgp-ink) !important;}
.orderable-drawer .orderable-quantity button,.orderable-drawer .orderable-quantity input{color:var(--bgp-ink) !important;background:transparent !important;}
/* Orderable's Edit only knows variations — it would drop builder toppings/pricing. */
.orderable-drawer [data-orderable-trigger="edit-cart-item"]{display:none !important;}
.orderable-drawer-overlay{backdrop-filter:blur(3px);background:rgba(10,9,6,.55) !important;transition:opacity .4s ease !important;}
.orderable-drawer__inner{padding-bottom:96px;}
.orderable-drawer.orderable-drawer--open .orderable-drawer__cart .orderable-mini-cart-wrapper .orderable-mini-cart__buttons a.button.checkout,
.orderable-drawer__cart .orderable-mini-cart__buttons a.button.checkout{
  position:sticky;bottom:0;border-radius:14px !important;padding:16px 14px !important;font-size:17px !important;
  background:var(--bgp-accent) !important;border-color:var(--bgp-accent) !important;color:var(--bgp-on-accent) !important;
  text-align:center !important;display:block !important;height:auto !important;line-height:1.4 !important;}

/* ============================================================
   3) Micro-interactions
   ============================================================ */
@keyframes bgp-rise{from{opacity:0;transform:translateY(14px);}to{opacity:1;transform:none;}}
@keyframes bgp-pop{0%{transform:scale(1);}45%{transform:scale(1.28);}100%{transform:scale(1);}}
@keyframes bgp-shimmer{0%{background-position:-450px 0;}100%{background-position:450px 0;}}
@media (prefers-reduced-motion:reduce){.orderable-product{animation:none;}}
.bgp-pop{animation:bgp-pop .5s cubic-bezier(.34,1.56,.64,1);}
.orderable-button--loading,.bgp-skeleton{background:linear-gradient(90deg,#2E2B23 25%,#3A362B 37%,#2E2B23 63%);
  background-size:800px 100%;animation:bgp-shimmer 1.3s infinite linear;}
.bgp-skeleton{border-radius:var(--bgp-radius);min-height:210px;}

/* ============================================================
   4) Mobile app footer nav
   ============================================================ */
.bgp-appbar{display:none;}
@media (max-width:768px){
  .bgp-appbar{display:flex;position:fixed;inset-inline:0;bottom:0;z-index:99990;
    background:rgba(20,19,15,.97);backdrop-filter:blur(10px);
    border-top:1px solid var(--bgp-line);box-shadow:0 -6px 20px rgba(0,0,0,.45);
    padding:6px 2px calc(6px + env(safe-area-inset-bottom,0));justify-content:space-around;}
  .bgp-appbar__tab{flex:1;display:flex;flex-direction:column;align-items:center;gap:3px;
    text-decoration:none;color:var(--bgp-muted);padding:4px 0;transition:color .2s ease;min-width:0;}
  .bgp-appbar__tab svg{width:23px;height:23px;}
  .bgp-appbar__tab span{font-size:10px;font-weight:600;white-space:nowrap;}
  .bgp-appbar__tab.is-active{color:var(--bgp-accent);}
  .bgp-appbar__cart{position:relative;display:inline-flex;}
  .bgp-appbar__badge{position:absolute;top:-7px;inset-inline-end:-9px;min-width:18px;height:18px;padding:0 4px;
    background:var(--bgp-accent);color:var(--bgp-on-accent);border-radius:10px;font-size:11px;font-weight:800;
    display:flex;align-items:center;justify-content:center;box-shadow:0 2px 6px rgba(245,217,27,.4);}
  .bgp-appbar__badge[hidden]{display:none;}
  body{padding-bottom:70px !important;}
  .orderable-floating-cart{bottom:80px !important;}
}

/* ============================================================
   5) Streamlined checkout: light surface card on the dark page
   ============================================================ */
.wp-block-woocommerce-checkout{max-width:640px;margin-inline:auto;background:#FAF6E9;border-radius:var(--bgp-radius);padding:18px 16px;}
.wp-block-woocommerce-checkout,.wp-block-woocommerce-checkout p{color:#1B1A16;}
.wc-block-checkout__main{width:100% !important;}
.wp-block-woocommerce-checkout .wc-block-components-sidebar,.wc-block-checkout__sidebar{width:100% !important;max-width:none !important;}
.wc-block-components-text-input input,.wc-block-components-address-form input{border-radius:12px !important;padding:14px !important;}

.bgp-wallets{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;align-items:center;
  margin:0 auto 18px;padding:14px;background:var(--bgp-card);border:1px solid var(--bgp-line);border-radius:var(--bgp-radius);box-shadow:var(--bgp-shadow);max-width:640px;}
.bgp-wallets__label{width:100%;text-align:center;color:var(--bgp-muted);font-size:12px;margin-bottom:4px;}
.bgp-chip{display:inline-flex;align-items:center;gap:5px;padding:7px 12px;border-radius:10px;
  font-size:12px;font-weight:800;border:1px solid var(--bgp-line);background:var(--bgp-card-2);color:var(--bgp-ink);}
.bgp-chip--cash{color:var(--bgp-accent);}
.bgp-chip--card{color:var(--bgp-ink);}
.bgp-chip--mobilepay{color:#5A78FF;}

/* ============================================================
   "Byg selv" configurator sheet
   ============================================================ */
.bgp-b-lock{overflow:hidden;}
.bgp-b-overlay{position:fixed;inset:0;z-index:100000;background:rgba(10,9,6,.6);backdrop-filter:blur(3px);
  display:flex;align-items:flex-end;justify-content:center;animation:bgp-fade .25s ease;}
@keyframes bgp-fade{from{opacity:0;}to{opacity:1;}}
.bgp-b-sheet{width:100%;max-width:560px;max-height:88vh;background:#211F19;color:var(--bgp-ink);
  border-radius:22px 22px 0 0;display:flex;flex-direction:column;box-shadow:var(--bgp-shadow-lg);
  animation:bgp-slide .32s cubic-bezier(.16,1,.3,1);}
@keyframes bgp-slide{from{transform:translateY(40px);opacity:0;}to{transform:none;opacity:1;}}
@media (min-width:769px){
  .bgp-b-overlay{align-items:center;padding:24px;}
  .bgp-b-sheet{border-radius:22px;max-height:82vh;}
}
.bgp-b-head{display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:14px 18px;background:var(--bgp-accent);color:var(--bgp-on-accent);font-weight:800;font-size:16px;
  border-radius:inherit;border-bottom-left-radius:0;border-bottom-right-radius:0;}
.bgp-b-close{background:none;border:none;font-size:18px;font-weight:800;color:var(--bgp-on-accent);cursor:pointer;padding:2px 6px;}
.bgp-b-body{overflow-y:auto;padding:6px 18px 14px;flex:1;min-height:0;}
.bgp-b-desc{margin:12px 0 0;padding:10px 12px;border-radius:10px;background:var(--bgp-card);
  border:1px solid var(--bgp-line);color:var(--bgp-muted);font-size:13px;line-height:1.5;}
.bgp-b-step{margin-top:16px;}
.bgp-b-step__title{font-size:16px;font-weight:800;color:var(--bgp-ink);margin:0 0 4px;}
.bgp-b-hint{font-size:12px;color:var(--bgp-muted);margin:0 0 10px;}
.bgp-b-hint b{color:var(--bgp-accent);}
.bgp-b-counter{color:var(--bgp-accent);font-weight:700;}
.bgp-b-chips{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;}
@media (min-width:520px){.bgp-b-chips{grid-template-columns:repeat(3,1fr);}}
.bgp-b-chip{display:flex;align-items:center;justify-content:space-between;gap:6px;text-align:left;
  padding:10px 12px;border-radius:12px;border:1px solid var(--bgp-line);background:var(--bgp-card-2);
  color:var(--bgp-ink);font-size:13px;font-weight:600;cursor:pointer;transition:all .15s ease;font-family:var(--bgp-font);}
.bgp-b-chip__price{font-size:11px;font-weight:800;color:var(--bgp-muted);white-space:nowrap;}
.bgp-b-chip.is-on{background:var(--bgp-accent);border-color:var(--bgp-accent);color:var(--bgp-on-accent);}
.bgp-b-chip.is-on .bgp-b-chip__price{color:var(--bgp-on-accent);}
.bgp-b-foot{display:flex;gap:10px;padding:12px 18px calc(12px + env(safe-area-inset-bottom,0));
  border-top:1px solid var(--bgp-line);background:#1B1A16;border-radius:0 0 22px 22px;}
.bgp-b-cancel{flex:0 0 auto;padding:12px 16px;border-radius:12px;border:1px solid var(--bgp-line);
  background:transparent;color:var(--bgp-ink);font-weight:700;cursor:pointer;font-family:var(--bgp-font);}
.bgp-b-qty{flex:0 0 auto;width:88px !important;min-width:0 !important;max-width:88px;border-radius:12px;
  border:1px solid var(--bgp-line);background:var(--bgp-card-2);
  color:var(--bgp-ink);font-weight:700;padding:0 8px;font-family:var(--bgp-font);}
.bgp-b-add{flex:1;padding:12px 16px;border-radius:12px;border:none;background:var(--bgp-accent);
  color:var(--bgp-on-accent);font-weight:800;font-size:15px;cursor:pointer;display:flex;align-items:center;
  justify-content:center;gap:10px;font-family:var(--bgp-font);}
.bgp-b-add:hover{background:var(--bgp-accent-d);}
.bgp-b-add:disabled{opacity:.6;cursor:wait;}
.bgp-b-add__total{background:rgba(0,0,0,.14);border-radius:8px;padding:2px 8px;font-size:13px;}

/* ============================================================
   Mobile hamburger (off-canvas) menu — dark panel + light text
   Astra renders the mobile menu list on a white background (rgb(249,249,249)),
   and our menu text is cream → invisible. Force dark within the mobile range.
   ============================================================ */
@media (max-width:921px){
  .main-header-menu,
  .main-header-menu .sub-menu,
  .ast-mobile-header-content,
  #ast-mobile-header,
  .ast-mobile-popup-drawer .ast-mobile-popup-content,
  .ast-mobile-popup-drawer .main-header-bar-navigation{
    background:var(--bgp-bg) !important;
  }
  .main-header-menu .menu-link,
  .main-header-menu .menu-item > a,
  .main-header-menu .menu-item{background:transparent !important;color:var(--bgp-ink) !important;}
  .main-header-menu .menu-item > a:hover,
  .main-header-menu .menu-item.current-menu-item > a{color:var(--bgp-accent) !important;background:transparent !important;}
  .main-header-menu .menu-item{border-bottom:1px solid var(--bgp-line) !important;}
}

/* ============================================================
   Sticky category quick-access bar
   ============================================================ */
.bgp-catbar{position:sticky;top:0;z-index:60;background:var(--bgp-bg);padding:9px 0;box-shadow:0 5px 14px rgba(0,0,0,.35);}
.bgp-catbar__inner{display:flex;gap:8px;overflow-x:auto;padding:0 12px;scrollbar-width:none;-webkit-overflow-scrolling:touch;}
.bgp-catbar__inner::-webkit-scrollbar{display:none;}
.bgp-catbar__chip{flex:0 0 auto;padding:8px 16px;border-radius:20px;background:var(--bgp-card);color:var(--bgp-ink);
  font-weight:700;font-size:14px;text-decoration:none;border:1px solid var(--bgp-line);white-space:nowrap;
  transition:background .2s,color .2s,border-color .2s;}
.bgp-catbar__chip.is-active{background:var(--bgp-accent);color:var(--bgp-on-accent);border-color:var(--bgp-accent);}