/* ===== GH Marination – compact, 2-column desktop layout ===== */

/* Overall form + spacing */
.ghb form{
  max-width:1100px;              /* keep centered, not super narrow */
  margin:0 auto;
  padding:1rem 1rem .75rem;
  border:1px solid #e5e7eb;
  border-radius:12px;
  background:#fff;
}
.ghb fieldset{
  padding:.75rem;
  margin:.75rem 0;
  background:#fafafa;
  border:1px solid #e5e7eb;
  border-radius:12px;
}
.ghb legend{font-weight:700;font-size:1rem;margin-bottom:.35rem}
.ghb label{margin:0}
.ghb select,.ghb input[type="number"],.ghb textarea{
  padding:.5rem .6rem; border:1px solid #d1d5db; border-radius:10px;
}
.ghb textarea{min-height:84px}
.ghb .muted{color:#6b7280;font-size:.9rem}

/* Tighter radios/rows */
.ghb .unit-row{display:flex;flex-wrap:wrap;gap:.75rem;align-items:center}
.ghb .unit-row .inputs{margin-left:auto;display:flex;gap:.5rem}
.ghb .unit-row .inputs input{height:38px}

/* Item image + select more compact on desktop */
@media (min-width: 992px){
  .ghb .media{display:grid;grid-template-columns:220px 1fr;gap:1rem;align-items:start}
  .ghb .media .thumb{width:220px;aspect-ratio:4/3;object-fit:cover;border-radius:10px;border:1px solid #e5e7eb}
}

/* Put TRIM and WEIGHT/QTY side-by-side on desktop */
@media (min-width: 992px){
  /* First two fieldsets in the form are Trim + Unit; place them in two columns */
  .ghb #gh_trim_fs,
  .ghb form fieldset:nth-of-type(2){
    display:inline-block;
    width:calc(50% - .5rem);
    vertical-align:top;
    margin-right:.5rem;
  }
}

/* Cuts as 3 columns on desktop, 2 on tablets, 1 on phones */
.ghb #gh_cuts{display:grid;gap:.3rem 1rem}
@media (min-width: 1200px){ .ghb #gh_cuts{grid-template-columns:repeat(3,minmax(0,1fr));} }
@media (min-width: 640px) and (max-width:1199px){ .ghb #gh_cuts{grid-template-columns:repeat(2,minmax(0,1fr));} }

/* Masala + Spice row already two columns; tighten their gap */
.ghb .grid[style*="grid-template-columns"]{gap:.75rem 1.25rem !important}

/* Price box & buttons float right on desktop to tighten page length */
@media (min-width: 992px){
  .ghb .pricebox, .ghb .actions{max-width:420px;margin-left:auto}
}

/* Smaller vertical gaps overall on big screens */
@media (min-width:992px){
  .ghb fieldset{margin:.5rem 0}
}
.home .page-title, .home .entry-title, .home .breadcrumb, .home .page-header,
.home .woocommerce-breadcrumb, .home .page-header-wrap { display:none !important; height:0!important; padding:0!important; margin:0!important; }
.home .site-main { padding-top:0 !important; }




/* Break #gh-home out of the theme’s boxed wrapper */
@media (min-width: 1100px){
  #gh-home{
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
    width: 100vw !important;
  }
  #gh-home .gh-container{
    max-width: min(1600px,96vw) !important; /* inner comfort width */
    padding-left: min(4vw,36px) !important;
    padding-right: min(4vw,36px) !important;
  }
}



/* Full-width stretch for shortcode container */
#gh-marination-builder {
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
  width: 100vw !important;
  max-width: 100vw !important;
  box-sizing: border-box !important;
}

/* Inner spacing control so content isn’t touching the edges */
#gh-marination-builder > * {
  padding-left: min(3vw, 30px) !important;
  padding-right: min(3vw, 30px) !important;
}

/* Optional: center the whole section below your header */
#gh-marination-builder {
  display: block !important;
  margin-top: 0 !important;
}

/* 1) Break any theme container that holds THIS form */
:where(.container, .wrap, .site-content, .entry-content, .elementor-container, .woocommerce):has(form.grid) {
  max-width: 100vw !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* 2) Make the form full-bleed */
