/* Phase 4: cart refinements and safe responsive enhancements. */
:root { --p4-dark:#272a1b; --p4-paper:#faf8f4; }
html { scroll-padding-top: 108px; }
body { overflow-x: clip; }
button, input, select, textarea { font: inherit; }
:where(button,a,input,select,textarea):focus-visible { outline: 2px solid #69774d; outline-offset: 3px; }
.bag { max-width: 100vw; }
.bag .bag-head { flex-shrink: 0; border-bottom: 1px solid rgba(39,42,27,.08); }
.bag .bag-ship { flex-shrink: 0; }
.bag .bag-foot { flex-shrink: 0; padding-bottom:max(20px, env(safe-area-inset-bottom)); }
.bag .bag-body { scrollbar-width:thin; scrollbar-color:#c5bdad transparent; }
.bag .bag-line { align-items:start; }
.bag .bl-name { overflow-wrap:anywhere; }
.bag .bl-qty button { min-width:36px; min-height:36px; }
.bag .bag-checkout { min-height:52px; }
.bag .be-add { min-height:42px; min-width:55px; }
.bag .bag-ship.is-done { background:#e9eede; color:#334328; }
.bag .bs-bar { height:6px; }
@media (max-width: 1023px) {
  .site-nav { max-width: calc(100vw - 20px); }
  main, section, footer { max-width:100%; }
  .bag .bag-head{padding-top:max(18px, env(safe-area-inset-top));}
}
@media (max-width: 600px) {
  html { scroll-padding-top:76px; }
  .bag { width:100%; border-radius:0; }
  .bag .bag-head{ padding:18px 18px 14px; }
  .bag .bag-body{ padding:4px 18px 12px; }
  .bag .bag-ship{ margin:0 18px 5px; padding:12px 14px; }
  .bag .bag-foot{ padding:12px 18px max(15px,env(safe-area-inset-bottom)); }
  .bag .bag-line{grid-template-columns:72px minmax(0,1fr);gap:12px;padding:14px 0;}
  .bag .bl-img{width:72px;}
  .bag .bl-name{font-size:14px;}
  .bag .bl-bot{flex-wrap:wrap;}
  .bag .bf-total{margin:8px 0 12px;}
  .bag .bag-checkout{min-height:50px;padding:14px;}
  .bag .be-picks{margin-top:24px;}
  .bag .be-pick{grid-template-columns:50px minmax(0,1fr) auto;gap:9px;}
  .bag .be-pick img{width:50px;height:50px;}
  .bag .be-add{padding:8px 12px;}
  input, select, textarea { max-width:100%; }
}
@media(max-width:360px){ .bag .bag-head,.bag .bag-body{padding-left:13px;padding-right:13px}.bag .bag-ship{margin-left:13px;margin-right:13px}.bag .bag-foot{padding-left:13px;padding-right:13px} }
@media (prefers-reduced-motion:reduce){ *,*::before,*::after{scroll-behavior:auto!important;} }
