/* Crescent Bioresearch — Shared Cart Styles
   Drawer + nav icon, consumed on every production page. */

/* ----- Cart icon in nav-right ----- */
.cart-toggle{position:relative;background:none;border:0;cursor:pointer;display:inline-flex;align-items:center;gap:8px;padding:8px 4px;color:var(--ink,#1C1C1A);font-family:inherit;transition:color .2s}
.cart-toggle:hover{color:var(--teal,#0F6E56)}
.cart-toggle svg{width:20px;height:20px;display:block}
.cart-toggle .cart-count{position:absolute;top:-2px;right:-6px;background:var(--teal,#0F6E56);color:#fff;font-family:'Cinzel',serif;font-weight:400;font-size:10px;letter-spacing:.5px;min-width:18px;height:18px;display:inline-flex;align-items:center;justify-content:center;padding:0 5px;border-radius:9px;line-height:1}
.cart-toggle .cart-count.hidden{display:none}

/* ----- Scrim ----- */
.cart-scrim{position:fixed;inset:0;background:rgba(28,28,26,.45);z-index:200;opacity:0;pointer-events:none;transition:opacity .25s ease;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}
.cart-scrim.open{opacity:1;pointer-events:auto}

/* ----- Drawer ----- */
.cart-drawer{position:fixed;top:0;right:0;bottom:0;width:440px;max-width:100vw;background:var(--bg,#F7F6F2);z-index:210;display:flex;flex-direction:column;box-shadow:-12px 0 40px rgba(0,0,0,.10);transform:translateX(100%);transition:transform .35s cubic-bezier(.4,0,.2,1);font-family:'Raleway',sans-serif}
.cart-drawer.open{transform:translateX(0)}

.cart-drawer .drawer-head{display:flex;align-items:center;justify-content:space-between;padding:14px 24px;border-bottom:1px solid var(--rule,#C4C2BA);background:#fff}
.cart-drawer .drawer-head .h{font-family:'Cinzel',serif;font-weight:400;font-size:17px;letter-spacing:3px;color:var(--ink,#1C1C1A)}
.cart-drawer .drawer-head .h .count{color:var(--teal,#0F6E56);font-weight:400;margin-left:6px}
.cart-drawer .drawer-head .x{width:36px;height:36px;border:1px solid var(--rule,#C4C2BA);background:none;cursor:pointer;display:grid;place-items:center;transition:.2s;color:var(--ink,#1C1C1A);font-size:18px;line-height:1;font-family:inherit}
.cart-drawer .drawer-head .x:hover{border-color:var(--ink,#1C1C1A);background:var(--ink,#1C1C1A);color:#fff}

/* Free-shipping progress bar */
.cart-drawer .shipping-bar{padding:12px 24px;background:var(--teal-pale,#E1F5EE);border-bottom:1px solid var(--rule,#C4C2BA)}
.cart-drawer .shipping-bar .ship-text{font-size:10.5px;letter-spacing:2px;text-transform:uppercase;color:var(--teal,#0F6E56);font-weight:400;margin-bottom:8px}
.cart-drawer .shipping-bar .ship-text strong{font-family:'Cinzel',serif;color:var(--ink,#1C1C1A);font-weight:400}
.cart-drawer .shipping-bar .progress{height:4px;background:rgba(15,110,86,.18);border-radius:2px;overflow:hidden}
.cart-drawer .shipping-bar .fill{height:100%;background:var(--teal,#0F6E56);transition:width .35s ease}

/* Body */
.cart-drawer .drawer-body{flex:1;overflow-y:auto;padding:0}

.cart-item{display:grid;grid-template-columns:72px 1fr auto;gap:14px;padding:14px 24px;border-bottom:1px solid var(--rule,#C4C2BA);align-items:center}
.cart-item .img{aspect-ratio:1;background:#fff;border:1px solid var(--rule,#C4C2BA);display:grid;place-items:center;overflow:hidden}
.cart-item .img img{max-width:74%;max-height:80%;mix-blend-mode:multiply}
.cart-item .info .cat{font-size:8.5px;letter-spacing:2.5px;text-transform:uppercase;color:var(--teal-mid,#1D9E75);margin-bottom:4px}
.cart-item .info .nm{font-family:'Cinzel',serif;font-size:14px;letter-spacing:1.5px;color:var(--ink,#1C1C1A);margin-bottom:2px;line-height:1.25}
.cart-item .info .dose{font-size:10px;letter-spacing:1.5px;color:var(--muted,#5F5E5A);text-transform:uppercase;margin-bottom:10px}
.cart-item .info .qty{display:inline-flex;align-items:center;border:1px solid var(--rule,#C4C2BA);height:28px}
.cart-item .info .qty button{background:none;border:0;padding:0 10px;height:100%;cursor:pointer;font-size:14px;color:var(--ink,#1C1C1A);font-family:inherit;line-height:1}
.cart-item .info .qty button:hover{background:var(--bg2,#EEECEA)}
.cart-item .info .qty span{padding:0 12px;font-family:'Cinzel',serif;font-size:13px;color:var(--ink,#1C1C1A);min-width:32px;text-align:center}
.cart-item .right{text-align:right}
.cart-item .right .price{font-family:'Cinzel',serif;font-size:15px;color:var(--teal,#0F6E56);margin-bottom:8px}
.cart-item .right .rm{font-size:9px;letter-spacing:2px;text-transform:uppercase;color:var(--muted,#5F5E5A);background:none;border:0;cursor:pointer;padding:4px 0;border-bottom:1px solid var(--rule,#C4C2BA);font-family:inherit}
.cart-item .right .rm:hover{color:var(--ink,#1C1C1A);border-bottom-color:var(--ink,#1C1C1A)}

/* Empty state */
.cart-drawer .empty-state{padding:64px 32px;text-align:center;color:var(--muted,#5F5E5A)}
.cart-drawer .empty-state .ic{font-family:'Cinzel',serif;font-size:36px;color:var(--rule,#C4C2BA);margin-bottom:14px;line-height:1}
.cart-drawer .empty-state .h{font-family:'Cinzel',serif;font-weight:400;font-size:15px;letter-spacing:2px;color:var(--ink,#1C1C1A);margin-bottom:8px}
.cart-drawer .empty-state .t{font-size:12px;line-height:1.7;margin-bottom:24px}
.cart-drawer .empty-state .browse{display:inline-block;font-family:'Cinzel',serif;font-weight:300;font-size:10px;letter-spacing:3px;text-transform:uppercase;color:#fff;background:var(--teal,#0F6E56);padding:12px 24px;transition:background .2s;text-decoration:none}
.cart-drawer .empty-state .browse:hover{background:var(--teal-mid,#1D9E75)}

/* Footer */
.cart-drawer .drawer-foot{padding:14px 24px;border-top:1px solid var(--rule,#C4C2BA);background:#fff}
.cart-drawer .totals{display:grid;gap:6px;margin-bottom:12px}
.cart-drawer .totals .row{display:flex;justify-content:space-between;align-items:baseline;font-size:12px;letter-spacing:1px;color:var(--muted,#5F5E5A)}
.cart-drawer .totals .row .l{text-transform:uppercase;letter-spacing:2px;font-size:9.5px;color:var(--muted,#5F5E5A)}
.cart-drawer .totals .row .v{font-family:'Cinzel',serif;color:var(--ink,#1C1C1A);font-size:13px}
.cart-drawer .totals .row.sub{padding-bottom:10px;border-bottom:1px solid var(--rule,#C4C2BA);margin-bottom:4px}
.cart-drawer .totals .row.tot{padding-top:4px}
.cart-drawer .totals .row.tot .l{font-size:11px;color:var(--ink,#1C1C1A)}
.cart-drawer .totals .row.tot .v{font-family:'Cinzel',serif;font-weight:400;font-size:22px;color:var(--teal,#0F6E56)}

.cart-drawer .checkout-btn{display:block;width:100%;font-family:'Cinzel',serif;font-weight:300;font-size:11px;letter-spacing:4px;text-transform:uppercase;background:var(--teal,#0F6E56);color:#fff;border:0;padding:14px;cursor:pointer;transition:background .2s;margin-bottom:8px;text-decoration:none;text-align:center}
.cart-drawer .checkout-btn:hover{background:var(--teal-mid,#1D9E75)}
.cart-drawer .checkout-btn.disabled{background:var(--rule,#C4C2BA);cursor:not-allowed;pointer-events:none}

.cart-drawer .continue-link{display:block;text-align:center;font-size:10px;letter-spacing:2.5px;text-transform:uppercase;color:var(--muted,#5F5E5A);transition:color .2s;cursor:pointer;background:none;border:0;font-family:inherit;width:100%;padding:6px 0}
.cart-drawer .continue-link:hover{color:var(--teal,#0F6E56)}

.cart-drawer .foot-trust{margin-top:10px;padding-top:10px;border-top:1px solid var(--rule,#C4C2BA);display:flex;justify-content:space-between;font-size:9px;letter-spacing:1.5px;color:var(--muted,#5F5E5A)}
.cart-drawer .foot-trust .t{display:flex;gap:6px;align-items:center}
.cart-drawer .foot-trust .ic{color:var(--teal,#0F6E56);font-family:'Cinzel',serif;font-size:11px}

/* Toast (Add-to-Cart confirmation) */
.cart-toast{position:fixed;bottom:24px;right:24px;background:var(--ink,#1C1C1A);color:#fff;padding:14px 20px;font-family:inherit;font-size:11px;letter-spacing:1.5px;z-index:220;transform:translateY(120%);opacity:0;transition:transform .3s ease,opacity .3s ease;display:flex;align-items:center;gap:12px;max-width:340px;box-shadow:0 8px 28px rgba(0,0,0,.18)}
.cart-toast.show{transform:translateY(0);opacity:1}
.cart-toast .ic{color:var(--teal-light,#9FE1CB);font-family:'Cinzel',serif;font-size:14px;line-height:1}
.cart-toast strong{font-family:'Cinzel',serif;font-weight:400;letter-spacing:1.2px;color:#fff;margin-right:4px}
.cart-toast .ot{color:var(--teal-light,#9FE1CB);text-transform:uppercase;letter-spacing:2px;font-size:9.5px;border-bottom:1px solid var(--teal-light,#9FE1CB);padding-bottom:1px;text-decoration:none;cursor:pointer;background:none;border-left:0;border-right:0;border-top:0;font-family:inherit;padding:0;padding-bottom:1px}
.cart-toast .ot:hover{color:#fff;border-bottom-color:#fff}

@media (max-width:780px){
.cart-drawer{width:100%}
.cart-toast{left:16px;right:16px;bottom:16px;max-width:none}
}

/* ---------- Out-of-stock state for product cards ---------- */
.shop-card.is-out-of-stock,
.fc.is-out-of-stock { position:relative; opacity:.85 }
.shop-card.is-out-of-stock::after,
.fc.is-out-of-stock::after {
  content: "Currently Unavailable";
  position: absolute;
  top: 12px; right: 12px;
  font-family: 'Cinzel', serif; font-weight: 400;
  font-size: 9px; letter-spacing: 2px; text-transform: uppercase;
  background: #FFF8E1; color: #5e4e1a;
  border: 1px solid #E8D5A8;
  padding: 4px 10px; z-index: 3;
}
.shop-card.is-out-of-stock .card-stage img,
.fc.is-out-of-stock .fc-img img { filter: grayscale(.4); }

/* ====================================================
   Mobile nav — hamburger menu (≤768px)
   Injected into every page via cart.js + this stylesheet.
   ==================================================== */

/* Hide hamburger/menu on desktop by default */
.nav-hamburger,
.nav-mobile-menu { display: none; }

@media (max-width: 768px) {
  /* ---- Sticky announce bar (free-shipping line stays visible) ---- */
  .announce-bar {
    position: sticky !important;
    top: 0 !important;
    z-index: 110 !important;
    font-size: 8.5px !important;
    letter-spacing: 2px !important;
    padding: 8px 14px !important;
    line-height: 1.5 !important;
    background: var(--teal, #0F6E56) !important;
  }

  /* ---- Nav: centered logo, hamburger left, Shop Now right ---- */
  nav {
    height: 134px !important;       /* taller to fit larger 120px logo */
    padding: 0 !important;
    position: sticky !important;
    top: 32px !important;           /* sit just below announce bar */
    z-index: 100 !important;
    background: rgba(247, 246, 242, 0.97) !important;
    justify-content: unset !important;
    border-bottom: 1px solid var(--rule, #C4C2BA) !important;
  }

  /* Hamburger pinned to LEFT edge of nav */
  .nav-hamburger {
    display: inline-flex !important;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 5px;
    width: 44px; height: 44px;
    background: none; border: 0;
    cursor: pointer; padding: 0;
    font-family: inherit;
    position: absolute !important;
    left: 12px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    margin: 0 !important;
  }
  .nav-hamburger span {
    display: block;
    width: 24px; height: 2px;
    background: var(--ink, #1C1C1A);
    transition: transform .2s ease, opacity .2s ease;
  }
  .nav-hamburger[aria-expanded="true"] span:nth-child(1) {
    transform: translateY(7px) rotate(45deg);
  }
  .nav-hamburger[aria-expanded="true"] span:nth-child(2) {
    opacity: 0;
  }
  .nav-hamburger[aria-expanded="true"] span:nth-child(3) {
    transform: translateY(-7px) rotate(-45deg);
  }

  /* Logo CENTERED, much larger */
  .nav-logo {
    position: absolute !important;
    left: 50% !important;
    top: 50% !important;
    transform: translate(-50%, -50%) !important;
    margin: 0 !important;
  }
  .nav-logo img,
  .nav-logo .logo-svg {
    height: 120px !important;       /* Exhibit B — bigger logo */
    width: auto !important;
    display: block !important;
  }

  /* Hide desktop nav-links + 3rd-party trust label */
  .nav-links { display: none !important; }
  .nav-right .nav-trust { display: none !important; }

  /* Shop Now pinned to RIGHT edge of nav */
  .nav-right {
    position: absolute !important;
    right: 12px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    gap: 8px !important;
    margin: 0 !important;
  }
  .nav-right .nav-cta {
    padding: 8px 14px !important;
    font-size: 8.5px !important;
    letter-spacing: 2px !important;
  }

  /* ---- Mobile slide-down menu ---- */
  .nav-mobile-menu {
    display: block !important;
    position: fixed;
    top: 166px;             /* announce-bar (32px) + nav (134px) */
    left: 0; right: 0;
    background: var(--bg, #F7F6F2);
    border-bottom: 1px solid var(--rule, #C4C2BA);
    padding: 8px 24px 20px;
    transform: translateY(-150%);
    transition: transform .25s ease;
    z-index: 99;
    box-shadow: 0 12px 24px rgba(0, 0, 0, .08);
    max-height: calc(100vh - 166px);
    overflow-y: auto;
  }
  .nav-mobile-menu.open { transform: translateY(0); }
  .nav-mobile-menu a {
    display: block;
    padding: 16px 0;
    font-family: 'Cinzel', serif;
    font-weight: 300;
    font-size: 13px;
    letter-spacing: 3px;
    color: var(--ink, #1C1C1A);
    text-transform: uppercase;
    text-decoration: none;
    border-bottom: 1px solid var(--rule, #C4C2BA);
  }
  .nav-mobile-menu a:last-child { border-bottom: 0; }
  .nav-mobile-menu a:hover,
  .nav-mobile-menu a:active { color: var(--teal, #0F6E56); }

  /* ---- Hero badge: trim to "Independently Verified" + blinking dot on mobile ---- */
  .hero-badge-text {
    font-size: 0 !important;
    line-height: 0 !important;
  }
  .hero-badge-text::after {
    content: "Independently Verified";
    font-family: 'Raleway', sans-serif;
    font-size: 9px;
    font-weight: 300;
    letter-spacing: 3px;
    color: var(--teal-mid, #1D9E75);
    text-transform: uppercase;
    line-height: 1.4;
  }

  /* ---- Footer — condense links across every page on mobile ---- */
  footer .footer-top {
    flex-direction: column !important;
    gap: 22px !important;
    align-items: flex-start !important;
  }
  footer .footer-links {
    gap: 12px !important;
    row-gap: 10px !important;
    flex-wrap: wrap !important;
  }
}
