/* --------------------------------------------------------------- *
 * Booking Page — Font Scoping
 * --------------------------------------------------------------- */
.booking-page-root,
.booking-page-root *{
  font-family: var(--booking-page-font, system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif) !important;
}
.use-system-font,
.use-system-font *,
.booking-page-root .modal,
.booking-page-root .modal *,
.booking-page-root .orbit-footer,
.booking-page-root .orbit-footer *,
.booking-page-root .gc-card,
.booking-page-root .gc-card *{
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
}

/* --------------------------------------------------------------- *
 * Captions (categories + minis)
 * --------------------------------------------------------------- */
.booking-page-session-category .name-box,
.booking-page-session-category .session-category-name,
.booking-page-session-category .mini-session-name{
  color:#1f2937 !important;
  font-weight:600 !important;
  letter-spacing:.01em;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  background:#fff !important;
}

/* --------------------------------------------------------------- *
 * Card container
 * --------------------------------------------------------------- */
.booking-page-session-category{
  position:relative;
  width:100%;
  border:1px solid #e5e7eb;
  background:#fff;
  display:flex;
  flex-direction:column;
  align-items:stretch;
  text-align:center;
  overflow:hidden;
  transition:box-shadow .18s ease, transform .18s ease, border-color .18s ease;
  margin-bottom:1.5rem;
  border-radius:10px;
}
.booking-page-session-category:hover{
  border-color:#d1d5db;
  box-shadow:0 6px 18px rgba(17,24,39,.08);
  transform:translateY(-1px);
}

/* Media (image/placeholder) */
.booking-page-session-category img{
  width:100%;
  height:300px;
  object-fit:cover;
  transition:transform .25s ease, opacity .25s ease;
  border-radius:10px 10px 0 0;
}
.booking-page-session-category:hover img{ transform:scale(1.01); opacity:.98; }
.booking-page-session-category .placeholder{
  width:100%;
  height:300px;
  background:#fafafa;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-end;
  padding:0;
  cursor:default !important;
  border-radius:10px 10px 0 0;
}

/* Title bar */
.booking-page-session-category .name-box{
  width:100%;
  min-height:50px;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding:.5rem .75rem;
  font-size:clamp(1rem, 2.2vw, 1.25rem);
}
/* Only draw divider when title follows media */
.booking-page-session-category img + .name-box,
.booking-page-session-category .placeholder + .name-box{
  border-top:1px solid #eef2f7;
}

/* Smaller/wrapped titles */
.booking-page-session-category .name-box,
.booking-page-session-category .placeholder .name-box,
.booking-page-session-category .session-category-name,
.booking-page-session-category .mini-session-name{
  line-height:1.25 !important;
  display:-webkit-box !important;
  -webkit-box-orient:vertical !important;
  -webkit-line-clamp:2 !important;
  overflow:hidden !important;
  word-break:break-word !important;
  overflow-wrap:anywhere !important;
  hyphens:auto !important;
}
.booking-page-session-category .mini-session-name{
  font-size:clamp(.98rem, 1.6vw, 1.15rem) !important;
  padding:.55rem .7rem !important;
}

/* Clickable media+title; meta lives outside the link */
.booking-page-session-category a{
  text-decoration:none;
  display:block;
}

/* --------------------------------------------------------------- *
 * Mini card meta (spots + dates)
 * --------------------------------------------------------------- */
.mini-card-meta{
  display:grid;
  gap:.45rem;
  padding:.7rem .85rem .9rem;
  margin-top:.25rem;
  border-top:1px solid #eef2f7;
  background:#fff;
  text-align:center;
}

