* { box-sizing: border-box; }
body { margin: 0; background: #f4f7f4; color: #203a2d; font: 16px system-ui, sans-serif; }
header, main { padding: 1rem; max-width: 1400px; margin: auto; }
header, nav, form { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem; }
header { border-bottom: 1px solid #ccd9ce; }
a { color: #22563c; }
details, section { background: white; border: 1px solid #ccd9ce; border-radius: 12px; padding: 1rem; margin-block: 1rem; }
summary { cursor: pointer; }
form { margin-top: 1rem; }
label { display: grid; gap: .25rem; }
input, select, button { font: inherit; padding: .45rem .65rem; border: 1px solid #92ad99; border-radius: 6px; }
button { background: #e6f2e9; color: inherit; cursor: pointer; }
button[aria-pressed="true"] { background: #24553e; color: white; }
.shop-layout { display: grid; grid-template-columns: minmax(150px, 1fr) minmax(0, 3fr) minmax(200px, 1.4fr); gap: 1rem; }
.shop-layout > section { min-width: 0; max-height: 52vh; overflow-y: auto; overscroll-behavior: contain; scrollbar-gutter: stable; }
.shop-layout[data-height="tall"] > section { max-height: 70vh; }
#categories, #products { display: grid; gap: .6rem; }
#products { grid-template-columns: repeat(auto-fit, minmax(135px, 1fr)); }
#products article { padding: .75rem; border: 1px solid #ccd9ce; border-radius: 8px; }
h2 { margin-top: 0; font-size: 1.15rem; }
h3 { font-size: 1rem; }
#cart { padding-left: 1.25rem; }
#cart li { margin-bottom: .5rem; }
@media (max-width: 750px) { .shop-layout { grid-template-columns: 1fr; gap: 0; } .shop-layout > section, .shop-layout[data-height="tall"] > section { max-height: none; } }
.shop-banner { display:grid; grid-template-columns:minmax(180px,1fr) 3fr; align-items:center; gap:1rem; }
#shopOffers { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:.6rem; }
#shopOffers button { min-height:80px; background:#dceee1; font-weight:700; }
#shopOffers button:nth-child(even) { background:#f8e9d5; }
#categories button { width:100%; }
.shop-category { position:relative; }
.shop-submenu { display:grid; gap:.35rem; padding:.45rem; background:white; border:1px solid #ccd9ce; border-radius:8px; }
.shop-submenu[hidden] { display:none; }
@media(min-width:751px) {
  .shop-layout > section:first-child { overflow:visible; }
  .shop-submenu { position:absolute; left:100%; top:0; width:180px; z-index:2; box-shadow:0 5px 16px #0002; }
}
@media(max-width:750px) {
  .shop-banner { grid-template-columns:1fr; }
  #shopOffers { grid-template-columns:repeat(2,minmax(0,1fr)); }
}

#shopCheckout {
  box-sizing: border-box;
  width: min(46rem, calc(100% - 2rem));
  border: 1px solid #ccd9ce;
  border-radius: 20px;
  padding: clamp(1rem, 3vw, 1.75rem);
  color: inherit;
  box-shadow: 0 12px 40px #203a2d30;
}
#shopCheckout::backdrop { background: #203a2d38; }
#checkoutForm { margin: 0; }
#checkoutHeading, #checkoutTotals, #checkoutResult { flex-basis: 100%; margin: 0; }
#checkoutForm label { flex: 1 1 13rem; min-width: 0; }
#checkoutForm input { width: 100%; }
#checkoutCancel { background: white; }
#checkoutResult:empty { display: none; }

/* Keep the expanded list inside its scrollable category column. */
.shop-layout > section:first-child { overflow-y: auto; overflow-x: hidden; }
.shop-submenu { position: static; width: auto; margin: .3rem 0 .2rem .6rem; box-shadow: none; }
.shop-submenu p { margin: .3rem; font-size: .9rem; }
.cart-actions { display: flex; flex-wrap: wrap; gap: .5rem; }
#cancelCart { background: white; }

.entry-settings { display:flex; flex-wrap:wrap; gap:.75rem; align-items:end; }
#productForm { display:block; }
.draft-cards { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; margin-block:1rem; }
.draft-cards article { min-width:0; padding:.8rem; border:1px solid #ccd9ce; border-radius:12px; }
.draft-cards label { margin-bottom:.65rem; }
.draft-cards input { width:100%; min-width:0; }
.draft-cards canvas { display:block; width:100%; border-radius:8px; cursor:grab; touch-action:none; }
.draft-cards canvas:active { cursor:grabbing; }
.draft-cards [hidden] { display:none; }
@media(max-width:700px) { .draft-cards { grid-template-columns:1fr; } }

.entry-layout, .private-shop .shop-layout { display:grid; grid-template-columns:minmax(10rem, 1fr) minmax(0, 4fr); gap:1rem; }
.entry-layout aside, .entry-layout > div { min-width:0; }
#entryCategories { display:grid; grid-template-columns:minmax(0,1fr); gap:.4rem; max-height:65vh; overflow-y:auto; padding-inline-end:.25rem; }
#entryCategories button {
  width:100%;
  min-width:0;
  min-height:44px;
  text-align:left;
  white-space:normal;
  overflow-wrap:anywhere;
}
#entryCategories .shop-submenu {
  grid-template-columns:minmax(0,1fr);
  margin:.35rem 0 0;
  padding:0;
  border:0;
  background:transparent;
}
#entryCategories .shop-submenu button { padding-inline-start:1rem; }
.entry-image, .product-media { position:relative; display:grid; place-items:center; overflow:hidden; border-radius:8px; background:#edf1e8; aspect-ratio:3/2; }
.entry-image canvas, .product-media img { width:100%; height:100%; object-fit:cover; }
.entry-image { margin-bottom:.75rem; }
.entry-image .crop-tip { position:absolute; pointer-events:none; background:#203a2de6; color:white; border-radius:.45rem; padding:.3rem .55rem; }
.product-media { font-size:2.5rem; }
.product-actions { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:.5rem; }
.private-shop #products { grid-template-columns:repeat(3,minmax(0,1fr)); }
.private-shop .shop-layout > section:nth-child(2) { max-height:none; }
#reviewDashboard h2:not(:first-child), #reviewActions, .review-choice { margin-top:1rem; }
.review-choice { display:flex; align-items:center; gap:.4rem; margin-bottom:.5rem; }
#products input[type=number] { width:100%; }
.primary-shop { background:#24553e; color:white; }
button:disabled { opacity:.65; cursor:default; }
@media(max-width:750px) {
  .entry-layout, .private-shop .shop-layout { grid-template-columns:1fr; }
  .private-shop #products { grid-template-columns:repeat(auto-fit,minmax(min(100%,12rem),1fr)); }
  #entryCategories { max-height:24rem; align-content:start; }
}
#entryCategories .shop-submenu[hidden] { display:none; }
.photo-controls { display:flex; gap:.35rem; align-items:end; margin-bottom:.65rem; }
.photo-controls label { min-width:0; flex:1; margin-bottom:0; }
.photo-controls button { flex:none; }
.entry-layout [hidden] { display:none !important; }

/* Keep branch and category in the original row, above the regional filters. */
.entry-location {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  align-items:start;
  margin-top:.65rem;
}
.entry-location label { min-width:0; }
.entry-location input, .entry-location select {
  width:100%;
  min-width:0;
  height:44px;
}
.entry-location output { grid-column:1 / -1; }
@media (max-width:560px) {
  .entry-location { grid-template-columns:minmax(0,1fr); }
}
.entry-location output:empty { display:none; }
@media (min-width: 1000px) {
  #products { grid-template-columns:repeat(3,minmax(0,1fr)); }
}

.entry-heading { padding:0; border:0; justify-content:space-between; }
.entry-heading h1 { margin:0; }
.entry-heading-actions { display:flex; flex-wrap:wrap; align-items:center; gap:.85rem; }
.entry-heading-actions .entry-shop-management {
  display:inline-flex;
  align-items:center;
  min-height:44px;
  padding:0 .9rem;
  border:1px solid #d6e2ce;
  border-radius:10px;
  background:#f2f6ee;
  color:#214637;
  font-weight:700;
  text-decoration:none;
}
.entry-heading-actions .entry-shop-management:hover,
.entry-heading-actions .entry-shop-management:focus-visible { border-color:#4c685a; }
.entry-heading-actions label { display:flex; flex-wrap:wrap; align-items:center; gap:.4rem; }
@media (min-width: 751px) {
  .entry-layout > aside {
    display:flex;
    flex-direction:column;
    min-height:clamp(26rem, 60vh, 38rem);
  }
  #entryCategories {
    flex:1;
    min-height:0;
    max-height:none;
    contain:size;
    align-content:start;
  }
}

#sellerNotices {
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:.65rem;
}
#sellerNotices > p {
  margin:0;
  padding:.65rem;
  border:1px solid #c7d8cc;
  border-radius:.55rem;
  overflow-wrap:anywhere;
}
#sellerNotices button { margin-block:.25rem; }
@media (min-width: 650px) {
  #sellerNotices { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (min-width: 1050px) {
  #sellerNotices { grid-template-columns:repeat(3,minmax(0,1fr)); }
}

@media (min-width: 751px) {
  .draft-shop .shop-layout > section:nth-child(2) { min-height:15rem; }
  .draft-shop .shop-layout > section:first-child {
    contain:size;
    max-height:none;
  }
}

.shop-preview-page main > nav { gap:.4rem; }
.shop-preview-page main > nav a {
  padding:.4rem .65rem;
  border:1px solid #ccd9ce;
  border-radius:.5rem;
  background:#fff;
  text-decoration:none;
}
.shop-preview-page #shopOffers { grid-template-columns:repeat(auto-fit,minmax(min(100%,8rem),1fr)); }
.shop-preview-page #shopOffers button { min-height:56px; }
.shop-preview-page #products article { min-width:0; }
@media (min-width: 1150px) {
  .shop-preview-page:not(.private-shop) .shop-layout {
    grid-template-columns:minmax(150px,1fr) minmax(0,4fr) minmax(180px,1.25fr);
  }
  
}
.shop-preview-page #shopOffers { display:block; min-width:0; }
.shop-offer-grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:.5rem;
}
.shop-offer-controls {
  display:flex;
  justify-content:flex-end;
  gap:.35rem;
  margin-top:.35rem;
}
.shop-preview-page .shop-offer-controls button { min-height:0; padding:.25rem .6rem; }
@media(max-width:480px) {
  .shop-offer-grid { grid-template-columns:repeat(auto-fit,minmax(min(100%,8rem),1fr)); }
}
.shop-branch-row { display:flex; flex-wrap:wrap; gap:.6rem; align-items:end; }
.shop-branch-row > label { flex:1 1 14rem; min-width:0; }
.shop-branch-row .shop-offer-controls { margin:0; }

@media (min-width: 751px) {
  .shop-preview-page:not(.private-shop) #products {
    grid-template-columns:repeat(3,minmax(0,1fr));
    align-items:start;
  }
  .shop-preview-page:not(.private-shop) .shop-layout > section {
    min-height:608px;
    max-height:none;
  }
  .shop-preview-page:not(.private-shop) .shop-layout[data-height="tall"] > section {
    min-height:704px;
  }
}
@media (min-width: 751px) {
  .shop-preview-page:not(.private-shop) .shop-layout > section:first-child {
    max-height:608px;
  }
  .shop-preview-page:not(.private-shop) .shop-layout[data-height="tall"] > section:first-child {
    max-height:704px;
  }
}

.shop-preview-page:not(.private-shop) .product-actions {
  flex-wrap:nowrap;
  justify-content:flex-start;
  gap:.4rem;
}
.shop-preview-page:not(.private-shop) .product-actions strong { white-space:nowrap; }
.shop-preview-page:not(.private-shop) .product-actions button {
  min-width:0;
  padding-inline:.45rem;
}
@media (min-width: 751px) {
  .shop-preview-page .shop-layout { --shop-panel-height:608px; }
  .shop-preview-page .shop-layout[data-height="tall"] { --shop-panel-height:704px; }
  .shop-preview-page:not(.private-shop) .shop-layout > section,
  .shop-preview-page:not(.private-shop) .shop-layout[data-height="tall"] > section {
    min-height:0;
    height:var(--shop-panel-height);
    max-height:var(--shop-panel-height);
    overflow-y:auto;
  }
}

#draftPalette[hidden] { display:none; }
#drafts { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:.65rem; margin-block:.7rem; }
.draft-summary-card { min-width:0; padding:.65rem; border-radius:.65rem; overflow-wrap:anywhere; }
.draft-summary-card img, .draft-summary-placeholder {
  display:block; width:100%; aspect-ratio:2/1; object-fit:cover; border-radius:.45rem;
}
.draft-summary-placeholder { display:grid; place-items:center; background:#ffffff80; }
.draft-summary-card h3 { margin:.55rem 0 .25rem; }
.draft-summary-card p { margin:0; }
@media(max-width:850px) { #drafts { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:420px) { #drafts { grid-template-columns:1fr; } }

@media (min-width:1050px) {
  #drafts { grid-template-columns:repeat(8,minmax(0,1fr)); }
}

/* Match the storefront's three-column geometry in the embedded draft preview. */
.shop-preview-page.draft-shop main { padding-inline:0; }
.shop-preview-page.draft-shop .product-actions {
  flex-wrap:nowrap;
  justify-content:flex-start;
  gap:.4rem;
}
.shop-preview-page.draft-shop .product-actions button { min-width:0; padding-inline:.45rem; }
@media (min-width:751px) {
  .shop-preview-page.draft-shop .shop-layout {
    grid-template-columns:minmax(150px,1fr) minmax(0,3fr) minmax(200px,1.4fr);
  }
  .shop-preview-page.draft-shop .shop-layout > section {
    contain:none;
    min-height:0;
    height:var(--shop-panel-height);
    max-height:var(--shop-panel-height);
    overflow-y:auto;
  }
}
@media (min-width:1150px) {
  .shop-preview-page.draft-shop .shop-layout {
    grid-template-columns:minmax(150px,1fr) minmax(0,4fr) minmax(180px,1.25fr);
  }
}

.shop-preview-page:not(.review-shop) #products article { padding:.55rem; }
.shop-preview-page:not(.review-shop) #products h3 { margin:.55rem 0; overflow-wrap:anywhere; }
.shop-preview-page:not(.review-shop) #products article > p { margin:.35rem 0; }
.shop-preview-page:not(.review-shop) #products .product-media { aspect-ratio:2/1; font-size:2rem; }
.shop-preview-page:not(.review-shop) #products .product-actions { font-size:.875rem; }
.shop-preview-page:not(.review-shop) #products .product-actions button { padding:.35rem .4rem; }
@media (min-width:1050px) {
  .shop-preview-page:not(.review-shop) #products { grid-template-columns:repeat(4,minmax(0,1fr)); }
}
.cart-icon-button { display:inline-grid; place-items:center; min-height:32px; }
.shop-cart-heading, #cart li { display:flex; align-items:center; gap:.4rem; }
.shop-cart-heading h2 { margin:0; }
.shop-cart-heading button, #cart li button { flex:none; margin-left:auto; }
#cart { padding-left:0; }
.shop-preview-page #products article h3 { margin:.35rem 0 .15rem; }
#addCartFeedback {
  position:fixed; bottom:1rem; right:1rem; z-index:10;
  background:#24553e; color:#fff; border-radius:.55rem; padding:.65rem .9rem;
}

.shop-cart-heading, #cart li { margin-inline-end:-.4rem; }
.shop-cart-heading button, #cart li button { width:2.4rem; }
.shop-preview-page:not(.review-shop) #products article h3 { margin:.4rem 0 .1rem; }
.shop-preview-page:not(.review-shop) #products .product-actions { justify-content:space-between; align-items:end; }
.shop-preview-page:not(.review-shop) #products .product-actions .cart-icon-button {
  min-width:2.65rem;
  min-height:1.9rem;
  padding:.2rem .55rem;
}

.shop-preview-page:not(.review-shop) #products .product-media {
  aspect-ratio:auto;
  height:144px;
}
.shop-preview-page:not(.review-shop) #products .product-actions { align-items:center; }
.shop-product-details { min-width:0; overflow-wrap:anywhere; }
.shop-preview-page:not(.review-shop) #products .shop-product-details h3 { margin:.2rem 0 0; }
.shop-preview-page:not(.review-shop) #products .cart-icon-button { flex:none; }
@media (min-width:751px) {
  .shop-preview-page .shop-layout { --shop-panel-height:1240px; }
  .shop-preview-page .shop-layout[data-height="tall"] { --shop-panel-height:1320px; }
}

/* Keep the category rail aligned with the editor as new rows appear. */
.entry-layout > aside {
  border:1px solid #ccd9ce;
  border-radius:12px;
  padding:.75rem;
  position:relative;
  padding-bottom:2rem;
}
.entry-layout > aside.entry-rail-resized {
  display:flex;
  flex-direction:column;
  min-height:180px;
  align-self:start;
}
.entry-rail-resized #entryCategories {
  flex:1;
  min-height:0;
  max-height:none;
  align-content:start;
}
.entry-category-grip {
  position:absolute;
  right:.3rem;
  bottom:.2rem;
  width:36px;
  height:28px;
  padding:0;
  display:grid;
  place-items:center;
  background:#f2f6ee;
  cursor:ns-resize;
  touch-action:none;
}
.entry-category-grip:focus-visible { outline:2px solid #214637; outline-offset:2px; }
.entry-layout #entryCategories, .entry-editor {
  overflow-y:auto;
  overscroll-behavior-y:contain;
  scrollbar-gutter:stable;
}
.entry-editor {
  max-height:max(24rem, 88vh);
  padding-inline-end:.5rem;
}
.entry-editor .entry-image { aspect-ratio:2/1; }
.entry-editor .entry-image canvas { position:absolute; inset:0; }
.entry-editor .draft-cards article { min-width:0; }
.entry-editor .draft-cards input { min-width:0; max-width:100%; }

@media (min-width:751px) {
  .entry-layout { grid-template-columns:clamp(150px, 16%, 220px) minmax(0, 1fr); }
  .shop-preview-page:not(.review-shop) .shop-layout {
    --shop-sidebar:clamp(150px, 16%, 220px);
    grid-template-columns:var(--shop-sidebar) minmax(0, 1fr) var(--shop-sidebar);
  }
}
@media (min-width:1050px) {
  .entry-editor .draft-cards { grid-template-columns:repeat(4,minmax(0,1fr)); }
}

.shop-home-link {
  padding:.4rem .65rem;
  border:1px solid #92ad99;
  border-radius:6px;
  background:#e6f2e9;
  text-decoration:none;
}
