/* ============================================
   Prime Golf — Inline-style migration utilities
   Prefix: .pg-  (consistent with .pg-rd primitives)
   ============================================ */

/* Visibility */
.pg-hidden       { display: none !important; }
/* 2026-06-15: iOS Safari fix — `touch-action: none` on body was blocking taps
   inside open modals (Suivant button did nothing on iPhone). overflow:hidden
   alone is enough to prevent background scroll; tap targets inside the modal
   must remain interactive. */
body.pg-modal-open { overflow: hidden; }
/* Ensure all booking-flow buttons remove the 300ms iOS tap delay and remain
   tappable even when the body is locked. */
.btn-primary, .btn-secondary, #confirmBookingBtn, #nextStepBtn,
button[data-action], .modal button { touch-action: manipulation; }
.visually-hidden { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }

/* Layout helpers */
.pg-text-center      { text-align: center; }
.pg-row-gap          { display: flex; gap: .75rem; flex-wrap: wrap; align-items: center; }
.pg-form-stretch     { flex: 1; display: flex; width: 100%; }
.pg-spaced-center    { margin-top: 16px; text-align: center; }
.pg-mt-1             { margin-top: 1rem; }
.pg-mt-sm            { margin-top: 12px; }
.pg-section-cta      { margin-top: 4rem; text-align: center; }
.pg-section-spaced   { margin-top: 4rem; }
.pg-section-divider-top { margin-top: 1.5rem; padding-top: 1.5rem; border-top: 1px solid #e0e0e0; }

/* Typography */
.pg-heading--accent  { font-size: 2rem; color: var(--c-brand); margin-bottom: 1rem; }
.pg-lead             { font-size: 1.1rem; margin-bottom: 2rem; }
.pg-text-muted-sm    { color: #555; font-size: .95rem; }
.pg-text-muted-xs    { color: #aaa; font-size: .82rem; margin-top: 24px; }
.pg-required-mark    { color: var(--c-brand); }

/* Forms */
.pg-form-label       { font-weight: 600; display: block; margin-bottom: .35rem; color: #333; }
.pg-form-msg         { margin-top: .5rem; font-size: .9rem; }
.pg-input--coupon    { max-width: 180px; }

/* Banners + panels */
.pg-banner-info      { margin-bottom: 1rem; padding: .75rem 1rem; background:#eef6ff; border:1px solid #b8d4f0; border-radius:10px; color:#1a4a6e; font-size:.9rem; }
.pg-info-panel--success { margin-top:.75rem; padding:.85rem 1rem; background:#f0faf2; border-left:3px solid #1a7a3e; border-radius:8px; font-size:.88rem; color:#1a4a2e; line-height:1.6; }

/* Totals */
.pg-total--success         { color: #28a745; }
.pg-total__amount--success { color: #28a745; font-size: 1.3rem; }

/* Promo cards */
.promo-content       { padding: 1.5rem; }
.promo-title         { margin-bottom: 1rem; }
.promo-title__large  { display:block; font-size:1.5rem; color:var(--c-brand); font-weight:bold; }
.promo-title__small  { display:block; font-size:.9rem; color:#666; }
.promo-description   { margin-bottom: 1rem; }

/* Transport radio pills — editorial pass 2026-06-02. Was chunky 50px-radius
   pills with green/red yes/no. Now: rectangular hairline buttons, brand
   red for selected state. */
.pg-radio-pill {
  flex: 1;
  text-align: center;
  padding: 0.55rem 1rem;
  border: 1px solid var(--pg-hairline, rgba(0, 0, 0, 0.12));
  border-radius: 3px;
  cursor: pointer;
  font-weight: 500;
  font-size: 0.92rem;
  background: transparent;
  color: var(--c-ink, #0a0a0a);
  transition: border-color 160ms ease, background 160ms ease, color 160ms ease;
}
.pg-radio-pill:hover {
  border-color: var(--c-ink, #0a0a0a);
}
/* Selected state — brand red (no separate yes/no green/red distinction:
   editorial style stays monochrome until user actively selects). */
.pg-radio-pill.is-active,
.pg-radio-pill.is-yes,
.pg-radio-pill.is-no {
  border-color: var(--c-brand, #E50914);
  background: var(--c-brand, #E50914);
  color: #fff;
}

/* Phone field component */
.phone-field-wrapper      { display:flex; gap:.5rem; align-items:stretch; }
.phone-country-dropdown   { position:relative; width:100px; min-width:100px; }
.phone-country-btn,
.phone-country-trigger    { width:100%; height:100%; min-height:42px; padding:.5rem .6rem; border:2px solid var(--color-border,#ddd); border-radius:8px; background:#fff; cursor:pointer; font-size:1rem; text-align:left; display:flex; align-items:center; gap:6px; }
.phone-country-flag       { display:block; flex-shrink:0; }
.phone-country-arrow      { margin-left:auto; font-size:.7rem; opacity:.7; }
.phone-input              { flex:1; min-width:0; padding:.5rem .75rem; border:2px solid var(--color-border,#ddd); border-radius:8px; font-size:1rem; }

/* Admin */
.pg-admin-empty { text-align:center; color:#888; padding:40px; }

/* Page header (privacy/terms — keep dynamic bg-image inline) */
.page-header--bg { background-size: cover; background-position: center; background-repeat: no-repeat; }

/* Eyebrow — canonical (phase 4/8) */
.pg-eyebrow {
  display: block;
  font-family: var(--font-display);
  font-size: 0.75rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--c-brand);
  font-weight: 600;
  margin-bottom: 1rem;
}
.pg-eyebrow--inverse { color: var(--bg-soft); opacity: 0.85; }

/* Section / CTA */
.pg-section-header   { text-align: center; margin-bottom: 2rem; }
.btn-primary--lg     { display: inline-block; padding: 1rem 2rem; font-size: 1.1rem; }

/* Transport booking modal */
.pg-transport-choice-wrap { margin-bottom: 1.25rem; }
.pg-pickup-row            { margin-top: 0.75rem; }
.transport-hint-before-duration {
  font-size: 0.8rem; color: #888; margin-top: 0.5rem; margin-bottom: 0;
}
.pg-discount-code-muted { opacity: 0.7; font-weight: 500; }

/* Payment failed banner */
.payment-failed-notice {
  background: #fff0f0;
  border: 2px solid var(--c-brand);
  border-radius: 8px;
  padding: 16px 20px;
  margin-bottom: 24px;
  color: var(--c-brand);
  font-weight: 600;
  display: flex;
  align-items: center;
  gap: 10px;
}

/* Transport step page */
.t-value--emphasis { margin-top: 0.25rem; display: block; font-weight: 600; }
.t-value--hint     { display: block; margin-top: 0.35rem; font-size: 0.88rem; color: #555; }
.transport-card-row--spaced { margin-top: 1rem; }
.transport-btn-yes--spaced  { margin-top: 1rem; }

/* ============================================
   Inline-style migrations (2026-06-02 anti-AI sweep)
   Old inline style="..." attributes pulled out of JS templates
   so they survive strict CSP. Keep behaviour identical.
   ============================================ */

/* duration-booking.js: "No slots — try another date" hint */
.time-block-grid__hint {
  color: #C1122C;
  font-size: 0.85rem;
  margin-top: 8px;
  text-align: center;
}

/* packages.js: multi-bay count line under price */
.package-pricing__bay-count {
  display: block;
  font-size: 0.75rem;
  opacity: 0.8;
  margin-top: 0.25rem;
  color: rgba(255, 255, 255, 0.8);
}

/* packages.js: "Limited availability" small line */
.package-pricing__limited {
  display: block;
  color: #ffeb3b;
  font-size: 0.75rem;
  margin-top: 0.25rem;
}
