/* ==========================================================================
   UK Meal Club — block front-end styles
   Framework-free (no Bootstrap) — plain CSS using the same brand tokens
   as the original PHP build, since these blocks sit inside a block theme
   that already carries page-level layout via theme.json.
   ========================================================================== */

:root {
  --ukmc-green: #00CF57;
  --ukmc-green-dark: #00A847;
  --ukmc-dark: #022226;
  --ukmc-bg: #F8FAF9;
  --ukmc-card: #FFFFFF;
  --ukmc-muted: #5B6B69;
  --ukmc-radius-card: 24px;
  --ukmc-radius-btn: 50px;
  --ukmc-shadow: 0 10px 30px -12px rgba(2, 34, 38, 0.18);
}

.ukmc-container { max-width: 1180px; margin: 0 auto; padding: 0 1.25rem; }
.ukmc-section { padding: 3.5rem 0; }
.ukmc-section-alt {
  background: #F1F7F3;
  width: 100vw;
  max-width: 100vw;
  position: relative;
  left: 50%;
  right: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
}
.ukmc-section-alt > .ukmc-container { position: relative; }
.ukmc-eyebrow { text-transform: uppercase; letter-spacing: 0.08em; font-size: 0.8rem; font-weight: 700; color: var(--ukmc-green-dark); margin: 0 0 0.5rem; }
.ukmc-section-title { font-size: clamp(1.5rem, 3vw, 2.2rem); font-weight: 700; color: var(--ukmc-dark); margin: 0 0 0.5rem; }
.ukmc-section-sub { color: var(--ukmc-muted); max-width: 60ch; margin: 0 0 2rem; }
.ukmc-text-muted { color: var(--ukmc-muted); }
.ukmc-text-center { text-align: center; }
.ukmc-mt { margin-top: 1.5rem; }
.ukmc-h4 { font-size: 1.4rem; font-weight: 700; color: var(--ukmc-dark); margin-bottom: 0.25rem; }
.ukmc-h5 { font-size: 1.15rem; font-weight: 700; color: var(--ukmc-dark); }
.ukmc-h6 { font-size: 1rem; font-weight: 700; color: var(--ukmc-dark); margin-bottom: 0.35rem; }
.ukmc-plain-link { text-decoration: none; color: inherit; display: block; }

/* ---- Grid ---- */
.ukmc-grid { display: grid; gap: 1.5rem; }
.ukmc-grid-3 { grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }
.ukmc-grid-4 { grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); }

