/* Trust layer + robustness, shared by the shop and every generated page.
   Built on the existing look: Gotham Medium/Bold only, rounded rectangles, Google blue with green, yellow and red. */

/* ---------- browser surfaces themed from the palette ---------- */
:root{color-scheme:light; accent-color:var(--blue,#0B57D0);}
::selection{background:var(--blue-tonal,#D3E3FD); color:var(--blue-ink,#041E49);}
input, textarea{caret-color:var(--blue,#0B57D0);}
:focus-visible{outline:2px solid var(--blue,#0B57D0); outline-offset:2px;}
a{text-underline-offset:3px;}
html{scrollbar-color:#C4C7C5 transparent;}

/* announcement bar: separated by hairlines instead of dots */
.announce span + span{margin-left:14px; padding-left:14px; border-left:1px solid rgba(255,255,255,.45);}
@media (max-width:520px){ .announce span + span{margin-left:10px; padding-left:10px;} .announce{font-size:13px;} .announce span:nth-child(2){display:none;} }

/* photo that could not be loaded: quiet grey text instead of a broken-image icon */
img.img-missing{object-fit:contain!important;}

/* ---------- footer categories wrap instead of pushing the page wider ---------- */
.foot-cats{display:flex; flex-wrap:wrap; justify-content:center; gap:0 4px; margin-bottom:18px; font-size:14px;}
.foot-cats a{margin:0; padding:10px 9px; white-space:nowrap; text-decoration:none; color:var(--ink,#191C1D);}
.foot-cats a:hover{text-decoration:underline;}
footer .foot-line{line-height:1.7;}
footer .foot-line a{padding:6px 2px;}

/* ---------- "Visit our shop" block ---------- */
.visit{padding:24px 0 72px;}
.visit-panel{background:var(--tile,#F1F3F4); border-radius:28px; padding:40px 44px; display:grid; grid-template-columns:minmax(0,1.25fr) minmax(0,1fr); gap:32px 56px; align-items:center;}
.visit h2{font-size:32px; line-height:1.15; letter-spacing:-.04em; font-weight:700; margin-bottom:14px; text-wrap:balance;}
.shop-status{display:inline-flex; align-items:center; gap:9px; font-size:15px; font-weight:700; color:var(--ink,#191C1D); margin-bottom:18px;}
.shop-status .dot{width:9px; height:9px; border-radius:50%; background:#80868B; flex-shrink:0;}
.shop-status.is-open .dot{background:var(--green,#188038);}
.shop-status.is-closed .dot{background:var(--red,#D93025);}
.trust-item.shop-status, .perks .shop-status{margin:0;}
.shop-status .when{font-weight:500; color:var(--muted,#5F6368);}
.visit address{font-style:normal; font-size:17px; font-weight:700; letter-spacing:-.02em; margin-bottom:14px;}
.visit-hours{display:grid; gap:4px; font-size:15px; color:var(--muted,#5F6368); max-width:340px;}
.visit-hours div{display:flex; justify-content:space-between; gap:20px;}
.visit-hours dt{font-weight:500;}
.visit-hours dd{font-weight:700; color:var(--ink,#191C1D);}
.visit-actions{display:grid; gap:10px;}
.vbtn{display:flex; align-items:center; justify-content:center; min-height:52px; padding:0 22px; border-radius:var(--r-btn,14px); font-size:15px; font-weight:500; text-decoration:none; text-align:center; background:#fff; color:var(--ink,#191C1D); border:1px solid var(--line,#C4C7C5); transition:background .15s, border-color .15s, transform .1s;}
.vbtn:hover{border-color:var(--ink,#191C1D);}
.vbtn:active{transform:scale(.99);}
.vbtn.primary{background:var(--blue,#0B57D0); border-color:var(--blue,#0B57D0); color:#fff;}
.vbtn.primary:hover{background:var(--blue-dark,#0842A0); border-color:var(--blue-dark,#0842A0);}

/* small "open now" line on product pages */
.perks .shop-status{margin:0; font-size:inherit; font-weight:500; color:var(--muted,#5F6368); gap:8px;}
.perks .shop-status b{color:var(--ink,#191C1D); font-weight:500;}

@media (max-width:520px){
  .visit-hours div{display:block;}
  .visit-hours dd{margin-bottom:8px;}
}
@media (max-width:860px){
  .visit{padding:8px 0 56px;}
  .visit-panel{grid-template-columns:minmax(0,1fr); padding:28px 22px; border-radius:24px; gap:24px;}
  .visit h2{font-size:26px;}
  .visit-hours{max-width:none;}
}

/* ---------- touch: comfortable targets on phones and tablets (44px) ---------- */
@media (pointer:coarse), (max-width:640px){
  .cat-tab{min-height:44px;}
  .subcat-tab{min-height:40px;}
  .nav-cta, .cart-btn{min-height:44px; min-width:44px; justify-content:center;}
  .announce a{display:inline-block; padding:8px 4px;}
  a.chip{display:inline-flex; align-items:center; min-height:40px; padding:0 16px;}
  .crumbs a{display:inline-block; padding:10px 2px;}
  .thumb{width:64px; height:64px;}
}

/* phones: the "See all" links and the open/closed link in the trust list get a 44px touch height */
@media (pointer:coarse), (max-width:640px){
  .see-all-btn{min-height:44px; padding:0 6px;}
  a.trust-item{min-height:44px;}
}