/* ============================================
   SIPO dynamic component styles
   Matched to the K Kitchen and Bar palette
   (black / charcoal / warm gold / soft white)
   ============================================ */

/* ---------- Status strip ---------- */
.status-strip{
  background:#111214;
  color:#fff;
  font-size:13px;
  font-weight:700;
  letter-spacing:.04em;
  padding:10px 0;
  position:relative;
  z-index:1000;
  border-bottom:1px solid rgba(255,255,255,.08);
}
.status-strip-inner{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  flex-wrap:wrap;
  text-align:center;
}
.status-strip-dot{
  width:9px;
  height:9px;
  border-radius:50%;
  background:#9aa0a6;
  flex:0 0 auto;
  position:relative;
}
.status-strip.open .status-strip-dot{background:#22c55e}
/* Ring animates transform + opacity only, so the compositor handles it
   off the main thread (no layout or paint work per frame). */
.status-strip.open .status-strip-dot::after{
  content:"";
  position:absolute;
  inset:0;
  border-radius:50%;
  background:rgba(34,197,94,.55);
  animation:sipo-pulse 2s infinite;
  will-change:transform, opacity;
}
.status-strip.closed .status-strip-dot{background:#ef4444}
.status-strip.error .status-strip-dot{background:var(--gold, #f7b313)}
.status-strip.open{background:#0f1b13}
.status-strip.closed{background:#1c1112}
.status-strip .countdown-timer{
  color:var(--gold, #f7b313);
  margin-left:4px;
}
.status-strip-link{
  color:var(--gold, #f7b313);
  text-transform:uppercase;
  font-size:11px;
  letter-spacing:.12em;
  border-bottom:1px solid rgba(247,179,19,.45);
  padding-bottom:1px;
}
.status-strip-link:hover{color:#fff;border-color:#fff}

@keyframes sipo-pulse{
  0%{transform:scale(1);opacity:.55}
  70%{transform:scale(2.6);opacity:0}
  100%{transform:scale(2.6);opacity:0}
}
@media (prefers-reduced-motion: reduce){
  .status-strip.open .status-strip-dot::after{animation:none}
}

/* ---------- Inline offer banner (never a popup) ---------- */
.offer-banner{
  background:var(--gold, #f7b313);
  color:#111;
  padding:12px 0;
}
.offer-banner-inner{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:16px;
  flex-wrap:wrap;
}
.offer-banner-img{height:38px;width:auto;border-radius:6px}
.offer-banner-text{
  margin:0;
  font-weight:700;
  font-size:15px;
}
.offer-banner-cta{
  font-size:11px;
  font-weight:900;
  letter-spacing:.12em;
  text-transform:uppercase;
  background:#111;
  color:#fff;
  padding:9px 18px;
  border-radius:40px;
}
.offer-banner-cta:hover{background:#fff;color:#111}

/* ---------- Live hours table (contact / booking) ---------- */
.hours-card{
  background:#f8f6f0;
  border:1px solid var(--line, #e9e5dd);
  border-radius:24px;
  padding:34px;
}
.hours-table{margin-top:6px}
.hours-row{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:18px;
  padding:12px 0;
  border-bottom:1px dashed var(--line, #e9e5dd);
  font-size:15px;
}
.hours-row:last-child{border-bottom:0}
.hours-row .day{font-weight:700;color:#242424}
.hours-row .day em{
  font-style:normal;
  font-size:10px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:#111;
  background:var(--gold, #f7b313);
  border-radius:20px;
  padding:2px 8px;
  margin-left:8px;
  vertical-align:middle;
}
.hours-row .time{color:#5f5f5f;text-align:right}
.hours-row.today{background:rgba(247,179,19,.09);border-radius:10px;padding-inline:12px}
.hours-row .closed-day{color:#c0392b;font-weight:700}

/* Footer hours list — today highlight */
.hours li.today strong{color:var(--gold, #f7b313)}
.hours li.closed-day{color:#ffb4ac}

/* ---------- Menu page (live from get_menu) ---------- */
.menu-live{padding:110px 0;background:#fff}
.menu-tabs{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  justify-content:center;
  margin:0 auto 52px;
  max-width:960px;
}
.menu-tab{
  font-family:inherit;
  font-size:11px;
  font-weight:900;
  letter-spacing:.12em;
  text-transform:uppercase;
  padding:12px 22px;
  border-radius:40px;
  border:1px solid var(--line, #e9e5dd);
  background:#fff;
  color:#4a4a4a;
  cursor:pointer;
  transition:.25s ease;
}
.menu-tab:hover{border-color:var(--gold, #f7b313);color:#111}
.menu-tab.active{
  background:#111;
  border-color:#111;
  color:#fff;
}
.menu-group{margin-bottom:52px}
.menu-group:last-child{margin-bottom:0}
.menu-group-title{
  font-size:15px;
  font-weight:900;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--gold-dark, #c98d00);
  margin-bottom:26px;
  padding-bottom:12px;
  border-bottom:1px solid var(--line, #e9e5dd);
}
.menu-list{
  display:grid;
  grid-template-columns:repeat(2, minmax(0,1fr));
  gap:34px 52px;
}
.menu-item-head{
  display:flex;
  align-items:baseline;
  gap:10px;
}
.menu-item-head h4{
  font-size:19px;
  font-weight:700;
  letter-spacing:-.01em;
  color:#141414;
}
.menu-item-dots{
  flex:1;
  border-bottom:1px dotted #cfc9ba;
  transform:translateY(-4px);
}
.menu-item-price{
  font-weight:900;
  color:var(--gold-dark, #c98d00);
  white-space:nowrap;
}
.menu-item-desc{
  margin-top:7px;
  font-size:14.5px;
  color:#6b6b6b;
  line-height:1.65;
}
.menu-item-variants{
  margin-top:6px;
  font-size:11px;
  font-weight:800;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:#9a9384;
}
.menu-loading{
  text-align:center;
  color:#8a8a8a;
  padding:40px 0;
}
.menu-empty{
  text-align:center;
  background:#f8f6f0;
  border:1px solid var(--line, #e9e5dd);
  border-radius:24px;
  padding:46px;
}
.menu-empty p{margin-bottom:22px;color:#5f5f5f}

/* ---------- Homepage favourites ---------- */
.dish-grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0,1fr));
  gap:26px;
}
.dish-card{
  background:#fff;
  border:1px solid var(--line, #e9e5dd);
  border-radius:22px;
  padding:30px;
  display:flex;
  flex-direction:column;
  gap:10px;
  transition:.3s ease;
}
.dish-card:hover{
  transform:translateY(-6px);
  box-shadow:0 22px 50px rgba(0,0,0,.09);
  border-color:rgba(247,179,19,.5);
}
.dish-card-top{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:14px;
}
.dish-card-top h3{font-size:21px;line-height:1.25}
.dish-price{
  font-weight:900;
  color:var(--gold-dark, #c98d00);
  white-space:nowrap;
}
.dish-card p{
  color:#6b6b6b;
  font-size:14.5px;
  line-height:1.7;
  flex:1;
}
.dish-cat{
  font-size:10px;
  font-weight:900;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:#a49c8b;
}

/* ---------- Ordering disabled ---------- */
body.ordering-disabled [data-order-url]{
  opacity:.5;
  pointer-events:none;
  filter:grayscale(.5);
}

/* ---------- Responsive ---------- */
@media (max-width: 900px){
  .menu-list{grid-template-columns:1fr;gap:26px}
  .dish-grid{grid-template-columns:repeat(2, minmax(0,1fr))}
}
@media (max-width: 640px){
  .dish-grid{grid-template-columns:1fr}
  .status-strip{font-size:12px;padding:9px 0}
  .status-strip-inner{gap:8px}
  .hours-card{padding:26px}
  .menu-live{padding:70px 0}
}