/* ---- Cards ---- */
.ukmc-info-card, .ukmc-menu-card, .ukmc-review-card {
  background: var(--ukmc-card);
  border-radius: var(--ukmc-radius-card);
  box-shadow: var(--ukmc-shadow);
  padding: 1.25rem 1.5rem;
}
.ukmc-menu-card img { width: 100%; aspect-ratio: 4/3; object-fit: cover; border-radius: 16px; }
.ukmc-menu-card h3 { font-size: 1.05rem; margin: 0.6rem 0 0.25rem; color: var(--ukmc-dark); }
.ukmc-menu-price { font-weight: 700; color: var(--ukmc-green-dark); }
.ukmc-spice-level { color: #B3261E; font-size: 0.85rem; margin: 0 0 0.35rem; }

/* ---- Badges ---- */
.ukmc-badges { margin: 0.5rem 0 0.25rem; }
.ukmc-badge-veg, .ukmc-badge-nonveg, .ukmc-badge-special, .ukmc-badge-popular, .ukmc-badge-today {
  display: inline-block; font-size: 0.68rem; font-weight: 700;
  padding: 0.22rem 0.55rem; border-radius: var(--ukmc-radius-btn); margin-right: 0.3rem;
}
.ukmc-badge-veg { background: #E4F8EA; color: #12793C; }
.ukmc-badge-nonveg { background: #FDEAEA; color: #B3261E; }
.ukmc-badge-special { background: #FFF3D6; color: #9A6B00; }
.ukmc-badge-popular { background: rgba(0,207,87,0.15); color: var(--ukmc-green-dark); }
.ukmc-badge-today { background: var(--ukmc-dark); color: #fff; }

/* ---- Buttons ---- */
.ukmc-btn {
  display: inline-block; border-radius: var(--ukmc-radius-btn); padding: 0.7rem 1.6rem;
  font-weight: 600; text-decoration: none; border: none; cursor: pointer;
  transition: transform 0.15s ease;
}
.ukmc-btn-brand { background: var(--ukmc-green); color: var(--ukmc-dark); }
.ukmc-btn-brand:hover { background: var(--ukmc-green-dark); color: #fff; transform: translateY(-2px); }
.ukmc-btn-outline { background: transparent; color: var(--ukmc-dark); border: 2px solid var(--ukmc-dark); }
.ukmc-btn-outline:hover { background: var(--ukmc-dark); color: #fff; }

/* ---- Gallery ---- */
.ukmc-gallery-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 0.75rem; }
.ukmc-gallery-grid img { width: 100%; aspect-ratio: 1/1; object-fit: cover; border-radius: 16px; }

/* ---- Reviews ---- */
.ukmc-reviews-summary { display: flex; align-items: center; gap: 1rem; margin-bottom: 1.5rem; flex-wrap: wrap; }
.ukmc-testimonial-author { display: flex; align-items: center; gap: 0.6rem; margin-top: 0.75rem; }
.ukmc-testimonial-author img { width: 40px; height: 40px; border-radius: 50%; object-fit: cover; }
.ukmc-overall-rating { font-size: 2.2rem; font-weight: 800; color: var(--ukmc-dark); }
.ukmc-stars { color: #F5A623; letter-spacing: 2px; }

/* ---- FAQs ---- */
.ukmc-faq-item { background: var(--ukmc-card); border-radius: 16px; padding: 1rem 1.25rem; margin-bottom: 0.75rem; box-shadow: var(--ukmc-shadow); }
.ukmc-faq-item summary { font-weight: 600; cursor: pointer; color: var(--ukmc-dark); }
.ukmc-faq-item[open] summary { color: var(--ukmc-green-dark); margin-bottom: 0.5rem; }

/* ---- Hours ---- */
.ukmc-hours-row { display: flex; justify-content: space-between; padding: 0.35rem 0; border-bottom: 1px dashed rgba(2,34,38,0.1); }
.ukmc-hours-row:last-child { border-bottom: none; }

/* ---- Open status ---- */
.ukmc-open-status { margin: 0.5rem 0; }
.ukmc-status-pill { border-radius: var(--ukmc-radius-btn); padding: 0.3rem 0.9rem; font-weight: 700; font-size: 0.8rem; margin-right: 0.5rem; }
.ukmc-status-open { background: #E4F8EA; color: #12793C; }
.ukmc-status-closed { background: #FDEAEA; color: #B3261E; }

/* ---- Map ---- */
.ukmc-map-embed { border-radius: var(--ukmc-radius-card); overflow: hidden; box-shadow: var(--ukmc-shadow); }
.ukmc-map-embed iframe { width: 100%; min-height: 320px; border: 0; display: block; }

/* ---- Contact form / alerts ---- */
.ukmc-alert { border-radius: 12px; padding: 0.75rem 1rem; margin-bottom: 1rem; font-weight: 500; }
.ukmc-alert-success { background: #E4F8EA; color: #12793C; }
.ukmc-alert-warning { background: #FFF3D6; color: #9A6B00; }
.ukmc-alert-danger { background: #FDEAEA; color: #B3261E; }
.ukmc-input { width: 100%; padding: 0.6rem 0.9rem; border-radius: 12px; border: 1px solid rgba(2,34,38,0.15); font-family: inherit; }
.ukmc-input:focus { outline: 3px solid var(--ukmc-green); outline-offset: 1px; }

/* ---- Full menu ---- */
.ukmc-menu-category-block { margin-bottom: 3rem; }

/* ---- Accessibility ---- */
@media (prefers-reduced-motion: reduce) {
  .ukmc-btn { transition: none; }
}