:root {
  --ink: #1d2928;
  --muted: #697572;
  --green: #b8ed74;
  --green-dark: #274b39;
  --paper: #f4fbfa;
  --line: #e7eeeb;
  --serif: Georgia, "Times New Roman", serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--ink);
  background: #fff;
  font-family: "DM Sans", sans-serif;
  -webkit-font-smoothing: antialiased;
}
a { color: inherit; text-decoration: none; }
button, input { font: inherit; }
button { color: inherit; }
.announcement {
  min-height: 34px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  color: #f7fbf6;
  background: #29493c;
  font-size: 11px;
  letter-spacing: .01em;
}
.announcement a { margin-left: 7px; color: #c4f394; font-weight: 700; }
.announcement-dot { width: 6px; height: 6px; border-radius: 50%; background: #b8ed74; }
.site-header {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  gap: 30px;
  min-height: 78px;
  padding: 0 max(5.5vw, calc((100vw - 1320px) / 2));
  background: #fff;
  border-bottom: 1px solid #f1f3f1;
}
.brand { display: inline-flex; align-items: center; gap: 9px; flex: 0 0 auto; font-family: Manrope, sans-serif; font-size: 20px; line-height: .9; font-weight: 800; letter-spacing: -.9px; }
.brand-name { color: var(--ink); font-family: Manrope, sans-serif; font-size: 18px; font-weight: 800; letter-spacing: -.7px; }
.brand > span:last-child > span { color: #83c853; }
.brand small { display: block; padding-top: 5px; font: 700 7px "DM Sans", sans-serif; letter-spacing: 2px; }
.brand-mark { width: 33px; height: 33px; display: grid; place-items: center; border-radius: 11px; background: #dbf4c4; }
.brand-mark svg { width: 22px; fill: #345f3e; }
.delivery-location { display: flex; align-items: center; gap: 8px; min-width: 118px; padding-left: 20px; border-left: 1px solid var(--line); }
.pin-icon { font-size: 25px; color: #48815c; line-height: 1; }
.delivery-location small, .delivery-location strong { display: block; }
.delivery-location small { margin-bottom: 3px; color: #8a9490; font-size: 9px; }
.delivery-location strong { font-size: 11px; }
.delivery-location strong span { color: #88938e; }
.search { display: flex; align-items: center; flex: 1; max-width: 320px; gap: 9px; padding: 10px 12px; border-radius: 7px; background: #f5f8f6; }
.search svg { width: 16px; flex: 0 0 auto; fill: none; stroke: #64736b; stroke-width: 1.7; }
.search input { width: 100%; min-width: 0; border: 0; outline: 0; color: var(--ink); background: transparent; font-size: 10px; }
.search input::placeholder { color: #99a29e; }
.search kbd { padding: 3px 5px; border: 1px solid #e2e9e5; border-radius: 4px; color: #9ba49f; font: 9px "DM Sans", sans-serif; white-space: nowrap; }
.header-links { display: flex; align-items: center; gap: 23px; margin-left: auto; }
.header-links a, .icon-action { font-size: 10px; font-weight: 600; }
.header-links a span { color: #7a857e; }
.tiny-new { margin-left: 4px; padding: 2px 4px; border-radius: 3px; color: #456d3e !important; background: #eaf7de; font-size: 7px; letter-spacing: .03em; }
.icon-action { position: relative; display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
.icon-action svg { width: 16px; fill: none; stroke: #45574c; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.cart-button { padding: 0; border: 0; background: transparent; cursor: pointer; }
.cart-button b { position: absolute; top: -8px; left: 12px; min-width: 14px; padding: 2px 4px; border-radius: 8px; color: #fff; background: #4d7e40; font-size: 8px; text-align: center; }
.mobile-menu { display: none; padding: 0; border: 0; background: none; font-size: 20px; }

main { overflow: hidden; }
.hero {
  position: relative;
  display: grid;
  grid-template-columns: 1fr 1.03fr;
  align-items: center;
  max-width: 1320px;
  min-height: 510px;
  margin: 28px auto 0;
  padding: 45px 6.2%;
  overflow: hidden;
  border-radius: 14px;
  background: #c9efda;
}
.hero::before { position: absolute; right: 37%; bottom: -240px; width: 480px; height: 480px; border: 1px solid rgba(56,108,76,.14); border-radius: 50%; content: ""; }
.hero-copy { position: relative; z-index: 1; max-width: 470px; padding-bottom: 13px; }
.eyebrow, .section-kicker { color: #54805e; font-size: 10px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.eyebrow { display: inline-flex; align-items: center; gap: 8px; margin-bottom: 19px; }
.eyebrow span { width: 7px; height: 7px; border-radius: 50%; background: #569653; box-shadow: 0 0 0 4px #b5e4c5; }
h1, h2, h3, p { margin-top: 0; }
.hero h1 { margin: 0; font-family: Manrope, sans-serif; font-size: clamp(52px, 6.3vw, 82px); font-weight: 800; letter-spacing: -.075em; line-height: .99; }
.hero h1 span { color: #386745; }
.hero-copy > p { max-width: 355px; margin: 22px 0 23px; color: #415e4a; font-size: 13px; line-height: 1.7; }
.hero-actions { display: flex; align-items: center; gap: 20px; }
.button { display: inline-flex; align-items: center; justify-content: center; gap: 17px; min-height: 43px; padding: 0 17px; border-radius: 5px; font-size: 10px; font-weight: 700; transition: transform .2s, background .2s; }
.button:hover { transform: translateY(-2px); }
.button-dark { color: #fff; background: #263d31; }
.button-dark:hover { background: #355844; }
.text-link { display: inline-flex; align-items: center; gap: 8px; font-size: 10px; font-weight: 700; }
.play-icon { display: grid; width: 23px; height: 23px; place-items: center; border: 1px solid #78917d; border-radius: 50%; color: #36563e; font-size: 7px; }
.hero-proof { display: flex; align-items: center; gap: 10px; margin-top: 33px; color: #55705b; font-size: 9px; }
.hero-proof strong { color: #253e2e; }
.avatar-stack { display: flex; padding-left: 4px; }
.avatar-stack img { width: 25px; height: 25px; margin-left: -5px; border: 2px solid #c9efda; border-radius: 50%; object-fit: cover; }
.hero-visual { position: relative; align-self: stretch; min-height: 400px; }
.hero-image { position: absolute; inset: -45px -11% -45px 0; background: linear-gradient(90deg, rgba(201,239,218,0) 0%, rgba(201,239,218,.06) 100%), url("https://images.unsplash.com/photo-1559839734-2b71ea197ec2?auto=format&fit=crop&w=1100&q=90") center 34% / cover no-repeat; clip-path: ellipse(75% 73% at 56% 51%); mix-blend-mode: multiply; }
.hero-sticker { position: absolute; right: -3%; top: 11%; display: flex; align-items: center; gap: 8px; padding: 12px 15px; border: 1px solid rgba(44,83,56,.1); border-radius: 9px; background: rgba(255,255,255,.88); box-shadow: 0 10px 30px rgba(50,81,56,.08); font-size: 9px; line-height: 1.5; }
.sticker-icon { color: #6b9d54; font-size: 25px; }
.hero-sticker strong { font-size: 11px; }
.delivery-card { position: absolute; right: 2%; bottom: 3%; display: flex; align-items: center; gap: 11px; min-width: 230px; padding: 11px 13px; border: 1px solid rgba(49,86,58,.1); border-radius: 8px; background: #fff; box-shadow: 0 12px 35px rgba(54,87,61,.1); }
.delivery-card-icon { display: grid; width: 30px; height: 30px; place-items: center; border-radius: 7px; color: #386745; background: #e8f6db; font-size: 20px; }
.delivery-card strong, .delivery-card small { display: block; }
.delivery-card strong { font-size: 9px; }
.delivery-card small { margin-top: 3px; color: #829088; font-size: 8px; }
.delivery-arrow { margin-left: auto; color: #547c57; }
.hero-index { position: absolute; right: 24px; bottom: 17px; display: flex; align-items: center; gap: 8px; color: #53745a; font-size: 9px; }
.hero-index span { color: #213c2c; font-weight: 700; }
.hero-index i { width: 35px; height: 1px; background: #8daf91; }

.trust-strip { display: flex; align-items: center; justify-content: space-between; max-width: 1160px; margin: 0 auto; padding: 27px 12px; border-bottom: 1px solid var(--line); }
.trust-strip > div { display: flex; align-items: center; gap: 10px; }
.trust-icon { display: grid; width: 31px; height: 31px; place-items: center; border-radius: 50%; color: #4c7f4f; background: #eff8e9; font-size: 15px; }
.trust-strip strong, .trust-strip small { display: block; }
.trust-strip strong { font-size: 10px; }
.trust-strip small { margin-top: 3px; color: #8a948e; font-size: 9px; }
.trust-strip > a { color: #3e714a; font-size: 9px; font-weight: 700; }
.content-section { max-width: 1160px; margin: 0 auto; padding: 76px 12px 0; }
.section-heading { display: flex; align-items: end; justify-content: space-between; margin-bottom: 23px; }
.section-kicker { margin-bottom: 8px; font-size: 9px; }
.section-heading h2, .prescription-banner h2 { margin: 0; font-family: Manrope, sans-serif; font-size: clamp(26px, 3vw, 36px); font-weight: 700; letter-spacing: -.055em; line-height: 1.1; }
.section-heading h2 em, .prescription-banner h2 em { color: #60915b; font-family: var(--serif); font-weight: 400; }
.section-link { padding-bottom: 4px; font-size: 10px; font-weight: 700; }
.section-link span { padding-left: 6px; color: #5d8f52; }
.category-grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 13px; }
.category-card { min-width: 0; overflow: hidden; border: 1px solid #eff1ed; border-radius: 7px; transition: transform .2s, box-shadow .2s; }
.category-card:hover { transform: translateY(-4px); box-shadow: 0 10px 24px rgba(36,64,44,.09); }
.category-image { display: block; height: 142px; overflow: hidden; }
.category-image img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s; }
.category-placeholder { display: grid; width: 100%; height: 100%; place-items: center; color: #6a9657; font-size: 48px; }
.category-card:hover img { transform: scale(1.05); }
.category-mint .category-image { background: #d6f1e8; }
.category-yellow .category-image { background: #fff0b6; }
.category-peach .category-image { background: #ffe2cd; }
.category-pink .category-image { background: #f9d9e9; }
.category-blue .category-image { background: #dceafa; }
.category-orange .category-image { background: #ffe5c8; }
.category-caption { display: flex; align-items: center; justify-content: space-between; min-height: 39px; padding: 0 10px; font-size: 9px; }
.category-caption span { color: #6d9765; font-size: 12px; }
.deals-section { padding-top: 83px; padding-bottom: 78px; }
.product-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.product-card { overflow: hidden; border: 1px solid #edf0ed; border-radius: 8px; background: #fff; transition: transform .2s, box-shadow .2s; }
.product-card:hover { transform: translateY(-3px); box-shadow: 0 12px 30px rgba(36,64,44,.08); }
.product-card[hidden] { display: none; }
.product-image-wrap { position: relative; height: 190px; overflow: hidden; background: #f4f7f4; }
.product-image-wrap img { width: 100%; height: 100%; object-fit: cover; }
.product-badge { position: absolute; z-index: 1; top: 10px; left: 10px; padding: 5px 7px; border-radius: 3px; color: #355d38; background: #ddf2c7; font-size: 8px; font-weight: 700; text-transform: uppercase; }
.save-button { position: absolute; z-index: 1; top: 8px; right: 8px; display: grid; width: 27px; height: 27px; place-items: center; border: 0; border-radius: 50%; color: #51645a; background: #fff; font-size: 16px; cursor: pointer; }
.save-button.is-saved { color: #cf6a69; }
.product-info { padding: 13px 13px 12px; }
.product-meta { display: flex; align-items: center; justify-content: space-between; color: #89938d; font-size: 8px; }
.rating { color: #bb8743; }
.product-info h3 { margin: 7px 0 4px; font-size: 12px; font-weight: 700; }
.product-info > p { margin: 0; color: #8a938d; font-size: 9px; }
.product-purchase { display: flex; align-items: center; justify-content: space-between; margin-top: 13px; padding-top: 10px; border-top: 1px solid #f0f2f0; }
.price { font-size: 12px; font-weight: 800; }
.price del { margin-left: 5px; color: #9ba29d; font-size: 9px; font-weight: 400; }
.add-button { display: grid; width: 27px; height: 27px; place-items: center; border: 0; border-radius: 50%; color: #fff; background: #345c3e; font-size: 18px; line-height: 1; cursor: pointer; transition: background .2s, transform .2s; }
.add-button:hover { transform: rotate(90deg); background: #6a994f; }
.empty-search { padding: 35px 0; color: var(--muted); font-size: 13px; text-align: center; }
.prescription-banner { position: relative; display: flex; align-items: center; justify-content: space-between; max-width: 1160px; min-height: 244px; margin: 0 auto 75px; padding: 35px 7%; overflow: hidden; border-radius: 9px; color: #f7fbf3; background: #325941; }
.prescription-banner .section-kicker { color: #c5e69d; }
.prescription-banner h2 { position: relative; z-index: 1; font-size: 32px; }
.prescription-banner h2 em { color: #c2e98e; }
.prescription-banner > div > p:last-child { max-width: 340px; margin: 11px 0 0; color: #cfddd0; font-size: 11px; line-height: 1.6; }
.button-light { position: relative; z-index: 1; color: #294433; background: #eff8df; }
.prescription-icon { position: absolute; right: 28%; top: 20px; color: rgba(228,245,207,.08); font: 800 210px Manrope, sans-serif; transform: rotate(-12deg); }
.banner-orbit { position: absolute; border: 1px solid rgba(220,241,199,.13); border-radius: 50%; }
.orbit-one { right: 10%; top: -100px; width: 330px; height: 330px; }
.orbit-two { right: 15%; top: -40px; width: 210px; height: 210px; }
.site-footer { display: flex; align-items: center; gap: 20px; min-height: 100px; padding: 20px max(5.5vw, calc((100vw - 1320px) / 2)); border-top: 1px solid var(--line); }
.footer-brand { transform: scale(.9); transform-origin: left center; }
.site-footer > p { margin: 0; color: #79857e; font-size: 10px; }
.copyright { margin-left: auto; color: #98a09b; font-size: 9px; }
.toast { position: fixed; z-index: 5; right: 22px; bottom: 22px; padding: 13px 18px; border-radius: 6px; color: #fff; background: #29493c; box-shadow: 0 8px 24px rgba(0,0,0,.16); font-size: 12px; opacity: 0; pointer-events: none; transform: translateY(10px); transition: opacity .2s, transform .2s; }
.toast.is-visible { opacity: 1; transform: translateY(0); }
.product-placeholder { display: grid; width: 100%; height: 100%; place-items: center; color: #6a9657; background: linear-gradient(145deg, #f3f8ee, #e6f2df); font-size: 64px; }
.add-button:disabled { background: #aab3ad; cursor: not-allowed; transform: none; }
.message-list { max-width: 1160px; margin: 14px auto; padding: 0 12px; }
.message { margin: 0 0 8px; padding: 10px 13px; border-radius: 5px; font-size: 12px; }
.message-success { color: #315c37; background: #edf7e6; }
.message-error { color: #8b3939; background: #fbebeb; }
.message-info { color: #3d5d6b; background: #eaf3f6; }
.commerce-page { min-height: 100vh; background: #f8faf8; }
.commerce-header { display: flex; align-items: center; justify-content: space-between; min-height: 76px; padding: 0 max(5.5vw, calc((100vw - 1160px) / 2)); border-bottom: 1px solid var(--line); background: #fff; }
.back-link { color: #55705b; font-size: 11px; font-weight: 700; }
.commerce-main { max-width: 1160px; min-height: calc(100vh - 160px); margin: 0 auto; padding: 53px 12px 70px; }
.commerce-title { margin: 0 0 28px; font: 700 clamp(32px, 4vw, 46px) Manrope, sans-serif; letter-spacing: -.06em; }
.commerce-title em { color: #60915b; font-family: var(--serif); font-weight: 400; }
.cart-layout { display: grid; grid-template-columns: minmax(0, 1.7fr) minmax(260px, .8fr); align-items: start; gap: 25px; }
.cart-items, .checkout-form-panel, .order-summary { border: 1px solid #e9efea; border-radius: 8px; background: #fff; }
.cart-item { display: grid; grid-template-columns: 95px 1fr auto; align-items: center; gap: 17px; padding: 17px; border-bottom: 1px solid #edf1ee; }
.cart-item:last-child { border-bottom: 0; }
.cart-product-image { width: 95px; height: 95px; overflow: hidden; border-radius: 6px; background: #f1f6ef; }
.cart-product-image img { width: 100%; height: 100%; object-fit: cover; }
.cart-product-image .product-placeholder { font-size: 35px; }
.cart-category { color: #688d61; font-size: 9px; font-weight: 700; text-transform: uppercase; }
.cart-product-copy h2 { margin: 5px 0; font-size: 14px; }
.cart-product-copy > p { margin: 0; color: #88938c; font-size: 10px; }
.cart-item-actions { display: flex; align-items: center; gap: 12px; margin-top: 9px; }
.quantity-form { display: flex; align-items: center; gap: 6px; }
.quantity-form input { width: 55px; height: 29px; padding: 4px 6px; border: 1px solid #dce6dd; border-radius: 4px; }
.small-button, .remove-button { padding: 5px 8px; border: 0; border-radius: 4px; background: #eef5eb; color: #3e6947; font-size: 9px; font-weight: 700; cursor: pointer; }
.remove-button { padding-left: 0; color: #a35a56; background: transparent; }
.cart-line-total { font-size: 13px; }
.order-summary { position: sticky; top: 18px; padding: 20px; }
.order-summary h2 { margin: 0 0 18px; font-size: 15px; }
.summary-row, .summary-total { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin: 12px 0; color: #6e7972; font-size: 10px; }
.summary-row strong, .summary-total strong { color: var(--ink); }
.summary-row > span:last-child { text-align: right; }
.summary-total { margin-top: 17px; padding-top: 15px; border-top: 1px solid var(--line); color: var(--ink); font-size: 12px; font-weight: 700; }
.payment-note { margin: 15px 0; color: #859088; font-size: 9px; line-height: 1.6; }
.checkout-button { width: 100%; border: 0; cursor: pointer; }
.empty-cart { padding: 62px 20px; border: 1px solid #e9efea; border-radius: 8px; background: #fff; text-align: center; }
.empty-cart > span { display: grid; width: 48px; height: 48px; margin: 0 auto 15px; place-items: center; border-radius: 50%; color: #548052; background: #edf6e8; font-size: 25px; }
.empty-cart h2 { margin-bottom: 8px; font-size: 19px; }
.empty-cart p { margin-bottom: 20px; color: #829087; font-size: 12px; }
.commerce-footer { padding: 19px; border-top: 1px solid var(--line); color: #8a958e; background: #fff; font-size: 10px; text-align: center; }
.checkout-layout { grid-template-columns: minmax(0, 1.3fr) minmax(260px, .8fr); }
.checkout-form-panel { padding: 22px; }
.checkout-form { display: grid; grid-template-columns: 1fr 1fr; gap: 15px; }
.form-field { display: flex; flex-direction: column; gap: 6px; }
.form-field:has(textarea), .payment-choice, .checkout-form > button { grid-column: 1 / -1; }
.form-field label, .payment-choice legend { color: #47584c; font-size: 10px; font-weight: 700; }
.form-field input, .form-field textarea { width: 100%; padding: 10px; border: 1px solid #dfe8e1; border-radius: 5px; background: #fff; font: 11px "DM Sans", sans-serif; }
.form-field input:focus, .form-field textarea:focus { border-color: #6c9b63; outline: 2px solid #e5f1de; }
.payment-choice { margin: 2px 0 0; padding: 13px; border: 1px solid #e5ece6; border-radius: 5px; }
.payment-choice label { display: block; margin-top: 9px; font-size: 11px; }
.payment-choice p { margin: 7px 0 0; color: #88938c; font-size: 9px; }
.field-error, .form-errors { color: #a33e3e; font-size: 10px; }
.form-errors { grid-column: 1 / -1; }
.checkout-line { font-size: 9px; }
.checkout-line b { color: #8b968e; }
.confirmation-main { max-width: 740px; text-align: center; }
.confirmation-mark { display: grid; width: 52px; height: 52px; margin: 0 auto 16px; place-items: center; border-radius: 50%; color: #3d7047; background: #e6f4dd; font-size: 24px; }
.confirmation-copy { margin: -13px 0 24px; color: #68766c; font-size: 12px; }
.confirmation-summary { position: static; max-width: 520px; margin: 0 auto 22px; text-align: left; }
.confirmation-summary .summary-row:first-child strong { max-width: 65%; overflow-wrap: anywhere; text-align: right; }
.visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; clip-path: inset(50%); }

@media (min-width: 1440px) {
  .hero { margin-top: 36px; }
}
@media (max-width: 1000px) {
  .site-header { gap: 17px; padding-right: 4%; padding-left: 4%; }
  .delivery-location { padding-left: 12px; }
  .header-links { gap: 13px; }
  .services-link { display: none; }
  .hero { margin-right: 20px; margin-left: 20px; padding-right: 4%; padding-left: 5%; }
  .content-section, .trust-strip, .prescription-banner { margin-right: 5%; margin-left: 5%; }
}
@media (max-width: 700px) {
  .announcement { font-size: 9px; }
  .site-header { min-height: 66px; justify-content: space-between; gap: 12px; padding: 0 18px; }
  .brand { font-size: 18px; }
  .brand-mark { width: 30px; height: 30px; }
  .delivery-location, .header-links { display: none; }
  .header-links.is-open {
    position: absolute;
    top: 118px;
    right: 18px;
    left: 18px;
    z-index: 3;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    padding: 7px 14px;
    border: 1px solid var(--line);
    border-radius: 7px;
    background: #fff;
    box-shadow: 0 10px 24px rgba(36,64,44,.12);
  }
  .header-links.is-open a { padding: 12px 0; border-bottom: 1px solid var(--line); }
  .header-links.is-open a:last-child { border-bottom: 0; }
  .site-header.menu-open { margin-bottom: 220px; }
  .search { order: 3; position: absolute; top: 75px; left: 18px; right: 18px; max-width: none; }
  .site-header { margin-bottom: 52px; }
  .cart-button span { display: none; }
  .mobile-menu { display: block; }
  .hero { grid-template-columns: 1fr; min-height: auto; margin: 0 12px; padding: 37px 25px 0; }
  .hero-copy { padding-bottom: 0; }
  .hero h1 { font-size: clamp(47px, 13vw, 68px); }
  .hero-copy > p { max-width: 390px; font-size: 12px; }
  .hero-proof { margin-top: 21px; }
  .hero-visual { min-height: 270px; margin: 10px -15px 0; }
  .hero-image { inset: -5px -5% -10px 0; background-position: center 32%; }
  .hero-sticker { top: 9%; right: 1%; }
  .delivery-card { right: 4%; bottom: 6%; min-width: 205px; }
  .hero-index { right: 13px; bottom: 10px; }
  .trust-strip { display: grid; grid-template-columns: 1fr 1fr; gap: 18px 8px; margin: 0 18px; padding: 22px 0; }
  .trust-strip > div { gap: 7px; }
  .trust-strip > a { grid-column: 1 / -1; }
  .trust-strip strong { font-size: 9px; }
  .trust-strip small { font-size: 8px; }
  .trust-icon { width: 27px; height: 27px; flex: 0 0 auto; }
  .content-section { margin: 0 18px; padding-top: 56px; }
  .section-heading { align-items: end; gap: 12px; }
  .section-heading h2 { font-size: 27px; }
  .section-link { max-width: 115px; font-size: 9px; line-height: 1.6; text-align: right; }
  .category-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 9px; }
  .category-image { height: clamp(95px, 29vw, 145px); }
  .category-caption { min-height: 37px; padding: 0 7px; font-size: 8px; }
  .deals-section { padding-top: 62px; padding-bottom: 55px; }
  .product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .product-image-wrap { height: clamp(140px, 44vw, 210px); }
  .product-info { padding: 10px; }
  .product-info h3 { font-size: 11px; }
  .prescription-banner { display: block; min-height: auto; margin: 0 18px 48px; padding: 30px 24px; }
  .prescription-banner h2 { font-size: 28px; }
  .prescription-banner .button { margin-top: 20px; }
  .prescription-icon { right: -10px; top: -20px; font-size: 160px; }
  .site-footer { flex-wrap: wrap; min-height: 95px; gap: 10px; padding: 18px; }
  .site-footer > p { margin-left: auto; }
  .copyright { flex-basis: 100%; margin: 0; }
  .message-list { margin-right: 18px; margin-left: 18px; }
  .commerce-header { min-height: 66px; padding: 0 18px; }
  .commerce-main { min-height: calc(100vh - 150px); padding: 38px 18px 50px; }
  .cart-layout, .checkout-layout { grid-template-columns: 1fr; gap: 14px; }
  .cart-item { grid-template-columns: 68px 1fr auto; gap: 10px; padding: 12px 10px; }
  .cart-product-image { width: 68px; height: 68px; }
  .cart-product-copy h2 { font-size: 12px; }
  .cart-line-total { font-size: 11px; }
  .order-summary { position: static; padding: 17px; }
  .checkout-form-panel { padding: 15px; }
  .checkout-form { grid-template-columns: 1fr; gap: 12px; }
  .form-field:has(textarea), .payment-choice, .checkout-form > button { grid-column: auto; }
  .commerce-footer { padding: 15px 20px; line-height: 1.5; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; }
}

body { font-size: 16px; }
.announcement { font-size: 13px; }
.brand { font-size: 21px; }
.brand small { font-size: 9px; }
.delivery-location small { font-size: 11px; }
.delivery-location strong,
.header-links a,
.icon-action { font-size: 13px; }
.search input { font-size: 13px; }
.search kbd { font-size: 11px; }
.tiny-new { font-size: 9px; }
.eyebrow,
.section-kicker { font-size: 11px; }
.hero-copy > p { font-size: 16px; }
.button,
.text-link { font-size: 13px; }
.hero-proof { font-size: 12px; }
.hero-sticker { font-size: 11px; }
.hero-sticker strong { font-size: 13px; }
.delivery-card strong { font-size: 12px; }
.delivery-card small { font-size: 10px; }
.hero-index { font-size: 11px; }
.trust-strip strong { font-size: 13px; }
.trust-strip small { font-size: 11px; }
.trust-strip > a,
.section-link { font-size: 12px; }
.category-caption { font-size: 12px; }
.product-badge { font-size: 10px; }
.product-meta { font-size: 11px; }
.product-info h3 { font-size: 16px; }
.product-info > p { font-size: 13px; line-height: 1.45; }
.price { font-size: 15px; }
.price del { font-size: 12px; }
.empty-search { font-size: 15px; }
.prescription-banner > div > p:last-child { font-size: 14px; }
.site-footer > p,
.copyright { font-size: 12px; }
.message { font-size: 14px; }
.back-link { font-size: 13px; }
.cart-category { font-size: 11px; }
.cart-product-copy h2 { font-size: 16px; }
.cart-product-copy > p { font-size: 13px; }
.small-button,
.remove-button { font-size: 12px; }
.cart-line-total { font-size: 15px; }
.order-summary h2 { font-size: 17px; }
.summary-row,
.summary-total { font-size: 13px; }
.payment-note { font-size: 12px; }
.empty-cart h2 { font-size: 22px; }
.empty-cart p { font-size: 15px; }
.commerce-footer { font-size: 12px; }
.form-field label,
.payment-choice legend { font-size: 13px; }
.form-field input,
.form-field textarea { font-size: 14px; }
.payment-choice label { font-size: 13px; }
.payment-choice p { font-size: 12px; }
.field-error,
.form-errors,
.checkout-line { font-size: 12px; }
.confirmation-copy { font-size: 15px; }
.pharmacy-main { padding-top: 45px; }
.pharmacy-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 27px; }
.pharmacy-heading .commerce-title { margin-bottom: 8px; }
.pharmacy-intro { margin: 0; color: #68766c; font-size: 13px; line-height: 1.6; }
.pharmacy-panel { overflow: hidden; border: 1px solid #e9efea; border-radius: 8px; background: #fff; }
.pharmacy-panel-heading { display: flex; align-items: center; justify-content: space-between; padding: 18px 20px; border-bottom: 1px solid #edf1ee; }
.pharmacy-panel-heading h2 { margin: 0; font-size: 15px; }
.pharmacy-panel-heading > span { color: #738078; font-size: 12px; }
.pharmacy-table-wrap { overflow-x: auto; }
.pharmacy-table { width: 100%; border-collapse: collapse; text-align: left; }
.pharmacy-table th, .pharmacy-table td { padding: 15px 18px; border-bottom: 1px solid #edf1ee; vertical-align: top; font-size: 12px; }
.pharmacy-table th { color: #77827b; background: #f8faf8; font-size: 10px; font-weight: 700; }
.pharmacy-table tbody tr:last-child td { border-bottom: 0; }
.pharmacy-table td strong, .pharmacy-table td small { display: block; }
.pharmacy-table td strong { margin-bottom: 4px; font-size: 13px; }
.pharmacy-table td small { margin-top: 5px; color: #7f8b83; font-size: 11px; }
.pharmacy-table td a:not(.small-button) { overflow-wrap: anywhere; }
.pharmacy-empty { border: 0; border-radius: 0; }
.pharmacy-form-main { max-width: 760px; }
.pharmacy-form-main .commerce-title { margin-bottom: 8px; }
.pharmacy-form-panel { margin-top: 24px; padding: 24px; }
.pharmacy-address-field { grid-column: 1 / -1; }
.pharmacy-form-section-title { grid-column: 1 / -1; margin: 10px 0 -10px; padding-top: 18px; border-top: 1px solid #edf1ee; font-size: 15px; }
.pharmacy-form-panel .pharmacy-intro { grid-column: 1 / -1; }
.pharmacy-form-panel .form-field small { color: #7f8b83; font-size: 11px; }
.pharmacy-form-actions { display: flex; align-items: center; gap: 18px; grid-column: 1 / -1; margin-top: 4px; }
.pharmacy-delete-form { margin-top: 18px; padding-top: 18px; border-top: 1px solid #edf1ee; }
.staff-nav { display: flex; align-items: center; gap: 8px; max-width: 1160px; margin: 0 auto; padding: 12px; border-bottom: 1px solid var(--line); }
.staff-nav a { padding: 9px 12px; border-radius: 5px; color: #5f7065; font-size: 12px; font-weight: 700; }
.staff-nav a[aria-current="page"] { color: #315c37; background: #edf7e6; }
.staff-nav a:last-child { margin-left: auto; }
.staff-nav form { margin-left: auto; }
.staff-nav form button { padding: 9px 12px; border: 0; border-radius: 5px; color: #8b3939; background: #fbebeb; font: inherit; font-size: 12px; font-weight: 700; cursor: pointer; }
.staff-main { padding-top: 38px; }
.staff-stat-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin-bottom: 25px; }
.staff-stat { display: flex; flex-direction: column; min-height: 135px; padding: 17px; border: 1px solid #e9efea; border-radius: 8px; background: #fff; }
.staff-stat > span { color: #68766c; font-size: 12px; font-weight: 600; }
.staff-stat strong { margin: 8px 0 3px; color: #29493c; font: 700 30px Manrope, sans-serif; }
.staff-stat small { margin-top: auto; color: #829088; font-size: 11px; line-height: 1.4; }
.staff-stat:hover { border-color: #b8d6b0; box-shadow: 0 5px 18px rgba(36,64,44,.06); }
.staff-recent-panel .pharmacy-panel-heading > a { color: #3e714a; font-size: 12px; font-weight: 700; }
.staff-table td { min-width: 110px; }
.order-status { display: inline-flex; padding: 5px 8px; border-radius: 20px; color: #506357; background: #eef2ef; font-size: 11px; font-weight: 700; white-space: nowrap; }
.status-placed { color: #795e19; background: #fff4d3; }
.status-processing { color: #315e82; background: #e6f2fb; }
.status-completed { color: #315c37; background: #edf7e6; }
.status-cancelled { color: #8b3939; background: #fbebeb; }
.status-pending { color: #795e19; background: #fff4d3; }
.status-approved { color: #315c37; background: #edf7e6; }
.status-rejected { color: #8b3939; background: #fbebeb; }
.pharmacy-actions form { display: inline-flex; gap: 5px; margin: 0 6px 6px 0; }
.pharmacy-reject-button { color: #8b3939; background: #fbebeb; }
.staff-filters { display: flex; align-items: end; gap: 12px; margin: 0 0 18px; padding: 15px; border: 1px solid #e9efea; border-radius: 8px; background: #fff; }
.staff-filters label { display: grid; gap: 6px; min-width: 190px; color: #526258; font-size: 11px; font-weight: 700; }
.staff-filters input, .staff-filters select, .status-update-form select, .inventory-update-form input[type="number"] { min-height: 36px; padding: 7px 9px; border: 1px solid #dfe7e1; border-radius: 5px; color: var(--ink); background: #fff; font: inherit; }
.staff-filters label:first-child { flex: 1; }
.staff-filters .back-link { padding-bottom: 9px; }
.status-update-form { display: grid; gap: 6px; min-width: 115px; margin-top: 9px; }
.status-update-form select { width: 100%; font-size: 11px; }
.staff-order-item { display: block; margin: 0 0 5px; }
.staff-pagination { display: flex; justify-content: center; align-items: center; gap: 15px; padding: 16px; color: #68766c; font-size: 12px; }
.inventory-table td[colspan="3"] { min-width: 290px; }
.inventory-update-form { display: flex; align-items: center; gap: 16px; }
.inventory-update-form input[type="number"] { width: 95px; }
.inventory-active { display: flex; align-items: center; gap: 7px; color: #526258; font-size: 12px; white-space: nowrap; }
.staff-login-page { display: flex; flex-direction: column; }
.staff-login-main { display: grid; flex: 1; place-items: center; padding: 55px 18px; background: radial-gradient(ellipse at 50% 0, #eaf6e3 0, #f8faf8 58%); }
.staff-login-card { width: min(100%, 450px); padding: 35px; border: 1px solid #e4ece5; border-radius: 12px; background: #fff; box-shadow: 0 18px 55px rgba(37,68,47,.08); }
.staff-login-icon { display: grid; width: 43px; height: 43px; margin-bottom: 25px; place-items: center; border-radius: 12px; color: #345f3e; background: #eaf6df; font-size: 25px; }
.staff-login-card .commerce-title { margin-bottom: 9px; font-size: 37px; }
.staff-login-copy { margin-bottom: 22px; color: #68766c; font-size: 13px; line-height: 1.6; }
.staff-login-form { display: grid; gap: 16px; }
.staff-login-form .form-field { display: grid; gap: 7px; }
.staff-login-form .form-field label { color: #405248; font-size: 12px; font-weight: 700; }
.staff-login-form .form-field input { width: 100%; min-height: 43px; padding: 9px 11px; border: 1px solid #dfe7e1; border-radius: 5px; color: var(--ink); background: #fff; }
.staff-login-form .form-field input:focus { outline: 2px solid #b8d9a9; outline-offset: 1px; }
.staff-login-form > button { width: 100%; margin-top: 3px; }
.staff-login-note { margin: 20px 0 0; color: #829088; font-size: 11px; text-align: center; }
.staff-login-card .message-list { margin: 0; padding: 0; }
.staff-login-page .commerce-footer a { color: #3e714a; font-weight: 700; }
.staff-login-link { margin-left: auto; color: #55705b; font-size: 11px; font-weight: 700; white-space: nowrap; }

.location-panel { max-width: 1160px; margin: 30px auto; padding: 28px; border: 1px solid #e7eeeb; border-radius: 12px; background: #f8fbf8; }
.location-heading { margin-bottom: 10px; }
.location-explanation, .location-secondary, .location-empty { color: #68766c; font-size: 13px; line-height: 1.65; }
.location-search-form { display: grid; gap: 9px; max-width: 760px; }
.location-search-form > label, .catalogue-filter label { color: #405248; font-size: 12px; font-weight: 700; }
.location-search-controls, .location-actions { display: flex; align-items: center; gap: 10px; }
.location-search-controls input[type="search"], .catalogue-filter input, .catalogue-filter select { min-width: 0; min-height: 43px; padding: 9px 11px; border: 1px solid #dfe7e1; border-radius: 5px; color: var(--ink); background: #fff; }
.location-search-controls input[type="search"] { flex: 1; }
.location-actions { flex-wrap: wrap; margin-top: 4px; }
.location-actions [role="status"] { color: #68766c; font-size: 11px; line-height: 1.5; }
.location-search-form button:disabled { cursor: wait; opacity: .65; }
.location-secondary { margin: 16px 0 0; font-size: 11px; }
.branch-results { margin-top: 25px; }
.branch-results h3 { margin-bottom: 13px; font: 700 20px Manrope, sans-serif; }
.branch-result-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 13px; }
.branch-result-card { display: flex; flex-direction: column; align-items: flex-start; gap: 7px; padding: 18px; border: 1px solid #e5ece6; border-radius: 8px; background: #fff; }
.branch-result-card h4 { margin: 0; font: 700 17px Manrope, sans-serif; }
.branch-result-card p { margin: 0; color: #68766c; font-size: 12px; line-height: 1.5; }
.branch-result-card .section-kicker { color: #54805e; font-size: 9px; }
.branch-result-card form { margin-top: auto; padding-top: 8px; }
.branch-service-note { color: #65736a; }
.selected-branch-panel { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.selected-branch-panel h2 { margin: 0 0 8px; font: 700 clamp(20px, 3vw, 28px) Manrope, sans-serif; }
.selected-branch-panel h2 em { color: #54805e; font-family: var(--serif); font-weight: 400; }
.selected-branch-panel p:not(.section-kicker) { margin: 0 0 6px; color: #68766c; font-size: 12px; }
.catalogue-filter { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0 0 20px; }
.catalogue-filter input { flex: 1 1 230px; }
.catalogue-filter select { flex: 0 1 190px; }
.quantity-control { display: grid; gap: 3px; color: #68766c; font-size: 9px; }
.quantity-control input { width: 62px; min-height: 32px; padding: 4px; border: 1px solid #dfe7e1; border-radius: 4px; }
.product-purchase form { display: flex; align-items: center; gap: 7px; }
.alternative-results { max-width: 1160px; margin: 20px auto; }

@media (max-width: 700px) {
  .location-panel { margin: 20px 15px; padding: 20px 16px; }
  .location-search-controls { align-items: stretch; flex-direction: column; }
  .location-search-controls .button { width: 100%; }
  .selected-branch-panel { align-items: flex-start; flex-direction: column; }
  .catalogue-filter { align-items: stretch; flex-direction: column; }
  .catalogue-filter label { margin-top: 4px; }
  .catalogue-filter input, .catalogue-filter select, .catalogue-filter .button { width: 100%; }
  .announcement { font-size: 11px; }
  .staff-nav { gap: 2px; overflow-x: auto; padding: 8px 10px; }
    .staff-nav a { padding: 9px 8px; font-size: 11px; white-space: nowrap; }
    .staff-nav form { flex: 0 0 auto; }
    .staff-nav form button { padding: 9px 8px; font-size: 11px; white-space: nowrap; }
    .staff-main { padding-top: 28px; }
    .staff-stat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
    .staff-stat { min-height: 118px; padding: 13px; }
    .staff-stat strong { font-size: 25px; }
    .staff-filters { flex-wrap: wrap; align-items: end; gap: 9px; }
    .staff-filters label { min-width: 0; flex: 1 1 100%; }
    .staff-filters label:nth-child(2) { flex-basis: 52%; }
    .staff-table td { min-width: 120px; }
    .inventory-update-form { flex-wrap: wrap; gap: 10px; }
    .staff-login-main { padding: 35px 16px; }
    .staff-login-card { padding: 25px 20px; }
    .staff-login-card .commerce-title { font-size: 32px; }
    .staff-login-link { order: 3; margin: 0; }
  }
  .hero-copy > p { font-size: 15px; }
  .hero-proof { font-size: 11px; }
  .trust-strip strong { font-size: 12px; }
  .trust-strip small { font-size: 10px; }
  .category-caption { font-size: 11px; }
  .product-info h3 { font-size: 14px; }
  .product-info > p { font-size: 12px; }
  .product-meta { font-size: 10px; }
  .section-link { font-size: 11px; }
  .pharmacy-heading { align-items: flex-start; flex-direction: column; }
  .pharmacy-heading > .button { width: 100%; }
  .pharmacy-table { min-width: 700px; }
  .pharmacy-form-panel { padding: 18px; }
}

/* SwiftGo marketplace refresh */
:root { --ink: #20312a; --muted: #68766d; --green-dark: #244b36; --line: #dfe7df; --paper: #f4f8f3; }
body { color: var(--ink); font-family: "DM Sans", Arial, sans-serif; }
.announcement { display: none; }
.site-header { min-height: 68px; gap: clamp(14px, 2vw, 30px); padding-right: max(3vw, calc((100vw - 1360px)/2)); padding-left: max(3vw, calc((100vw - 1360px)/2)); border-bottom-color: var(--line); }
.brand-mark { border-radius: 50%; }
.search { max-width: 420px; border: 1px solid #e7eee8; border-radius: 24px; background: #f8faf8; }
.header-links { gap: clamp(12px, 2vw, 26px); }
.header-links a, .icon-action { font-size: 13px; }
.hero { max-width: 1360px; min-height: 455px; margin: 18px auto 0; padding: 45px 5.5%; border-radius: 12px; background: #e9f5eb; }
.hero h1 { max-width: 570px; font-size: clamp(42px, 5.1vw, 68px); line-height: 1.06; letter-spacing: -.06em; }
.hero-copy > p { max-width: 440px; color: #496054; font-size: 16px; }
.hero-image { background-image: linear-gradient(90deg, rgba(233,245,235,.03), rgba(233,245,235,0)), url("https://images.unsplash.com/photo-1559839734-2b71ea197ec2?auto=format&fit=crop&w=1200&q=85"); clip-path: none; border-radius: 12px; mix-blend-mode: normal; }
.hero-sticker, .delivery-card { border-radius: 12px; }
.button { min-height: 46px; padding: 0 20px; border-radius: 7px; font-size: 13px; }
.button-dark { background: var(--green-dark); }
.trust-strip { max-width: 1360px; margin: 14px auto 0; gap: 14px; padding: 0; border: 0; }
.trust-strip > div { flex: 1; min-height: 78px; padding: 15px 18px; border: 1px solid #e9f0e8; border-radius: 10px; background: #f7faf6; }
.trust-icon { width: 40px; height: 40px; font-size: 18px; }
.trust-strip strong { font-size: 14px; }
.trust-strip small { color: var(--muted); font-size: 12px; }
.trust-strip > a { display: none; }
.content-section { max-width: 1360px; padding-top: 64px; }
.section-heading { margin-bottom: 20px; }
.section-heading h2 { color: #183b30; font-size: clamp(25px, 2.6vw, 34px); letter-spacing: -.04em; }
.section-heading h2 em { font-family: Manrope, sans-serif; font-style: normal; color: #3e754c; }
.location-panel { max-width: 1360px; margin: 22px auto 0; padding: 24px; border-color: #deeadf; border-radius: 12px; background: #f6faf6; }
.selected-branch-panel { align-items: center; }
.selected-branch-panel h2 { font-size: 23px; }
.selected-branch-panel h2 em { font-family: Manrope, sans-serif; font-style: normal; }
.location-search-form { max-width: none; }
.location-search-controls input[type="search"], .catalogue-filter input, .catalogue-filter select { min-height: 46px; border-radius: 7px; font-size: 14px; }
.catalogue-filter { gap: 10px; padding: 13px; border: 1px solid var(--line); border-radius: 10px; background: #fff; }
.catalogue-filter label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0,0,0,0); }
.catalogue-filter input { flex: 1 1 300px; }
.catalogue-filter select { flex: 0 1 190px; }
.catalogue-intro { margin: 8px 0 0; color: var(--muted); font-size: 14px; }
.category-grid { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px; }
.category-card { border-color: var(--line); border-radius: 9px; }
.category-image { height: 125px; }
.category-image img { object-fit: contain; padding: 9px; }
.category-caption { min-height: 42px; padding: 0 12px; font-size: 12px; }
.deals-section { padding-top: 48px; padding-bottom: 65px; }
.product-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.product-card { display: flex; min-width: 0; flex-direction: column; border-color: var(--line); border-radius: 9px; }
.product-image-wrap { height: clamp(155px, 17vw, 220px); background: #fbfcfb; }
.product-image-wrap img { object-fit: contain; padding: 12px; }
.product-info { display: flex; flex: 1; flex-direction: column; padding: 15px; }
.product-meta { color: #4a8057; font-size: 11px; }
.rating { color: #5d9663; }
.product-info h3 { min-height: 2.6em; margin: 8px 0 5px; font-size: 16px; line-height: 1.3; }
.product-info > p { color: #68766d; font-size: 12px; line-height: 1.5; }
.product-description { display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.product-purchase { display: block; margin-top: auto; padding-top: 12px; border: 0; }
.price { display: block; margin-bottom: 10px; color: #173f30; font-size: 16px; }
.product-purchase form { display: flex; justify-content: space-between; gap: 8px; }
.quantity-control { grid-template-columns: auto 68px; align-items: center; gap: 5px; font-size: 11px; }
.quantity-control input { min-height: 38px; width: 68px; font-size: 14px; }
.add-button { width: auto; min-width: 94px; height: 38px; padding: 0 12px; border-radius: 7px; font-size: 12px; font-weight: 700; }
.add-button:hover { transform: none; }
.step-grid { display: grid; }
.steps-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.step-card { display: grid; grid-template-columns: 38px 48px 1fr; align-items: center; gap: 12px; min-height: 92px; padding: 17px; border: 1px solid #e9f0e8; border-radius: 10px; background: #f8faf7; }
.step-number { display: grid; width: 34px; height: 34px; place-items: center; border-radius: 50%; background: #e0f0d9; color: #244b36; font-weight: 700; }
.step-icon { display: grid; width: 44px; height: 44px; place-items: center; border-radius: 50%; color: #2f6842; background: #edf6e9; font-size: 21px; }
.step-card h3 { margin: 0 0 4px; font-size: 15px; }
.step-card p { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.45; }
.prescription-banner { max-width: 1360px; min-height: 225px; margin-bottom: 60px; border-radius: 11px; background: linear-gradient(90deg, #244b36, #34684a); }
.site-footer { flex-wrap: wrap; max-width: 1360px; min-height: 88px; margin: auto; padding: 20px 0; }
.site-footer .staff-login-link { font-size: 12px; }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible { outline: 3px solid #91bd83; outline-offset: 2px; }
@media (max-width: 1100px) {
  .site-header { gap: 14px; }
  .delivery-location { display: none; }
  .product-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .category-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 700px) {
  .site-header { min-height: 62px; padding: 0 16px; }
  .search { top: 68px; left: 16px; right: 16px; padding: 9px 12px; }
  .site-header { margin-bottom: 44px; }
  .hero { margin: 0 12px; padding: 31px 22px 0; }
  .hero h1 { font-size: clamp(40px, 11vw, 54px); }
  .hero-copy > p { font-size: 14px; }
  .trust-strip { grid-template-columns: 1fr; margin: 12px 16px 0; }
  .trust-strip > div { min-height: 68px; }
  .content-section { margin: 0 16px; padding-top: 48px; }
  .location-panel { margin: 18px 16px; padding: 18px; }
  .category-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .category-image { height: 110px; }
  .product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
  .product-image-wrap { height: clamp(130px, 42vw, 180px); }
  .product-info { padding: 10px; }
  .product-info h3 { min-height: 2.6em; font-size: 14px; }
  .product-purchase form { align-items: stretch; flex-direction: column; }
  .quantity-control { display: flex; justify-content: space-between; }
  .add-button { width: 100%; }
  .steps-grid { grid-template-columns: 1fr; gap: 9px; }
  .step-card { min-height: 78px; padding: 12px; }
  .site-footer { margin: 0 16px; gap: 12px; }
}
@media (max-width: 375px) {
  .product-grid { grid-template-columns: 1fr; }
}
.branch-change { margin-top: 17px; padding-top: 13px; border-top: 1px solid #e3ebe3; }
.branch-change summary { width: fit-content; color: #315f3d; font-size: 13px; font-weight: 700; cursor: pointer; }
.branch-change[open] summary { margin-bottom: 16px; }

/* Pharmacy workspace visual system */
.commerce-page:has(.pharmacy-nav) { min-height: 100vh; color: #203a32; background: #f5f9f6; }
.commerce-page:has(.pharmacy-nav) .commerce-header { min-height: 76px; padding: 0 max(4vw, calc((100vw - 1360px)/2)); border-bottom: 1px solid #e7eee9; }
.pharmacy-workspace-header { gap: 0; }
.workspace-brand-caption { align-self: center; margin: 19px 0 0 -190px; color: #698277; font-size: 12px; pointer-events: none; }
.pharmacy-account { display: inline-flex; align-items: center; gap: 11px; margin-left: auto; color: #356a4d; font-size: 14px; font-weight: 700; }
.pharmacy-account span:first-child { font-size: 20px; }
.commerce-page:has(.pharmacy-nav) .staff-nav.pharmacy-nav { max-width: none; min-height: 66px; gap: clamp(12px, 2vw, 30px); padding: 0 max(4vw, calc((100vw - 1360px)/2)); border-bottom: 1px solid #e3ece5; background: #f2f8f3; }
.pharmacy-nav a { display: inline-flex; align-items: center; gap: 10px; min-height: 46px; padding: 0 14px; border-radius: 12px; color: #42695a; font-size: 14px; white-space: nowrap; }
.pharmacy-nav a[aria-current="page"] { position: relative; color: #245d3c; background: #e3f3dc; }
.pharmacy-nav a[aria-current="page"]::after { position: absolute; bottom: -11px; left: calc(50% - 4px); width: 8px; height: 8px; border-radius: 50%; background: #60a65b; content: ""; }
.workspace-nav-icon { color: #3c7657; font-size: 20px; line-height: 1; }
.pharmacy-nav .storefront-nav-link { margin-left: 0; padding-left: 28px; border-left: 1px solid #dce8de; border-radius: 0; }
.pharmacy-nav form { margin-left: auto; }
.pharmacy-nav form button { display: inline-flex; align-items: center; gap: 8px; padding: 12px 19px; border-radius: 13px; color: #bd3838; background: #fff0ef; font-size: 14px; }
.pharmacy-orders-main { max-width: 1360px; min-height: calc(100vh - 220px); padding: 38px 0 64px; }
.pharmacy-orders-main .message-list { max-width: none; margin: 0 0 28px; padding: 0; }
.pharmacy-orders-main .message { display: flex; align-items: center; gap: 12px; min-height: 48px; padding: 12px 18px; border-radius: 12px; font-size: 14px; }
.message-dismiss { margin-left: auto; border: 0; color: inherit; background: none; font-size: 21px; cursor: pointer; }
.pharmacy-orders-main .pharmacy-heading { margin-bottom: 28px; }
.pharmacy-orders-main .section-kicker { margin-bottom: 5px; color: #3e8058; font-size: 14px; letter-spacing: .1em; }
.pharmacy-orders-main .commerce-title { margin: 0 0 5px; color: #102e28; font-size: clamp(40px, 5vw, 58px); letter-spacing: -.065em; }
.pharmacy-orders-main .commerce-title em { color: #36744f; }
.pharmacy-orders-main .pharmacy-intro { color: #71878a; font-size: 16px; }
.order-filters { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 16px; margin: 0 0 22px; padding: 16px 20px; border-color: #e4ece7; border-radius: 13px; box-shadow: 0 3px 14px rgba(29,68,47,.03); }
.order-filters label { display: grid; gap: 5px; color: #587179; font-size: 13px; }
.order-filters select { width: 100%; min-height: 42px; border: 1px solid #dfe8e5; border-radius: 11px; color: #243e37; background: #fff; font: inherit; font-size: 14px; }
.order-filter-button { display: inline-flex; min-height: 42px; align-items: center; gap: 10px; padding: 0 17px; border: 0; border-radius: 10px; color: #2e7044; background: #edf7e9; font-size: 14px; font-weight: 700; cursor: pointer; }
.orders-panel { border-color: #e5ede9; border-radius: 14px; box-shadow: 0 3px 14px rgba(29,68,47,.035); }
.orders-panel .pharmacy-panel-heading { min-height: 56px; padding: 14px 20px; }
.orders-panel .pharmacy-panel-heading h2 { color: #173b32; font-size: 18px; }
.found-count { padding: 5px 12px; border-radius: 18px; color: #4c7e65 !important; background: #f1f8f3; font-size: 12px !important; }
.order-table-wrap { overflow: visible; }
.orders-table { table-layout: fixed; }
.orders-table thead th { padding: 12px 16px; border-bottom: 1px solid #e5eeea; color: #668087; background: #f8fbf9; font-size: 12px; }
.orders-table th:nth-child(1) { width: 18%; }
.orders-table th:nth-child(2) { width: 18%; }
.orders-table th:nth-child(3) { width: 31%; }
.orders-table th:nth-child(4) { width: 17%; }
.orders-table th:nth-child(5) { width: 12%; }
.orders-table th:nth-child(6) { width: 4%; }
.orders-table td { padding: 12px 16px; border-bottom-color: #e8efec; color: #42626c; font-size: 13px; }
.orders-table td strong { color: #24454e; font-size: 14px; }
.orders-table td small { color: #82989e; font-size: 12px; }
.orders-table td a { color: inherit; }
.fulfillment-label { display: flex; align-items: center; gap: 6px; margin-top: 4px; color: #385f56; }
.fulfillment-label span { color: #397b5b; font-size: 16px; }
.orders-table .branch-summary { margin-left: 21px; }
.orders-table .staff-order-item { margin: 2px 0; color: #496a73; font-size: 13px; }
.orders-table .order-status { display: inline-flex; align-items: center; gap: 5px; padding: 7px 11px; border-radius: 20px; color: #35764d; background: #edf7e8; font-size: 12px; }
.orders-table .order-status::before { content: "✓"; display: grid; width: 15px; height: 15px; place-items: center; border-radius: 50%; color: #fff; background: #77aa53; font-size: 10px; }
.orders-table .status-placed, .orders-table .status-pending { color: #8a681d; background: #fff6dd; }
.orders-table .status-processing, .orders-table .status-out_for_delivery, .orders-table .status-ready_for_pickup { color: #35647c; background: #eaf4f8; }
.orders-table .status-cancelled { color: #a13e3e; background: #fff0ef; }
.order-actions-cell { position: relative; text-align: center; }
.order-more { display: inline-grid; width: 36px; height: 36px; place-items: center; border: 1px solid #e5eeea; border-radius: 50%; color: #38705f; background: #fff; font-size: 22px; line-height: 1; cursor: pointer; }
.order-more:hover, .order-more[aria-expanded="true"] { border-color: #b9d9bf; background: #f0f8ed; }
.orders-table [hidden] { display: none !important; }
.order-details-row > td { padding: 0 !important; background: #f8fbf9; }
.order-details-panel { padding: 22px 24px; border-bottom: 1px solid #deebe4; }
.order-details-heading { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-bottom: 18px; }
.order-details-heading .section-kicker { margin-bottom: 4px; font-size: 10px; }
.order-details-heading h3 { margin: 0; color: #153d30; font-size: 18px; }
.order-details-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; }
.order-details-grid h4 { margin: 0 0 8px; color: #43695b; font-size: 12px; }
.order-details-grid p { margin: 0 0 5px; color: #657f82; font-size: 13px; line-height: 1.45; overflow-wrap: anywhere; }
.order-details-grid p span { float: right; }
.order-details-grid a { color: inherit; }
.order-customer-note { margin: 15px 0 0; padding: 11px 13px; border-radius: 8px; color: #5d7575; background: #edf5f0; font-size: 13px; }
.order-status-update { display: flex; align-items: center; gap: 10px; max-width: 520px; margin: 17px 0 0; padding-top: 15px; border-top: 1px solid #e1ebe4; }
.order-status-update label { color: #43695b; font-size: 13px; font-weight: 700; }
.order-status-update select { flex: 1; min-height: 38px; border: 1px solid #dbe7df; border-radius: 8px; background: #fff; }
.order-status-update .small-button { min-height: 38px; padding: 0 15px; border: 0; border-radius: 8px; color: #fff; background: #244b36; cursor: pointer; }
.pharmacy-workspace .commerce-footer { border-top-color: #e1ebe5; color: #738a81; text-align: center; }

/* Customer storefront: branch search first, branch catalogue after selection */
.customer-home .hero-actions, .customer-home .hero-proof { display: none; }
.customer-home .hero { grid-template-columns: 1.04fr .96fr; min-height: 400px; margin: 14px auto 0; padding: 34px 3.5%; background: #eaf5eb; }
.customer-home .hero-copy { max-width: 500px; padding: 0 0 8px; }
.customer-home .hero .eyebrow { margin-bottom: 14px; color: #37794a; }
.customer-home .hero h1 { max-width: 490px; color: #103a30; font-size: clamp(39px, 4.1vw, 58px); line-height: 1.06; }
.customer-home .hero h1 span { color: #103a30; }
.customer-home .hero-copy > p { max-width: 460px; margin: 13px 0 17px; color: #405e53; font-size: 15px; line-height: 1.5; }
.hero-location-search { display: grid; max-width: 590px; gap: 9px; padding: 9px; border: 1px solid #e4ebe5; border-radius: 10px; background: rgba(255,255,255,.96); box-shadow: 0 5px 18px rgba(38,73,47,.06); }
.hero-location-search .location-search-controls { display: flex; min-width: 0; align-items: center; gap: 8px; }
.hero-location-icon { flex: 0 0 auto; color: #285d47; font-size: 21px; }
.hero-location-search input[type="search"] { flex: 1; min-width: 0; min-height: 42px; padding: 8px 4px; border: 0; outline: 0; color: #273f36; background: transparent; font-size: 12px; }
.hero-location-search .button { flex: 0 0 auto; min-height: 42px; padding: 0 14px; white-space: nowrap; }
.hero-location-search .location-actions { display: flex; flex-wrap: nowrap; align-items: center; gap: 12px; margin: 0; padding: 0 5px; }
.use-location-link { display: inline-flex; align-items: center; gap: 7px; padding: 3px 0; border: 0; color: #286a42; background: transparent; font-size: 12px; font-weight: 700; cursor: pointer; white-space: nowrap; }
.hero-location-search .location-actions [role="status"] { overflow: hidden; color: #74877d; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.customer-home .hero-visual { min-height: 320px; }
.customer-home .hero-image { inset: -34px -7% -34px 0; background-position: center 32%; }
.customer-home .hero-sticker { top: 12%; right: -2%; }
.customer-home .hero-index { display: none; }
.branch-results-panel { max-width: 1320px; margin: 18px auto 0; padding: 22px; border: 1px solid #e3ece5; border-radius: 12px; background: #f7faf7; }
.branch-results-heading { display: flex; align-items: end; justify-content: space-between; margin-bottom: 14px; }
.branch-results-heading .section-kicker { margin-bottom: 4px; }
.branch-results-heading h2 { margin: 0; color: #173d31; font: 700 22px Manrope, sans-serif; }
.branch-results-heading > span { padding: 5px 10px; border-radius: 20px; color: #4f7e61; background: #eaf4e8; font-size: 12px; }
.branch-results-panel .branch-result-card { min-height: 215px; border-color: #e1ebe2; border-radius: 10px; }
.branch-results-panel .branch-result-card form { width: 100%; }
.branch-results-panel .branch-result-card .button { width: 100%; }
.home-location-empty { max-width: 1320px; margin: 18px auto 0; padding: 15px 18px; border: 1px solid #e5ece5; border-radius: 10px; color: #566f61; background: #f8faf8; }
.customer-home .trust-strip { margin-top: 14px; }
.customer-home #categories-legacy { display: none; }
.customer-home.has-selected-branch #services,
.customer-home.has-selected-branch #how-it-works,
.customer-home.has-selected-branch .prescription-banner,
.customer-home.has-selected-branch .home-popular-categories { display: none; }
.customer-home.has-selected-branch .deals-section { display: flex; flex-direction: column; gap: 18px; padding-top: 24px; }
.customer-home.has-selected-branch .catalogue-filter { order: 2; margin: 0; }
.customer-home.has-selected-branch .branch-catalogue-heading { order: 4; }
.customer-home.has-selected-branch .branch-catalogue-heading h2 { font-size: 25px; }
.branch-category-strip { order: 2; }
.customer-home.has-selected-branch .branch-category-strip { order: 3; }
.branch-category-strip > .section-kicker { margin: 0 0 10px; color: #52805d; font-size: 11px; }
.branch-category-pills { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.branch-category-pill { display: inline-flex; min-height: 42px; align-items: center; justify-content: center; padding: 0 16px; border: 1px solid #dce7dd; border-radius: 24px; color: #28553c; background: #fff; font-size: 14px; white-space: nowrap; transition: background .15s, color .15s, border-color .15s; }
.branch-category-pill:hover { border-color: #9dc99e; background: #f1f8ee; }
.branch-category-pill.is-active { border-color: #285b42; color: #fff; background: #285b42; }
.customer-home.has-selected-branch .deals-section > .section-heading:not(.branch-catalogue-heading) { order: 4; width: 100%; margin: 0; align-items: end; }
.customer-home.has-selected-branch .deals-section > .section-heading h2 { font-size: 25px; }
.customer-home.has-selected-branch .deals-section > .section-heading .section-kicker { margin-bottom: 4px; }
.customer-home.has-selected-branch .deals-section > .product-grid { order: 4; width: 100%; }
.customer-home.has-selected-branch .deals-section > .empty-search { order: 5; width: 100%; }
.customer-home.has-selected-branch .location-panel { margin-top: 16px; }
.customer-home.has-selected-branch .location-explanation { margin: 7px 0 0; }
.customer-home.has-selected-branch .branch-change { margin-top: 12px; }
.customer-home.has-selected-branch .branch-change > form { margin-top: 12px; }
.customer-home:not(.has-selected-branch) .home-popular-categories { padding-top: 42px; padding-bottom: 50px; }
.customer-home:not(.has-selected-branch) .home-popular-categories .section-heading h2 { font-size: 27px; }
.branch-storefront-header { min-height: 68px; max-width: 1320px; margin: 0 auto; padding: 0 24px; gap: 0; }
.branch-storefront-header .delivery-location,
.branch-storefront-header > .search,
.branch-storefront-header .header-links,
.branch-storefront-header .mobile-menu { display: none; }
.branch-storefront-header .cart-button { margin-left: auto; font-size: 14px; }
.branch-home-back { display: inline-flex; align-items: center; gap: 6px; margin-left: 24px; color: #315d43; font-size: 13px; font-weight: 700; white-space: nowrap; }
.branch-home-back span { font-size: 18px; line-height: 1; }
.has-selected-branch .message-list .message-success { display: none; }
.customer-home.has-selected-branch .location-panel { margin: 20px auto 0; }
.customer-home.has-selected-branch .selected-branch-card { max-width: 1220px; padding: 20px; border: 1px solid #dce8dd; border-radius: 12px; background: #fff; }
.customer-home.has-selected-branch .selected-branch-panel { align-items: center; }
.customer-home.has-selected-branch .selected-branch-panel h2 { font-size: 25px; }
.customer-home.has-selected-branch .selected-branch-panel > div > p:not(.section-kicker) { font-size: 14px; }
.customer-home.has-selected-branch .deals-section { max-width: 1220px; margin: 0 auto; padding-top: 20px; }
.customer-home.has-selected-branch .deals-section > .product-grid { order: 5; }
.customer-home.has-selected-branch .deals-section > .empty-search { order: 6; }
@media (max-width: 900px) {
  .customer-home .hero { min-height: 360px; padding: 30px 4%; }
  .customer-home .hero h1 { font-size: clamp(37px, 5.2vw, 48px); }
  .customer-home .hero-visual { min-height: 300px; }
  .hero-location-search .location-search-controls { flex-wrap: wrap; }
  .hero-location-search .location-search-controls input[type="search"] { flex-basis: calc(100% - 45px); }
  .hero-location-search .location-search-controls .button { width: 100%; }
  .branch-results-panel { margin-right: 20px; margin-left: 20px; }
  .branch-category-pills { gap: 8px; }
}
@media (max-width: 700px) {
  .customer-home .hero { grid-template-columns: 1fr; min-height: 0; padding: 28px 20px 0; }
  .customer-home .hero h1 { font-size: clamp(39px, 11vw, 52px); }
  .customer-home .hero-copy > p { margin: 12px 0 15px; font-size: 14px; }
  .hero-location-search .location-search-controls { flex-wrap: nowrap; }
  .hero-location-search .location-search-controls input[type="search"] { flex-basis: 0; font-size: 11px; }
  .hero-location-search .location-search-controls .button { width: auto; max-width: 48%; padding: 0 10px; font-size: 11px; }
  .hero-location-search .location-actions { flex-wrap: wrap; gap: 4px 9px; }
  .hero-location-search .location-actions [role="status"] { flex-basis: 100%; }
  .customer-home .hero-visual { min-height: 255px; margin: 10px -10px 0; }
  .customer-home .hero-image { inset: 0 -5% -5px; background-position: center 28%; }
  .branch-results-panel { margin: 14px 16px 0; padding: 16px; }
  .branch-results-panel .branch-result-grid { grid-template-columns: 1fr; }
  .branch-results-panel .branch-result-card { min-height: auto; }
  .home-location-empty { margin: 14px 16px 0; }
  .customer-home.has-selected-branch .location-panel { margin: 14px 16px; }
  .customer-home.has-selected-branch .deals-section { gap: 14px; padding-top: 8px; }
  .customer-home.has-selected-branch .deals-section > .section-heading { align-items: flex-start; }
  .customer-home.has-selected-branch .deals-section > .section-heading .section-link { flex: 0 0 auto; }
  .branch-category-pill { min-height: 40px; padding: 0 14px; font-size: 13px; }
  .branch-storefront-header { min-height: 60px; margin: 0; padding: 0 18px; }
  .branch-home-back { margin-left: 14px; font-size: 12px; }
  .customer-home.has-selected-branch .deals-section { margin: 0 16px; }
  .customer-home.has-selected-branch .selected-branch-card { padding: 16px; }
}
@media (max-width: 850px) {
  .commerce-page:has(.pharmacy-nav) .commerce-header { padding: 0 20px; }
  .commerce-page:has(.pharmacy-nav) .staff-nav.pharmacy-nav { gap: 6px; overflow-x: auto; padding: 8px 14px; }
  .pharmacy-nav a { min-height: 40px; padding: 0 10px; font-size: 12px; }
  .pharmacy-nav form { flex: 0 0 auto; }
  .pharmacy-orders-main { margin: 0 20px; padding-top: 30px; }
  .order-table-wrap { overflow-x: auto; }
  .orders-table { min-width: 900px; }
  .order-details-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
  .workspace-brand-caption { display: none; }
  .pharmacy-account { gap: 5px; max-width: 44%; overflow: hidden; font-size: 11px; white-space: nowrap; }
  .commerce-page:has(.pharmacy-nav) .commerce-header { min-height: 64px; padding: 0 14px; }
  .pharmacy-workspace-header .brand-name { font-size: 16px; }
  .pharmacy-workspace-header .brand-mark { width: 29px; height: 29px; }
  .pharmacy-orders-main { margin: 0 14px; padding-top: 24px; }
  .order-table-wrap { overflow-x: auto; }
  .pharmacy-orders-main .commerce-title { font-size: 39px; }
  .pharmacy-orders-main .pharmacy-intro { font-size: 14px; }
  .order-filters { grid-template-columns: 1fr; gap: 10px; padding: 13px; }
  .order-filter-button { justify-content: center; }
  .orders-table { min-width: 760px; }
  .orders-table td { padding: 10px; font-size: 12px; }
  .orders-table thead th { padding: 10px; }
  .order-details-panel { padding: 17px 14px; }
  .order-details-grid { grid-template-columns: 1fr; gap: 13px; }
  .order-status-update { align-items: stretch; flex-direction: column; }
  .order-status-update .small-button { min-height: 42px; }
}

/* Responsive dashboard sidebar shared by pharmacy and staff workspaces. */
.commerce-page.has-workspace-sidebar { overflow-x: hidden; }
.commerce-page.has-workspace-sidebar .commerce-header { justify-content: flex-start; gap: 16px; }
.commerce-page.has-workspace-sidebar .commerce-header > .back-link,
.commerce-page.has-workspace-sidebar .commerce-header > .pharmacy-account { margin-left: auto; }
.staff-nav a:focus-visible,
.staff-nav form button:focus-visible { outline: 3px solid #90c994; outline-offset: 2px; }
.commerce-page.has-workspace-sidebar .staff-nav[data-workspace-sidebar] { position: fixed; z-index: 42; top: 76px; bottom: 0; left: 0; display: flex; width: 258px; max-width: none; min-height: 0; flex-direction: column; align-items: stretch; gap: 8px; overflow-x: hidden; overflow-y: auto; padding: 15px; border: 0; border-right: 1px solid #2b6048; border-radius: 0; color: #fff; background: #173f2d; box-shadow: 4px 0 18px rgba(18, 55, 37, .12); }
.workspace-sidebar-brand { display: flex; min-height: 52px; align-items: center; gap: 11px; margin: 0 0 11px; padding: 0 5px 13px; border-bottom: 1px solid rgba(255,255,255,.17); color: #fff !important; font-size: 15px !important; font-weight: 800 !important; }
.workspace-sidebar-brand-mark { display: grid; width: 38px; height: 38px; flex: 0 0 38px; place-items: center; border-radius: 12px; color: #173f2d; background: #dff4d0; font-size: 30px; font-weight: 700; line-height: 1; }
.workspace-sidebar-label { overflow: hidden; white-space: nowrap; }
.commerce-page.has-workspace-sidebar .staff-nav[data-workspace-sidebar] > a:not(.workspace-sidebar-brand) { display: flex; min-width: 0; min-height: 46px; align-items: center; gap: 13px; overflow: hidden; padding: 0 10px; border-radius: 10px; color: #e8f1eb; font-size: 14px; font-weight: 600; text-decoration: none; }
.commerce-page.has-workspace-sidebar .staff-nav[data-workspace-sidebar] > a:not(.workspace-sidebar-brand):hover { color: #fff; background: rgba(255,255,255,.1); }
.commerce-page.has-workspace-sidebar .staff-nav[data-workspace-sidebar] > a[aria-current="page"] { color: #173f2d; background: #eaf5e3; }
.commerce-page.has-workspace-sidebar .staff-nav[data-workspace-sidebar] > a[aria-current="page"]::after { display: none; }
.commerce-page.has-workspace-sidebar .workspace-nav-icon { display: inline-grid; width: 26px; height: 26px; flex: 0 0 26px; place-items: center; color: inherit; font-size: 19px; line-height: 1; }
.commerce-page.has-workspace-sidebar .staff-nav[data-workspace-sidebar] .storefront-nav-link { margin: 7px 0 0; padding-left: 10px; border: 0; border-top: 1px solid rgba(255,255,255,.17); border-radius: 0; }
.commerce-page.has-workspace-sidebar .staff-nav[data-workspace-sidebar] form { width: 100%; margin: auto 0 0; padding-top: 12px; border-top: 1px solid rgba(255,255,255,.17); }
.commerce-page.has-workspace-sidebar .staff-nav[data-workspace-sidebar] form button { display: flex; width: 100%; min-height: 46px; align-items: center; gap: 13px; padding: 0 10px; border: 0; border-radius: 10px; color: #fff; background: transparent; font-size: 14px; font-weight: 600; text-align: left; cursor: pointer; }
.commerce-page.has-workspace-sidebar .staff-nav[data-workspace-sidebar] form button:hover { background: rgba(255,255,255,.1); }
.commerce-page.has-workspace-sidebar .commerce-main { width: auto; max-width: none; margin-right: 3vw; margin-left: calc(258px + 3vw); }
.commerce-page.has-workspace-sidebar .commerce-footer { margin-left: 258px; }
@media (max-width: 850px) {
  .commerce-page.has-workspace-sidebar { overflow-x: hidden; }
  .commerce-page.has-workspace-sidebar .commerce-header { position: relative; z-index: 51; justify-content: flex-start; gap: 8px; }
  .commerce-page.has-workspace-sidebar .staff-nav[data-workspace-sidebar] { position: relative; z-index: 1; top: auto; bottom: auto; left: auto; width: auto; max-width: none; min-height: 0; margin: 0 14px 18px; padding: 14px; border: 0; border-radius: 14px; box-shadow: 0 6px 20px rgba(18,55,37,.1); }
  .commerce-page.has-workspace-sidebar .workspace-sidebar-brand { margin-bottom: 8px; }
  .commerce-page.has-workspace-sidebar .commerce-main,
  .commerce-page.has-workspace-sidebar .commerce-footer { width: auto; margin: 0; }
}

/* Pharmacy inventory page */
.pharmacy-inventory-main { max-width: none; min-height: calc(100vh - 76px); padding: 32px 28px 48px; }
.inventory-heading { align-items: flex-start; margin: 0 0 26px; }
.inventory-heading .section-kicker { margin: 0 0 8px; color: #2f6b45; letter-spacing: .08em; }
.inventory-heading .commerce-title { margin: 0 0 5px; color: #142b45; font-size: clamp(36px, 3vw, 48px); letter-spacing: -.05em; }
.inventory-heading .commerce-title em { color: #267c69; }
.inventory-heading .pharmacy-intro { margin: 0; color: #69849a; font-size: 16px; }
.inventory-heading-actions { display: flex; gap: 12px; }
.inventory-heading-actions .button { display: inline-flex; align-items: center; justify-content: center; gap: 9px; min-height: 44px; padding: 0 20px; }
.inventory-heading-actions .button-light { border: 1px solid #a8c6b7; }
.inventory-stat-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin: 0 0 22px; }
.inventory-stat { display: flex; min-height: 104px; align-items: center; gap: 17px; padding: 18px 20px; border: 1px solid #e1ebe7; border-radius: 12px; background: #fff; box-shadow: 0 2px 8px rgba(30,67,52,.025); }
.inventory-stat-icon { display: grid; width: 58px; height: 58px; flex: 0 0 58px; place-items: center; border-radius: 14px; color: #145845; background: #e3f3e4; font-size: 29px; font-weight: 700; }
.inventory-stat .icon-low { color: #d27a0c; background: #fff0d9; }
.inventory-stat .icon-out { color: #cc3547; background: #ffe5e8; }
.inventory-stat div { display: grid; gap: 7px; color: #678096; font-size: 14px; }
.inventory-stat strong { color: #142b45; font-size: 24px; line-height: 1; }
.inventory-panel { padding: 14px; border: 1px solid #e0eae7; border-radius: 12px; background: #fff; box-shadow: 0 3px 14px rgba(30,67,52,.03); }
.inventory-filters { display: grid; grid-template-columns: minmax(240px,1fr) repeat(3,minmax(130px, .3fr)) auto; gap: 10px; margin-bottom: 18px; }
.inventory-filters label { min-width: 0; }
.inventory-filters select, .inventory-search { width: 100%; height: 46px; padding: 0 12px; border: 1px solid #dfe9e9; border-radius: 9px; color: #526f84; background: #fff; font: inherit; font-size: 13px; }
.inventory-filters select { cursor: pointer; }
.inventory-search { display: flex; align-items: center; gap: 10px; }
.inventory-search > span:not(.visually-hidden) { color: #6d8ca0; font-size: 22px; }
.inventory-search input { width: 100%; min-width: 0; border: 0; outline: 0; color: #233f54; background: transparent; font: inherit; font-size: 13px; }
.inventory-search input::placeholder { color: #8ba0b1; }
.inventory-filters .button { min-height: 46px; padding: 0 16px; border: 1px solid #dfe9e9; color: #315b70; background: #fff; }
.inventory-table-wrap { overflow-x: auto; border: 1px solid #e1ebef; border-radius: 9px; }
.inventory-table { width: 100%; min-width: 980px; border-collapse: collapse; color: #536f82; font-size: 12px; }
.inventory-table thead { background: #f3f8f7; }
.inventory-table th { padding: 15px 13px; color: #547084; font-size: 12px; font-weight: 700; text-align: left; white-space: nowrap; }
.inventory-table td { height: 82px; padding: 11px 13px; border-top: 1px solid #e7eff1; white-space: nowrap; }
.inventory-product-cell { display: flex; min-width: 205px; align-items: center; gap: 12px; }
.inventory-product-image { display: grid; width: 54px; height: 54px; flex: 0 0 54px; place-items: center; overflow: hidden; border-radius: 10px; color: #438068; background: #f3f7f7; font-size: 24px; }
.inventory-product-image img { width: 100%; height: 100%; object-fit: contain; }
.inventory-product-cell > span:last-child { display: grid; gap: 5px; white-space: normal; }
.inventory-product-cell strong { color: #18354e; font-size: 12px; }
.inventory-product-cell small, .stock-level small { color: #7890a1; font-size: 11px; }
.stock-level { display: grid; min-width: 110px; gap: 6px; }
.stock-track { width: 100%; height: 10px; overflow: hidden; border-radius: 8px; background: #eaf0f4; }
.stock-fill { display: block; height: 100%; border-radius: inherit; background: #18886e; }
.stock-fill-low { background: #f0ad4e; }
.stock-fill-empty { background: #e6edf0; }
.inventory-status { display: inline-flex; align-items: center; gap: 7px; padding: 6px 11px; border-radius: 18px; font-size: 11px; }
.inventory-status::before { width: 8px; height: 8px; border-radius: 50%; background: currentColor; content: ""; }
.inventory-status.status-in { color: #176247; background: #e4f4e9; }
.inventory-status.status-low { color: #b86a07; background: #fff0da; }
.inventory-status.status-out { color: #c02c3d; background: #ffe5e9; }
.inventory-action { color: #14725f; font-size: 18px; font-weight: 800; letter-spacing: 2px; }
.inventory-empty { height: 100px !important; color: #748d9e; text-align: center; }
.inventory-table-footer { display: flex; min-height: 48px; align-items: center; justify-content: space-between; gap: 15px; padding: 10px 4px 0; color: #71899a; font-size: 12px; }
.inventory-pagination { display: flex; align-items: center; gap: 6px; }
.inventory-pagination a, .inventory-pagination span { display: grid; min-width: 32px; height: 32px; place-items: center; padding: 0 8px; border: 1px solid #dfe9ed; border-radius: 7px; color: #607d90; background: #fff; }
.inventory-pagination a:hover, .inventory-pagination .is-current { border-color: #145a43; color: #fff; background: #145a43; }
.inventory-pagination span[aria-disabled="true"] { color: #a8b8c2; }
@media (max-width: 1050px) { .inventory-stat-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } .inventory-filters { grid-template-columns: repeat(2,minmax(0,1fr)); } .inventory-search { grid-column: 1 / -1; } }
@media (max-width: 700px) { .pharmacy-inventory-main { padding: 24px 16px 35px; } .inventory-heading { flex-direction: column; gap: 16px; } .inventory-heading-actions { width: 100%; } .inventory-heading-actions .button { flex: 1; padding: 0 10px; } .inventory-stat-grid { gap: 9px; } .inventory-stat { min-height: 82px; gap: 10px; padding: 12px; } .inventory-stat-icon { width: 42px; height: 42px; flex-basis: 42px; border-radius: 11px; font-size: 22px; } .inventory-stat div { font-size: 11px; } .inventory-stat strong { font-size: 20px; } .inventory-filters { grid-template-columns: 1fr; } .inventory-search { grid-column: auto; } .inventory-table-footer { align-items: flex-start; flex-direction: column; } .inventory-pagination { flex-wrap: wrap; } }