form.grid{
  width: 100vw !important;
  max-width: 80vw !important;
  margin-left: calc(65% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
  box-sizing: border-box !important;
}

/* 3) Comfortable inner padding so content isn’t glued to the edges */
form.grid > *{
  padding-left: min(3vw, 32px) !important;
  padding-right: min(3vw, 32px) !important;
}







/* ===== FULL BLEED when the page contains the menu block (.gh-tv-menu) ===== */
body:has(.gh-tv-menu),
body:has(.gh-tv-menu) html {
  background:#2a1810 !important;
}

/* Kill theme wrappers only on pages that have the menu */
body:has(.gh-tv-menu) .site,
body:has(.gh-tv-menu) #page,
body:has(.gh-tv-menu) .content-area,
body:has(.gh-tv-menu) .wrap,
body:has(.gh-tv-menu) .container,
body:has(.gh-tv-menu) .entry-content,
body:has(.gh-tv-menu) .wp-block-group,
body:has(.gh-tv-menu) .wp-block-group__inner-container,
body:has(.gh-tv-menu) .alignwide,
body:has(.gh-tv-menu) .alignfull {
  max-width:vw !important;
  width:vw !important;
  margin: !important;
  padding: !important;
  background:#2a1810 !important;
}

/* Stretch the shortcode block to the edges */
body:has(.gh-tv-menu) .gh-tv-menu{
  width:100vw !important;
  margin-left:calc(50% - 50vw) !important;
  margin-right:calc(50% - 50vw) !important;
}

/* Remove inner gutter/rounding so content reaches edges (set 1vw if you want a tiny gutter) */
body:has(.gh-tv-menu) .ghmm-container{
  border-radius:0 !important;
  box-shadow:none !important;
  padding-left:0 !important;
  padding-right:0 !important;
  box-sizing:border-box;
}

/* Let the grid truly span full width and adapt */
body:has(.gh-tv-menu) .ghmm-grid{
  max-width:none !important;
  padding:0 !important;
  column-gap:2.5vw !important;
  row-gap:1.6rem !important;
  grid-template-columns:repeat(auto-fit, minmax(280px, 1fr)) !important;
}

/* Responsive text (reads well on phones + TVs) */
body:has(.gh-tv-menu) .ghmm-title{ font-size:clamp(28px, 6vw, 84px) !important; }
body:has(.gh-tv-menu) .ghmm-section{ font-size:clamp(18px, 2.2vw, 30px) !important; }
body:has(.gh-tv-menu) .ghmm-item{ font-size:clamp(14px, 1.8vw, 26px) !important; }


/* === Great Halal Classic Poster Colors & Fonts === */
:root {
  --gh-red: #e60000;
  --gh-green: #00c853;
  --gh-yellow: #fff200;
  --gh-text: #000;
  --gh-bg: #fff;
}

/* Page layout reset */
body:has(.gh-menu-classic) {
  background: var(--gh-bg) !important;
  overflow: auto;
}

/* Base font scaling for TV */
.gh-menu-classic {
  font-family: "Inter", "Arial", sans-serif;
  color: var(--gh-text);
  font-size: clamp(14px, 2.4vmin, 28px);
  line-height: 1.3;
  padding: 2vmin 3vmin;
}

/* Title + Banner */
.ghc-title {
  font-family: "Playfair Display", serif;
  font-size: clamp(28px, 6vmin, 80px);
  font-weight: 900;
  letter-spacing: 1px;
}
.ghc-red { color: var(--gh-red); }
.ghc-green { color: var(--gh-green); }
.ghc-cert { color: #c47f00; font-style: italic; font-size: clamp(14px, 2.2vmin, 24px); }

/* Headings (category labels like Chicken, Beef, etc.) */
.ghc-cat {
  background: var(--gh-red);
  color: #fff;
  font-weight: 900;
  display: inline-block;
  padding: 0.2em 0.6em;
  border-radius: 4px;
  margin: 0 0 0.4em 0;
  font-size: clamp(18px, 3.6vmin, 42px);
  letter-spacing: 0.5px;
}

/* Item layout */
.ghc-item {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 0.8vmin;
  padding: 0.2vmin 0;
}
.ghc-name {
  font-weight: 600;
}
.ghc-price {
  font-weight: 900;
}

/* Highlight first item (like Chicken Karahi row) */
.ghc-items li:first-child .ghc-name {
  color: var(--gh-green);
  font-weight: 800;
}
.ghc-items li:first-child .ghc-price {
  background: var(--gh-yellow);
  padding: 0.1em 0.3em;
  border-radius: 3px;
}

/* Snacks and Today Special sections */
.ghc-snacks h2,
.ghc-special h2 {
  background: var(--gh-red);
  color: #fff;
  font-weight: 900;
  display: inline-block;
  padding: 0.2em 0.6em;
  border-radius: 4px;
  font-size: clamp(18px, 3.6vmin, 42px);
}

/* Center Promo Area */
.ghc-promo {
  border: 3px solid var(--gh-text);
  border-radius: 10px;
  min-height: 38vmin;
  display: grid;
  place-items: center;
  font-weight: 700;
  font-size: clamp(16px, 3vmin, 32px);
}

/* Responsive adjustments */
@media (max-width: 768px) {
  .gh-menu-classic {
    font-size: clamp(14px, 4vmin, 24px);
    padding: 1rem;
  }
  .ghc-cat {
    font-size: clamp(18px, 4.2vmin, 32px);
  }
  .ghc-item {
    grid-template-columns: 1fr auto;
  }
  .ghc-promo {
    min-height: 50vmin;
  }
}



/* Food Menu Css  */
/* === Great Halal Classic Poster Colors & Fonts === */
:root {
  --gh-red: #e60000;
  --gh-green: #00c853;
  --gh-yellow: #fff200;
  --gh-text: #000;
  --gh-bg: #fff;
}

/* Page layout reset */
body:has(.gh-menu-classic) {
  background: var(--gh-bg) !important;
  overflow: auto;
}

/* Base font scaling for TV */
.gh-menu-classic {
  font-family: "Inter", "Arial", sans-serif;
  color: var(--gh-text);
  font-size: clamp(14px, 2.4vmin, 28px);
  line-height: 1.3;
  padding: 2vmin 3vmin;
}

/* Title + Banner */
.ghc-title {
  font-family: "Playfair Display", serif;
  font-size: clamp(28px, 6vmin, 80px);
  font-weight: 900;
  letter-spacing: 1px;
}
.ghc-red { color: var(--gh-red); }
.ghc-green { color: var(--gh-green); }
.ghc-cert { color: #c47f00; font-style: italic; font-size: clamp(14px, 2.2vmin, 24px); }

/* Headings (category labels like Chicken, Beef, etc.) */
.ghc-cat {
  background: var(--gh-red);
  color: #fff;
  font-weight: 900;
  display: inline-block;
  padding: 0.2em 0.6em;
  border-radius: 4px;
  margin: 0 0 0.4em 0;
  font-size: clamp(18px, 3.6vmin, 42px);
  letter-spacing: 0.5px;
}

/* Item layout */
.ghc-item {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 0.8vmin;
  padding: 0.2vmin 0;
}
.ghc-name {
  font-weight: 600;
}
.ghc-price {
  font-weight: 900;
}

/* Highlight first item (like Chicken Karahi row) */
.ghc-items li:first-child .ghc-name {
  color: var(--gh-green);
  font-weight: 800;
}
.ghc-items li:first-child .ghc-price {
  background: var(--gh-yellow);
  padding: 0.1em 0.3em;
  border-radius: 3px;
}

/* Snacks and Today Special sections */
.ghc-snacks h2,
.ghc-special h2 {
  background: var(--gh-red);
  color: #fff;
  font-weight: 900;
  display: inline-block;
  padding: 0.2em 0.6em;
  border-radius: 4px;
  font-size: clamp(18px, 3.6vmin, 42px);
}

/* Center Promo Area */
.ghc-promo {
  border: 3px solid var(--gh-text);
  border-radius: 10px;
  min-height: 38vmin;
  display: grid;
  place-items: center;
  font-weight: 700;
  font-size: clamp(16px, 3vmin, 32px);
}

/* Responsive adjustments */
@media (max-width: 768px) {
  .gh-menu-classic {
    font-size: clamp(14px, 4vmin, 24px);
    padding: 1rem;
  }
  .ghc-cat {
    font-size: clamp(18px, 4.2vmin, 32px);
  }
  .ghc-item {
    grid-template-columns: 1fr auto;
  }
  .ghc-promo {
    min-height: 50vmin;
  }
}