:root{
  --wine:#661111; --wine-dark:#4a0c0c; --ink:#1d1d1d; --muted:#6f6f6f;
  --line:#e9e2e2; --bg:#faf7f7; --card:#ffffff; --pink:#f6e8ea; --ok:#1e7b34;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font-family:Arial,Helvetica,sans-serif;color:var(--ink);background:var(--bg);line-height:1.55}
a{color:var(--wine)}
img{max-width:100%;display:block}
.topbar{display:flex;justify-content:space-between;align-items:center;padding:.8rem 1rem;background:var(--wine);color:#fff;position:sticky;top:0;z-index:20}
.topbar a{color:#fff;text-decoration:none}
.brand{font-weight:bold;letter-spacing:2px;font-size:.95rem;display:inline-flex;align-items:center;gap:.55rem}
.brand-logo{height:44px;width:auto;display:block}
.brand span{background:#fff;color:var(--wine);padding:.1rem .45rem;margin-left:.4rem;letter-spacing:1px;font-size:.8rem;border-radius:3px}
.cart-link{font-size:.95rem}
.topbar .home-btn{display:inline-block;background:#fff;color:var(--wine);border-radius:8px;padding:.45rem .9rem;font-size:.85rem;font-weight:bold;white-space:nowrap;text-decoration:none}
.topbar .home-btn:hover{background:var(--pink)}
.cart-link strong{background:#fff;color:var(--wine);border-radius:999px;min-width:1.5rem;display:inline-block;text-align:center;padding:.05rem .3rem}
.catnav{display:flex;background:#fff;border-bottom:1px solid var(--line);position:sticky;top:52px;z-index:19}
.catnav a{flex:1;text-align:center;padding:.7rem .2rem;text-decoration:none;color:var(--ink);font-weight:bold;font-size:.9rem;border-bottom:3px solid transparent}
.catnav a.active{color:var(--wine);border-bottom-color:var(--wine)}
#app{max-width:1060px;margin:0 auto;padding:1rem 1rem 3rem}
.hero{background:var(--wine);color:#fff;border-radius:12px;padding:1.6rem 1.3rem;margin-bottom:1.2rem}
.hero h1{margin:0 0 .4rem;font-size:1.5rem}
.hero p{margin:.3rem 0;opacity:.95}
.btn{display:inline-block;background:var(--wine);color:#fff;border:none;border-radius:8px;padding:.8rem 1.3rem;font-size:1rem;font-weight:bold;cursor:pointer;text-decoration:none;text-align:center}
.btn:hover{background:var(--wine-dark)}
.btn.block{width:100%;margin-top:.6rem}
.btn.ghost{background:#fff;color:var(--wine);border:2px solid var(--wine)}
.btn:disabled{opacity:.5;cursor:default}
.grid{display:grid;gap:1rem;grid-template-columns:1fr}
@media(min-width:720px){.grid{grid-template-columns:1fr 1fr 1fr}.grid.two{grid-template-columns:1fr 1fr}}
.card{background:var(--card);border:1px solid var(--line);border-radius:12px;overflow:hidden;display:flex;flex-direction:column}
.card .pad{padding:1rem}
.card h3{margin:.2rem 0 .4rem;font-size:1.05rem}
.card p{margin:.3rem 0;color:var(--muted);font-size:.92rem}
.card .price{font-weight:bold;color:var(--wine);font-size:1.05rem;margin:.4rem 0}
.card img{aspect-ratio:4/3;object-fit:cover;width:100%}
.photofallback{aspect-ratio:4/3;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--pink),#e8d5d8);color:var(--wine);font-weight:bold;text-align:center;padding:1rem}
.card .row{display:flex;gap:.6rem;align-items:center;margin-top:.6rem;flex-wrap:wrap}
.card .row label{font-size:.85rem;color:var(--muted)}
input[type=text],input[type=email],input[type=tel],input[type=date],input[type=time],input[type=number],select,textarea{width:100%;padding:.7rem;border:1px solid #cfc4c4;border-radius:8px;font-size:1rem;font-family:inherit;background:#fff}
input[type=number].sm,input[type=date].sm{width:auto}
textarea{min-height:90px}
.field{margin-bottom:.9rem}
.field label{display:block;font-weight:bold;margin-bottom:.3rem;font-size:.95rem}
.field .hint{font-size:.85rem;color:var(--muted);font-weight:normal}
.notice{background:#fff8e6;border:1px solid #ecd9a0;border-radius:8px;padding:.8rem 1rem;font-size:.92rem;margin:1rem 0}
.line{display:flex;justify-content:space-between;gap:1rem;padding:.55rem 0;border-bottom:1px solid var(--line);font-size:.95rem}
.line.total{font-weight:bold;font-size:1.1rem;border-bottom:none}
.line .rm{background:none;border:none;color:var(--wine);cursor:pointer;font-size:.85rem;text-decoration:underline;padding:0}
.summary{background:#fff;border:1px solid var(--line);border-radius:12px;padding:1rem;margin-top:1rem}
.terms{background:#fff;border:1px solid var(--line);border-radius:12px;padding:1rem;margin:1rem 0;font-size:.92rem}
.returns-box{border:2px solid var(--wine);border-radius:12px;padding:.9rem 1rem;margin:1rem 0;background:#fdf6f6}
.returns-box>strong{display:block;margin-bottom:.35rem;color:var(--wine)}
.returns-box .line{border-bottom:1px solid #ecdcdc}
.returns-box .tiny{margin:.5rem 0 0;color:#7a4a4a}
.terms li{margin-bottom:.35rem}
.policybox{background:var(--pink);border-radius:8px;padding:.8rem 1rem;font-size:.88rem;margin:.6rem 0;max-height:18rem;overflow-y:auto;white-space:pre-line}
.checkline{display:flex;gap:.6rem;align-items:flex-start;margin:.8rem 0;font-size:.95rem}
.checkline input{width:1.2rem;height:1.2rem;margin-top:.15rem;flex:none}
.modal-ov{position:fixed;inset:0;background:rgba(20,5,5,.55);z-index:100;display:flex;align-items:center;justify-content:center;padding:1rem}
.modal-box{background:#fff;border-radius:12px;max-width:34rem;width:100%;max-height:82vh;display:flex;flex-direction:column;box-shadow:0 12px 40px rgba(0,0,0,.25)}
.modal-head{display:flex;justify-content:space-between;align-items:center;padding:.9rem 1.1rem;border-bottom:1px solid var(--line)}
.modal-head strong{color:var(--wine);font-size:1.05rem}
.modal-x{background:none;border:none;font-size:1.6rem;line-height:1;cursor:pointer;color:var(--muted);padding:.2rem .5rem}
.modal-x:hover{color:var(--wine)}
.modal-body{padding:1.1rem;overflow-y:auto;font-size:.92rem}
.modal-body p{margin:0 0 .8rem}
.radio-row{display:flex;gap:1rem;flex-wrap:wrap;margin:.4rem 0}
.radio-row label{display:flex;gap:.4rem;align-items:center;font-weight:normal}
.cal{margin:1rem 0}
.cal-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:.5rem}
.cal-head button{background:#fff;border:1px solid var(--line);border-radius:6px;padding:.4rem .8rem;cursor:pointer}
.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:4px}
.cal-grid .dow{font-size:.72rem;color:var(--muted);text-align:center;font-weight:bold}
.cal-grid .day{aspect-ratio:1;display:flex;align-items:center;justify-content:center;border-radius:6px;background:#fff;border:1px solid var(--line);font-size:.85rem}
.cal-grid .day.booked{background:#f3d9d9;color:#a33;border-color:#e0b3b3;text-decoration:line-through}
.cal-grid .day.past{opacity:.35}
.cal-grid .day.blank{background:none;border:none}
.legend{display:flex;gap:1rem;font-size:.82rem;color:var(--muted);margin-top:.5rem}
.legend i{width:.9rem;height:.9rem;display:inline-block;border-radius:3px;vertical-align:-1px}
.detail-photo{border-radius:12px;overflow:hidden;margin-bottom:1rem}
.steps{display:grid;gap:.8rem;margin:1.2rem 0}
@media(min-width:720px){.steps{grid-template-columns:1fr 1fr 1fr}}
.step{background:#fff;border:1px solid var(--line);border-radius:12px;padding:1rem}
.step b{color:var(--wine)}
.status{border-radius:12px;padding:1.4rem;text-align:center;margin:1rem 0}
.status.ok{background:#e9f5ec;border:1px solid #bfe0c7}
.status.wait{background:#fff8e6;border:1px solid #ecd9a0}
.status h2{margin-top:0}
.tiny{font-size:.8rem;color:var(--muted)}
.err{background:#fdecec;border:1px solid #f3b8b8;color:#8c1d1d;border-radius:8px;padding:.8rem 1rem;margin:1rem 0}
table.admin{width:100%;border-collapse:collapse;font-size:.85rem;background:#fff}
table.admin th,table.admin td{border:1px solid var(--line);padding:.5rem;text-align:left;vertical-align:top}
table.admin th{background:var(--pink)}
.pill{display:inline-block;padding:.15rem .6rem;border-radius:999px;font-size:.78rem;font-weight:bold}
.pill.paid{background:#e9f5ec;color:var(--ok)}
.pill.pending{background:#fff8e6;color:#8a6d1a}
.pill.cancelled{background:#f3d9d9;color:#8c1d1d}
.pill.expired{background:#fdeeda;color:#9a5b00}
.toolbar{display:flex;gap:.6rem;flex-wrap:wrap;margin:1rem 0}
pre.debug{background:#222;color:#cfc;font-size:.75rem;padding:1rem;border-radius:8px;overflow:auto}

/* Back link under the category nav (cart, checkout). */
.back-link{display:inline-block;margin:.15rem 0 .35rem;color:var(--wine);font-weight:bold;font-size:.92rem;text-decoration:none}
.back-link:hover{text-decoration:underline}

/* Product-name links on the cart and checkout pages (tap to change dates on the product page). */
.item-link{color:var(--wine);text-decoration:underline;text-underline-offset:2px}
.item-link:hover{color:#4a0c0c}
.back-after-update{margin-top:.35rem}

/* Keep the header on one tidy row on small phones: no wrapped brand text or
   badges colliding with the cart count. */
.brand{white-space:nowrap;min-width:0;overflow:hidden;text-overflow:ellipsis}
.cart-link{white-space:nowrap}
@media (max-width:600px){
  .topbar{padding:.55rem .7rem;gap:.5rem}
  .brand{font-size:.78rem;letter-spacing:1px;gap:.4rem}
  .brand-logo{height:32px}
  .brand span{display:none}
  .topbar .home-btn{font-size:.72rem;padding:.4rem .55rem}
  .cart-link{font-size:.8rem}
}

/* Checkout progress: Cart -> Details -> Done. */
.steps-bar{list-style:none;display:flex;align-items:center;gap:.45rem;padding:0;margin:0 0 1rem;font-size:.85rem;color:var(--muted);flex-wrap:wrap}
.steps-bar li{display:flex;align-items:center;gap:.35rem}
.steps-bar .dot{display:inline-flex;align-items:center;justify-content:center;width:1.5rem;height:1.5rem;border-radius:50%;border:1px solid var(--line);font-size:.75rem;background:#fff;flex:none}
.steps-bar li.active{color:var(--wine);font-weight:bold}
.steps-bar li.active .dot{background:var(--wine);color:#fff;border-color:var(--wine)}
.steps-bar li.done{color:var(--ok)}
.steps-bar li.done .dot{background:#e9f5ec;border-color:#bfe0c7;color:var(--ok)}
.steps-bar .sep{color:#c9b8b8}

/* Sticky mobile checkout bar: order total + primary action, phones only. */
.sticky-bar{display:none}
@media (max-width:760px){
  .sticky-bar{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:60;align-items:center;justify-content:space-between;gap:.75rem;padding:.65rem .9rem;background:#fff;border-top:1px solid var(--line);box-shadow:0 -2px 14px rgba(0,0,0,.10)}
  .sticky-total{display:flex;flex-direction:column;line-height:1.35}
  .sticky-total strong{font-size:1.15rem;color:var(--wine)}
  .sticky-bar .btn{padding:.7rem 1.1rem;white-space:nowrap}
  #app{padding-bottom:5.5rem}
}

/* Admin alert panels. */
.alerts{display:grid;gap:.7rem;margin:1rem 0}
@media(min-width:720px){.alerts{grid-template-columns:1fr 1fr}}
.alert-panel{background:#fffdf6;border:1px solid #ecd9a0;border-left:5px solid #c98a1b;border-radius:8px;padding:.7rem .9rem;font-size:.88rem}
.alert-panel.urgent{border-color:#f3b8b8;border-left-color:#a11}
.alert-panel strong{display:block;margin-bottom:.3rem;color:var(--ink)}
.alert-panel ul{margin:.2rem 0;padding-left:1.1rem}
.alert-panel li{margin:.25rem 0}
.alert-panel .tiny{color:var(--muted)}