/* ============================================================
   Phase 21r: Public booking page polish
   Safe CSS-only polish for /book
   ============================================================ */

body.p21r-public-book {
  background: #f8fafc !important;
}

body.p21r-public-book .book-shell {
  max-width: 1120px !important;
}

body.p21r-public-book .book-hero {
  background:
    radial-gradient(circle at top left, rgba(13, 110, 253, .16), transparent 38%),
    linear-gradient(180deg, #ffffff 0%, #f8fbff 100%) !important;
  border: 1px solid #dbeafe !important;
  border-radius: 24px !important;
  box-shadow: 0 14px 34px rgba(15, 23, 42, .07) !important;
}

body.p21r-public-book .book-hero h1 {
  color: #0f172a !important;
  font-weight: 950 !important;
  letter-spacing: -.035em !important;
}

body.p21r-public-book .book-hero p {
  color: #475569 !important;
  font-weight: 650 !important;
}

body.p21r-public-book .book-pill {
  background: #eff6ff !important;
  border-color: #bfdbfe !important;
  color: #1d4ed8 !important;
  font-weight: 900 !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.9) !important;
}

body.p21r-public-book .book-step {
  border: 1px solid #e2e8f0 !important;
  border-radius: 18px !important;
  box-shadow: 0 8px 20px rgba(15, 23, 42, .055) !important;
}

body.p21r-public-book .book-step strong {
  color: #0f172a !important;
  font-weight: 950 !important;
}

body.p21r-public-book .book-step-num {
  background: #0f172a !important;
  box-shadow: 0 8px 18px rgba(15, 23, 42, .16) !important;
}

body.p21r-public-book .book-card {
  border: 1px solid #e2e8f0 !important;
  border-radius: 24px !important;
  box-shadow: 0 16px 38px rgba(15, 23, 42, .07) !important;
  overflow: hidden !important;
}

body.p21r-public-book .book-card h2,
body.p21r-public-book .book-card h3,
body.p21r-public-book .book-card h5 {
  color: #0f172a !important;
  font-weight: 950 !important;
  letter-spacing: -.025em !important;
}

body.p21r-public-book .book-card .border.rounded-4,
body.p21r-public-book .racket-row,
body.p21r-public-book #account-address-help-card,
body.p21r-public-book #logged-in-account-summary-card {
  border-color: #e2e8f0 !important;
  border-radius: 18px !important;
  box-shadow: 0 8px 22px rgba(15, 23, 42, .045) !important;
}

body.p21r-public-book .book-card .form-label {
  color: #334155 !important;
  font-weight: 900 !important;
}

body.p21r-public-book .book-card .form-control,
body.p21r-public-book .book-card .form-select {
  border-color: #cbd5e1 !important;
  border-radius: 14px !important;
  box-shadow: none !important;
}

body.p21r-public-book .book-card .form-control:focus,
body.p21r-public-book .book-card .form-select:focus {
  border-color: #0f172a !important;
  box-shadow: 0 0 0 .2rem rgba(15, 23, 42, .10) !important;
}

body.p21r-public-book .form-text,
body.p21r-public-book .text-muted,
body.p21r-public-book .small {
  color: #64748b !important;
}

body.p21r-public-book .racket-row {
  background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%) !important;
}

body.p21r-public-book .price-summary-box {
  min-height: 50px !important;
  justify-content: center !important;
  border-radius: 14px !important;
  background: #eff6ff !important;
  border-color: #bfdbfe !important;
  color: #1e40af !important;
  font-weight: 950 !important;
}

body.p21r-public-book .slot-summary {
  background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%) !important;
  border-color: #e2e8f0 !important;
  border-radius: 16px !important;
}

body.p21r-public-book #estimatedOrderTotal {
  color: #0f172a !important;
  font-weight: 950 !important;
}

body.p21r-public-book .btn {
  border-radius: 13px !important;
  font-weight: 900 !important;
}

body.p21r-public-book .alert {
  border-radius: 16px !important;
  border-width: 1px !important;
}

body.p21r-public-book .mobile-sticky-submit-inner {
  border-color: #dbe3ef !important;
  box-shadow: 0 16px 34px rgba(15, 23, 42, .18) !important;
}

