/* Booking page: olive theme matching the rest of the site (#a4b204 / #b8cd09 / #d6ed12 on dark olive) */
.booking-form .form-control { background:rgba(35,31,4,.55); border:1px solid #a4b204; color:#fff; box-shadow:none; }
.booking-form .form-control:focus { border-color:#d6ed12; box-shadow:0 0 0 2px rgba(214,237,18,.25); background:rgba(35,31,4,.7); }
.booking-form .form-control::placeholder { color:rgba(255,255,255,.4); }
.booking-form input:-webkit-autofill { -webkit-text-fill-color:#fff; -webkit-box-shadow:0 0 0 100px #3a3507 inset; }
.booking-form .btn-success, #confirmModal .btn-success { background:#a4b204; border-color:#8a9603; color:#1e1a04; font-weight:bold; }
.booking-form .btn-success:hover, #confirmModal .btn-success:hover,
.booking-form .btn-success:focus, #confirmModal .btn-success:focus { background:#d6ed12; border-color:#b8cd09; color:#1e1a04; }
.booking-form .btn-success[disabled], #confirmModal .btn-success[disabled] { background:#a4b204; opacity:.5; }
.booking-alert.alert-danger { background:rgba(120,20,10,.55); border-color:#c0392b; color:#ffd9d4; }
.booking-alert.alert-success { background:rgba(60,80,5,.6); border-color:#a4b204; color:#e8f5a0; }

.slot-picker { background:rgba(35,31,4,.55); border:1px solid #a4b204; color:#fff; border-radius:8px; padding:12px 16px 16px; max-width:520px; }
.slot-picker .sp-head { display:flex; align-items:center; justify-content:space-between; font-weight:bold; color:#e8da02; margin-bottom:6px; }
.slot-picker .sp-nav { background:none; border:0; font-size:22px; line-height:1; padding:2px 10px; color:#d6ed12; cursor:pointer; }
.slot-picker .sp-nav[disabled] { color:rgba(255,255,255,.25); cursor:default; }
.slot-picker .sp-week { display:grid; grid-template-columns:repeat(7,1fr); gap:6px; text-align:center; }
.slot-picker .sp-dow { font-weight:bold; font-size:14px; padding:6px 0; color:#b8cd09; }
.slot-picker .sp-day { background:transparent; border:2px solid transparent; border-radius:6px; padding:10px 0; font-size:16px; font-weight:bold; color:#fff; cursor:pointer; }
.slot-picker .sp-day:hover:not([disabled]) { border-color:rgba(214,237,18,.5); }
.slot-picker .sp-day[disabled] { color:rgba(255,255,255,.28); cursor:default; }
.slot-picker .sp-day.sp-selected { border-color:#d6ed12; background:rgba(214,237,18,.15); }
.slot-picker .sp-slots { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin-top:16px; }
.slot-picker .sp-slot { background:transparent; border:2px solid #a4b204; border-radius:6px; padding:10px 0; font-size:16px; font-weight:bold; color:#fff; cursor:pointer; }
.slot-picker .sp-slot:hover { border-color:#d6ed12; }
.slot-picker .sp-slot.sp-selected { border-color:#d6ed12; background:rgba(214,237,18,.22); color:#fff; }
.slot-picker .sp-empty { grid-column:1 / -1; color:#b8cd09; padding:8px 0; }
.slot-picker .sp-note { color:#b8cd09; margin:14px 0 0; font-size:14px; }
@media (max-width:400px) { .slot-picker .sp-day, .slot-picker .sp-slot { font-size:14px; } }

#confirmModal .modal-content { background:#3a3507; color:#fff; border:1px solid #a4b204; }
#confirmModal .modal-header, #confirmModal .modal-footer { border-color:rgba(164,178,4,.4); }
#confirmModal .modal-title { color:#e8da02; }
#confirmModal dt { color:#b8cd09; }
#confirmModal .btn-default { background:transparent; border-color:#a4b204; color:#d6ed12; }
#confirmModal .btn-default:hover { background:rgba(214,237,18,.15); }
#confirmModal .modal-dialog { background:none; margin:20px auto; }
#confirmModal .modal-body p { color:#d9dca0; }
#confirmModal dd { color:#fff; word-wrap:break-word; margin-bottom:6px; }
#confirmModal dt { margin-top:6px; }
@media (max-width:767px) {
  #confirmModal .modal-dialog { margin:12px; }
  #confirmModal .modal-footer { display:flex; flex-direction:column-reverse; }
  #confirmModal .modal-footer .btn { display:block; width:100%; margin:0 0 8px 0; }
  #confirmModal dl { margin-bottom:0; }
}
#confirmModal .modal-body { background:none; }

/* Card layout: one column, every field the same width */
.booking-card { max-width:640px; margin:10px auto 30px; padding:28px 32px 32px; background:rgba(30,26,4,.55); border:1px solid rgba(164,178,4,.5); border-radius:10px; box-shadow:0 8px 28px rgba(0,0,0,.35); }
.booking-title { margin:0 0 22px; padding-bottom:14px; font-size:28px; color:#e8da02; border-bottom:1px solid rgba(164,178,4,.45); }
.booking-form .form-group { margin-bottom:20px; }
.booking-form label { display:block; margin-bottom:8px; font-size:12px; letter-spacing:1.5px; text-transform:uppercase; color:#b8cd09; }
.booking-form .form-control { height:48px; padding:10px 14px; font-size:16px; border-radius:6px; }
.booking-form .slot-picker { max-width:none; width:100%; background:rgba(0,0,0,.18); border-radius:6px; padding:14px 16px 16px; }
.booking-form .btn-success { display:block; width:100%; height:50px; margin-top:8px; font-size:15px; letter-spacing:1.5px; text-transform:uppercase; border-radius:6px; }
@media (max-width:767px) {
  .booking-card { padding:20px 16px 24px; margin:0 0 24px; border-radius:8px; }
  .booking-title { font-size:24px; }
}
@media (min-width:768px) { .booking-card { margin-top:136px; } }  /* clear the fixed navbar */

/* Confirm popup: label and value on the same baseline */
#confirmModal dl { display:grid; grid-template-columns:max-content 1fr; column-gap:24px; row-gap:12px; align-items:baseline; margin:16px 0 4px; }
#confirmModal dt, #confirmModal dd { float:none; width:auto; margin:0; padding:0; text-align:left; line-height:1.4; font-size:16px; }
#confirmModal dt { font-weight:bold; }
#confirmModal dd { overflow-wrap:anywhere; }
@media (max-width:767px) { #confirmModal dl { column-gap:16px; } }
#confirmModal dl.dl-horizontal dt { grid-column:1; }
#confirmModal dl.dl-horizontal dd { grid-column:2; margin-left:0; }
#confirmModal dl.dl-horizontal dt:nth-of-type(1), #confirmModal dl.dl-horizontal dd:nth-of-type(1) { grid-row:1; }
#confirmModal dl.dl-horizontal dt:nth-of-type(2), #confirmModal dl.dl-horizontal dd:nth-of-type(2) { grid-row:2; }
#confirmModal dl.dl-horizontal dt:nth-of-type(3), #confirmModal dl.dl-horizontal dd:nth-of-type(3) { grid-row:3; }
#confirmModal dl.dl-horizontal dt:nth-of-type(4), #confirmModal dl.dl-horizontal dd:nth-of-type(4) { grid-row:4; }
#confirmModal dl.dl-horizontal dt:nth-of-type(5), #confirmModal dl.dl-horizontal dd:nth-of-type(5) { grid-row:5; }
/* bootstrap's dl-horizontal dt is overflow:hidden, which breaks baseline alignment in the grid */
#confirmModal dl.dl-horizontal dt { overflow:visible; white-space:normal; text-overflow:clip; }
#confirmModal dl.dl-horizontal { align-items:start; }

/* Browser autofill paints a light-blue background; keep the dark field and white text in every state */
.booking-form .form-control:-webkit-autofill,
.booking-form .form-control:-webkit-autofill:hover,
.booking-form .form-control:-webkit-autofill:focus,
.booking-form .form-control:-webkit-autofill:active {
  -webkit-text-fill-color:#fff;
  caret-color:#fff;
  -webkit-box-shadow:0 0 0 100px #2f2a06 inset !important;
  box-shadow:0 0 0 100px #2f2a06 inset !important;
  border-color:#d6ed12;
  transition:background-color 99999s ease-out 0s;
}
.booking-form .form-control:focus { color:#fff; caret-color:#fff; }
.booking-form .form-control:-moz-autofill { background-color:#2f2a06 !important; color:#fff !important; }