/* Neutral badges */
.mini-badge{
  display:inline-block;
  font-size:.8rem;
  line-height:1;
  padding:.45rem .65rem;
  border-radius:.65rem;
  font-weight:600;
  letter-spacing:.02em;
  white-space:nowrap;
}
.mini-badge--ok{
  color:#1e3a8a;
  background:#eef2ff;
  border:1px solid #e0e7ff;
}
.mini-badge--none{
  color:#475569;
  background:#f1f5f9;
  border:1px solid #e2e8f0;
}
.mini-dates{
  font-size:.85rem;
  color:#64748b;
  line-height:1.2;
}
.mini-dates .mini-more{ color:#475569; font-weight:600; }

/* --------------------------------------------------------------- *
 * Gift Certificates
 * --------------------------------------------------------------- */
.gc-card-link{ text-decoration:none; display:block; }
.gc-card{
  position:relative;
  border-radius:12px;
  overflow:hidden;
  height:160px;
  color:#111827;
  background:linear-gradient(180deg, rgba(0,0,0,.015), rgba(0,0,0,0)), #f8f6f1;
  border:1px solid #e6e1d5;
  box-shadow:0 8px 18px rgba(17,24,39,.08);
  padding:16px 16px 14px 16px;
}
.gc-card::before{
  content:"";
  position:absolute; inset:10px;
  border-radius:10px;
  border:1px dashed #d8d2c4;
  pointer-events:none;
}
.gc-card::after{
  content:"";
  position:absolute; inset:0;
  border-radius:12px;
  background:repeating-linear-gradient(45deg, rgba(0,0,0,.012) 0 10px, rgba(0,0,0,0) 10px 20px);
  opacity:.35; mix-blend-mode:multiply; pointer-events:none;
}
.gc-card svg.gc-art{ display:none !important; }
.gc-meta{ display:flex; align-items:center; gap:.6rem; font-size:.9rem; opacity:.95; }
.gc-meta span:first-child{ text-transform:uppercase; letter-spacing:.08em; font-weight:700; color:#374151; }
.gc-meta .dot{ width:4px; height:4px; border-radius:50%; background:rgba(17,24,39,.35); }
.gc-amount{ margin-top:.25rem; font-size:clamp(1.35rem, 2.8vw, 1.8rem); font-weight:800; letter-spacing:.2px; color:#111827; }
.gc-brand{
  position:absolute; right:14px; bottom:10px;
  display:inline-flex; align-items:center; gap:.45rem;
  font-weight:600; font-size:.9rem; color:#374151; max-width:70%;
}
.gc-brand img{ height:18px; width:18px; object-fit:cover; border-radius:3px; box-shadow:0 0 0 1px rgba(0,0,0,.05); }
.gc-card:hover{ transform:translateY(-1px); box-shadow:0 10px 22px rgba(17,24,39,.10); transition:.18s ease; }

/* --------------------------------------------------------------- *
 * Pay chooser
 * --------------------------------------------------------------- */
.pay-chooser{ margin-top:1rem; }
.pay-chooser .pay-title{
  text-transform:uppercase; font-weight:700; letter-spacing:.08em; color:#6c757d;
  font-size:.9rem; margin-bottom:.5rem; text-align:center;
}
.pay-chooser .pay-row{ display:flex; justify-content:center; align-items:center; gap:.75rem; flex-wrap:wrap; }
.pay-chooser .btn-pay{
  display:inline-flex; align-items:center; justify-content:center; gap:.5rem;
  padding:.6rem .9rem; border-radius:.8rem; background:#fff;
  border:1px solid rgba(0,0,0,.12); box-shadow:0 .2rem .6rem rgba(0,0,0,.05);
  transition:transform .06s ease, box-shadow .12s ease;
}
.pay-chooser .btn-pay:hover{ transform:translateY(-1px); box-shadow:0 .3rem .8rem rgba(0,0,0,.08); }
.pay-chooser .btn-pay:active{ transform:translateY(0); }
.pay-chooser .btn-pay img{ height:22px; width:auto; display:block; }

/* --------------------------------------------------------------- *
 * Keep spacing + center rows
 * --------------------------------------------------------------- */
.booking-page-root .row.g-4{           /* ensure gutters even if custom CSS elsewhere */
  --bs-gutter-x: 1.5rem;
  --bs-gutter-y: 1.5rem;
}

/* --------------------------------------------------------------- *
 * No bookable sessions
 * --------------------------------------------------------------- */
.booking-page-empty-state{
  max-width:680px;
  margin:1.5rem auto 2.5rem;
  padding:clamp(1.75rem, 5vw, 3rem);
  color:#1f2937;
  text-align:center;
  background:rgba(255,255,255,.88);
  border:1px solid rgba(148,163,184,.28);
  border-radius:18px;
  box-shadow:0 14px 40px rgba(17,24,39,.08);
  backdrop-filter:blur(4px);
}
.booking-page-empty-state__title{
  margin:0 0 .75rem;
  font-size:clamp(1.5rem, 4vw, 2rem);
  font-weight:600;
}
.booking-page-empty-state__copy{
  max-width:540px;
  margin:0 auto 1.4rem;
  color:#64748b;
  font-size:1rem;
  line-height:1.65;
}

/* --------------------------------------------------------------- *
 * Misc / Responsive
 * --------------------------------------------------------------- */
.public-view-header-logo__img{ max-height:125px; width:auto !important; height:auto; object-fit:contain; display:inline-block; }
@media (max-width:480px){ .public-view-header-logo__img{ max-height:70px; } }

/* Keep spacing across breakpoints */
@media (max-width:575.98px){ .booking-page-session-category{ max-width:100%; } }
/* REMOVED min-width:400px to stop overflow that collapsed gutters */
/* @media (min-width:576px){ .booking-page-session-category{ min-width:400px; } } */
@media (min-width:768px){ .booking-page-session-category{ margin-bottom:1.5rem; } }
@media (min-width:992px){
  .booking-page-session-category{ margin-bottom:2rem; }
  /* removed: .col-lg-3 { margin-left:150px; } */
}

/* --------------------------------------------------------------- *
 * Modal media fallback (SAFE on mobile)
 * --------------------------------------------------------------- */
@media (max-width:767px){
  .modal-body img{ max-width:100%; height:auto; }
  .modal-body .carousel-item img{ max-width:100% !important; height:auto !important; object-fit:contain !important; }
  .modal-body .pay-chooser img{ width:auto !important; height:14px !important; max-height:14px !important; }
}

/* --------------------------------------------------------------- *
 * Neutralize badges tone (unchanged)
 * --------------------------------------------------------------- */
.booking-page-root .mini-badge--ok,
.booking-page-root .mini-badge--none{
  color:#475569 !important;
  background:#f1f5f9 !important;
  border:1px solid #e2e8f0 !important;
}
.booking-page-root .mini-badge--ok b,
.booking-page-root .mini-badge--none b{
  font-weight:700;
}

/* Mobile-only: slightly larger pay buttons/logos */
@media (max-width: 575.98px) {
  .booking-page-root .pay-chooser .pay-row { gap: .4rem !important; }
  .booking-page-root .pay-chooser .btn-pay {
    padding: .3rem .6rem !important;
    border-radius: .55rem !important;
    font-size: .8rem !important;
    line-height: 1 !important;
  }
  .booking-page-root .pay-chooser .btn-pay img,
  .modal-body .pay-chooser img {
    height: 30px !important;
    max-height: 30px !important;
    width: auto !important;
  }
}

/* Keep Bootstrap gutters and center rows */
.booking-page-root .row.g-4{
  --bs-gutter-x: 1.5rem;
  --bs-gutter-y: 1.5rem;
}

/* Fixed card column width from sm+ so cards look like before */
@media (min-width: 576px){
  .booking-card-col{
    flex: 0 0 auto;     /* don't stretch to the full row width */
    width: 400px;       /* match your original visual width */
    max-width: 100%;    /* safety */
  }
}

/* app/assets/stylesheets/booking-page.css (or equivalent) */
.gc-description p {
  margin-bottom: 0.25rem;
}
.gc-description a {
  text-decoration: underline;
}

.orbit-booking-inquiry-button,
.orbit-inquiry-submit {
  appearance: none;
  border: 0;
  border-radius: var(--inquiry-radius, 12px);
  background: var(--inquiry-button-bg, #343436);
  color: var(--inquiry-button-color, #fff);
  padding: .75rem 1.25rem;
  font-weight: 650;
  box-shadow: 0 8px 24px rgba(17, 24, 39, .13);
  transition: transform .18s ease, box-shadow .18s ease;
}
.orbit-booking-inquiry-button:hover,
.orbit-inquiry-submit:hover { transform: translateY(-1px); box-shadow: 0 11px 28px rgba(17,24,39,.18); }
.orbit-inquiry-surface,
.orbit-inquiry-surface * { font-family: var(--inquiry-font) !important; }
.orbit-inquiry-surface { background: var(--inquiry-bg); color: var(--inquiry-text); border-radius: var(--inquiry-radius); overflow: hidden; }
.orbit-inquiry-surface .modal-header,
.orbit-inquiry-surface .modal-body,
.orbit-inquiry-surface .modal-footer { background: var(--inquiry-bg); color: var(--inquiry-text); }
.orbit-inquiry-surface .form-control { background: var(--inquiry-input-bg); border-color: var(--inquiry-input-border); border-radius: calc(var(--inquiry-radius) * .65); }
.orbit-inquiry-surface .form-control:focus { border-color: var(--inquiry-accent); box-shadow: 0 0 0 .2rem color-mix(in srgb, var(--inquiry-accent) 22%, transparent); }
.orbit-inquiry-honeypot { position: absolute !important; left: -10000px !important; width: 1px !important; height: 1px !important; opacity: 0 !important; }