/* Extras cards */
body.p21r-public-book .col-md-6.col-lg-4.mb-2 label.border {
  background: #ffffff !important;
  border-color: #e2e8f0 !important;
  box-shadow: 0 7px 18px rgba(15, 23, 42, .045) !important;
  transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease;
}

body.p21r-public-book .col-md-6.col-lg-4.mb-2 label.border:has(input[type="checkbox"]:checked) {
  border-color: #2563eb !important;
  background: #eff6ff !important;
  box-shadow: 0 10px 24px rgba(37, 99, 235, .12) !important;
}

/* Desktop */
@media (min-width: 768px) {
  body.p21r-public-book .book-card .card-body {
    padding: 1.35rem !important;
  }

  body.p21r-public-book .book-hero {
    padding: 1.25rem !important;
  }

  body.p21r-public-book .racket-row {
    padding: 1rem !important;
  }

  body.p21r-public-book #racketRows {
    display: grid;
    gap: .75rem;
  }
}

/* Mobile */
@media (max-width: 767.98px) {
  body.p21r-public-book .container {
    padding-left: 8px !important;
    padding-right: 8px !important;
    padding-bottom: 92px !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
  }

  body.p21r-public-book .container.py-4 {
    padding-top: .65rem !important;
  }

  body.p21r-public-book .book-hero {
    border-radius: 16px !important;
    padding: .78rem !important;
    margin-bottom: .65rem !important;
  }

  body.p21r-public-book .book-hero h1 {
    font-size: 1.22rem !important;
    line-height: 1.08 !important;
    margin-bottom: .25rem !important;
  }

  body.p21r-public-book .book-hero p {
    font-size: .78rem !important;
    line-height: 1.18 !important;
    margin-bottom: .45rem !important;
  }

  body.p21r-public-book .book-pill {
    font-size: .66rem !important;
    padding: .28rem .48rem !important;
    margin-bottom: .55rem !important;
  }

  body.p21r-public-book .book-steps {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: .34rem !important;
    margin-top: .45rem !important;
  }

  body.p21r-public-book .book-step {
    border-radius: 13px !important;
    padding: .42rem .34rem !important;
    min-height: 82px !important;
  }

  body.p21r-public-book .book-step-num {
    width: 22px !important;
    height: 22px !important;
    font-size: .68rem !important;
    margin-bottom: .24rem !important;
  }

  body.p21r-public-book .book-step strong {
    display: block;
    font-size: .62rem !important;
    line-height: 1.05 !important;
  }

  body.p21r-public-book .book-step .small {
    font-size: .53rem !important;
    line-height: 1.05 !important;
    margin-top: .18rem !important;
  }

  body.p21r-public-book .book-card {
    border-radius: 16px !important;
  }

  body.p21r-public-book .book-card .card-body {
    padding: .7rem !important;
  }

  body.p21r-public-book .book-card h2 {
    font-size: 1.05rem !important;
  }

  body.p21r-public-book .book-card h3,
  body.p21r-public-book .book-card h5 {
    font-size: .96rem !important;
  }

  body.p21r-public-book .alert {
    padding: .62rem .68rem !important;
    font-size: .74rem !important;
    line-height: 1.18 !important;
    border-radius: 14px !important;
    margin-bottom: .58rem !important;
  }

  body.p21r-public-book form.row {
    margin-left: 0 !important;
    margin-right: 0 !important;
    row-gap: .65rem !important;
  }

  body.p21r-public-book .row {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  body.p21r-public-book [class*="col-"] {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  body.p21r-public-book .row.g-3,
  body.p21r-public-book .row.g-2 {
    row-gap: .5rem !important;
  }

  body.p21r-public-book .book-card .border.rounded-4 {
    padding: .68rem !important;
    border-radius: 15px !important;
  }

  body.p21r-public-book .book-card .form-label {
    font-size: .68rem !important;
    margin-bottom: .18rem !important;
  }

  body.p21r-public-book .book-card .form-control,
  body.p21r-public-book .book-card .form-select {
    min-height: 42px !important;
    font-size: 16px !important;
    border-radius: 11px !important;
    padding: .38rem .5rem !important;
  }

  body.p21r-public-book textarea.form-control {
    min-height: 92px !important;
  }

  body.p21r-public-book .form-text {
    font-size: .62rem !important;
    line-height: 1.15 !important;
    margin-top: .18rem !important;
  }

  body.p21r-public-book #customer-details-start p {
    font-size: .72rem !important;
    margin-bottom: .55rem !important;
  }

  body.p21r-public-book #continueToRacketsBtn {
    width: 100% !important;
    min-height: 40px !important;
    font-size: .78rem !important;
  }

  body.p21r-public-book #racket-section > .d-flex {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: .42rem !important;
  }

  body.p21r-public-book #racket-section h3 {
    margin-bottom: 0 !important;
  }

  body.p21r-public-book #racket-section button[onclick="addRacketRow()"] {
    width: 100% !important;
    min-height: 38px !important;
  }

  body.p21r-public-book .racket-row {
    border-radius: 15px !important;
    padding: .62rem !important;
    margin-bottom: .58rem !important;
  }

  body.p21r-public-book .racket-row .row {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: .48rem !important;
  }

  body.p21r-public-book .racket-row .row > div {
    width: 100% !important;
    max-width: 100% !important;
  }

  body.p21r-public-book .racket-row .row > div.col-12,
  body.p21r-public-book .racket-row .row > div.col-md-5:first-of-type,
  body.p21r-public-book .racket-row .row > div:nth-child(4),
  body.p21r-public-book .racket-row .row > div:nth-child(7) {
    grid-column: 1 / -1 !important;
  }

  body.p21r-public-book .price-summary-box {
    min-height: 42px !important;
    font-size: .92rem !important;
  }

  body.p21r-public-book .racket-row .text-end {
    text-align: left !important;
    margin-top: .48rem !important;
  }

  body.p21r-public-book .racket-row .btn-outline-danger {
    width: 100% !important;
    min-height: 36px !important;
  }

  body.p21r-public-book #service_type,
  body.p21r-public-book #return_method {
    min-height: 44px !important;
  }

  body.p21r-public-book .slot-summary {
    padding: .55rem .6rem !important;
    border-radius: 13px !important;
  }

  body.p21r-public-book #handoverSummaryText {
    font-size: .68rem !important;
    line-height: 1.18 !important;
  }

  body.p21r-public-book .col-md-6.col-lg-4.mb-2 {
    margin-bottom: .45rem !important;
  }

  body.p21r-public-book .col-md-6.col-lg-4.mb-2 label.border {
    padding: .58rem !important;
    border-radius: 14px !important;
  }

  body.p21r-public-book .col-md-6.col-lg-4.mb-2 span.fw-semibold {
    font-size: .82rem !important;
    line-height: 1.1 !important;
  }

  body.p21r-public-book .col-md-6.col-lg-4.mb-2 .small {
    font-size: .64rem !important;
    line-height: 1.15 !important;
  }

  body.p21r-public-book .col-md-6.col-lg-4.mb-2 .form-control-sm {
    min-height: 36px !important;
    margin-top: .32rem !important;
  }

  body.p21r-public-book #estimatedOrderTotal {
    font-size: 1.28rem !important;
    margin-top: .35rem !important;
  }

  body.p21r-public-book #mainSubmitBtn {
    min-height: 46px !important;
    font-size: .95rem !important;
  }

  body.p21r-public-book #account-address-help-card .card-body,
  body.p21r-public-book #logged-in-account-summary-card .card-body {
    padding: .7rem !important;
  }

  body.p21r-public-book #account-address-help-card .btn {
    width: 100% !important;
    min-height: 38px !important;
    margin-bottom: .3rem !important;
  }

  body.p21r-public-book .mobile-sticky-submit {
    bottom: .55rem !important;
  }

  body.p21r-public-book .mobile-sticky-submit-inner {
    padding: .5rem !important;
    border-radius: 15px !important;
  }

  body.p21r-public-book #mobileSubmitMirror {
    min-height: 46px !important;
    font-size: .95rem !important;
  }
}
