/*
 * V3CS Booking — Widget Stylesheet
 *
 * Covers: multi-step booking widget, calendar grid, time slot picker,
 *         package cards, customer form, review summary, and success state.
 *
 * Color coding:
 *   Green  (#10B981) → available
 *   Gold   (#C6A15B) → unavailable / featured / selected
 *   Split  (half green / half gold) → partial availability
 *   Gray   (#B0B5BC) → past / lead-time / disabled
 *
 * Follows V3CS design tokens where possible.
 *
 * @package V3CS_Booking
 * @version 5.0.0
 */

/* ==========================================================================
   WIDGET WRAPPER
   ========================================================================== */

#v3cs-booking-widget {
  max-width:      800px;
  margin-inline:  auto;
  font-family:    var(--v3cs-font-body, 'Montserrat', sans-serif);
  color:          var(--v3cs-color-text, #111);
  position:       relative;
}

.v3cs-bw {
  display:        flex;
  flex-direction: column;
  gap:            0;
  border:         1px solid var(--v3cs-color-border, #E4E4E7);
  border-radius:  var(--v3cs-radius-md, 8px);
  overflow:       hidden;
  box-shadow:     0 4px 24px rgba(0,0,0,.07);
  background:     #fff;
}

/* ==========================================================================
   PROGRESS BAR
   ========================================================================== */

.v3cs-bw__progress {
  display:            flex;
  align-items:        center;
  padding:            0 var(--v3cs-space-6, 24px);
  background:         linear-gradient(135deg, #0E0E0E 0%, #1A0A2E 60%, #2D1060 100%);
  overflow-x:         auto;
  scrollbar-width:    none;
}

.v3cs-bw__progress::-webkit-scrollbar { display: none; }

.v3cs-bw__progress-step {
  display:        flex;
  flex-direction: column;
  align-items:    center;
  gap:            4px;
  padding:        14px 20px;
  position:       relative;
  flex-shrink:    0;
  opacity:        .45;
  transition:     opacity .2s;
}

.v3cs-bw__progress-step.is-active  { opacity: 1; }
.v3cs-bw__progress-step.is-done    { opacity: .7; }

.v3cs-bw__progress-step::after {
  content:    '';
  position:   absolute;
  right:      0; top: 50%;
  transform:  translateY(-50%);
  width:      1px; height: 20px;
  background: rgba(255,255,255,.15);
}
.v3cs-bw__progress-step:last-child::after { display: none; }

.v3cs-bw__progress-dot {
  width:          26px; height: 26px;
  border-radius:  50%;
  border:         2px solid rgba(255,255,255,.3);
  display:        flex;
  align-items:    center;
  justify-content:center;
  font-size:      11px;
  font-weight:    700;
  color:          rgba(255,255,255,.6);
  transition:     all .2s;
}

.v3cs-bw__progress-step.is-active .v3cs-bw__progress-dot {
  background:     var(--v3cs-color-purple, #7C3AED);
  border-color:   var(--v3cs-color-purple, #7C3AED);
  color:          #fff;
}

.v3cs-bw__progress-step.is-done .v3cs-bw__progress-dot {
  background:     rgba(124,58,237,.25);
  border-color:   var(--v3cs-color-purple, #7C3AED);
  color:          var(--v3cs-color-purple-light, #A855F7);
}

.v3cs-bw__progress-label {
  font-size:      9px;
  letter-spacing: .1em;
  text-transform: uppercase;
  color:          rgba(255,255,255,.5);
  white-space:    nowrap;
}

.v3cs-bw__progress-step.is-active .v3cs-bw__progress-label {
  color: var(--v3cs-color-purple-light, #A855F7);
}

/* ==========================================================================
   STEP BODY
   ========================================================================== */

.v3cs-bw__body {
  padding: var(--v3cs-space-7, 32px) var(--v3cs-space-7, 32px) var(--v3cs-space-5, 20px);
}

.v3cs-bw__step-header {
  margin-bottom: var(--v3cs-space-6, 24px);
}

.v3cs-bw__step-title {
  font-family:    var(--v3cs-font-heading, 'Cormorant Garamond', serif);
  font-size:      1.9rem;
  font-weight:    300;
  letter-spacing: -.02em;
  margin:         var(--v3cs-space-2, 8px) 0 var(--v3cs-space-2, 8px);
  line-height:    1.15;
}

.v3cs-bw__step-hint {
  font-size:  .8125rem;
  color:      var(--v3cs-color-text-muted, #6B7280);
  margin:     0;
  line-height: 1.5;
}

/* ==========================================================================
   CALENDAR — STEP 1
   ========================================================================== */

.v3cs-bw__calendar { margin-bottom: var(--v3cs-space-5, 20px); }

.v3cs-bw__calendar-header {
  display:         flex;
  align-items:     center;
  justify-content: space-between;
  margin-bottom:   var(--v3cs-space-4, 16px);
}

.v3cs-bw__cal-month {
  font-family:    var(--v3cs-font-heading, 'Cormorant Garamond', serif);
  font-size:      1.2rem;
  font-weight:    400;
  margin:         0;
}

.v3cs-bw__cal-nav {
  width:            36px; height: 36px;
  border-radius:    var(--v3cs-radius-xs, 4px);
  border:           1px solid var(--v3cs-color-border, #E4E4E7);
  background:       transparent;
  cursor:           pointer;
  display:          flex;
  align-items:      center;
  justify-content:  center;
  transition:       border-color .15s, background .15s;
}
.v3cs-bw__cal-nav:hover {
  border-color: var(--v3cs-color-gold, #C6A15B);
  background:   rgba(198,161,91,.07);
}

.v3cs-bw__cal-weekdays,
.v3cs-bw__cal-grid {
  display:               grid;
  grid-template-columns: repeat(7, 1fr);
  gap:                   4px;
}

.v3cs-bw__cal-weekday {
  text-align:   center;
  font-size:    .65rem;
  font-weight:  600;
  letter-spacing: .08em;
  text-transform: uppercase;
  color:          var(--v3cs-color-text-muted, #9CA3AF);
  padding:        4px 0 8px;
}

.v3cs-bw__cal-loading {
  grid-column: span 7;
  text-align:  center;
  padding:     var(--v3cs-space-6, 24px);
  font-size:   .8125rem;
  color:       var(--v3cs-color-text-muted, #9CA3AF);
}

/* Calendar day button */
.v3cs-bw__cal-day {
  position:         relative;
  display:          flex;
  flex-direction:   column;
  align-items:      center;
  justify-content:  center;
  aspect-ratio:     1;
  border-radius:    4px;
  border:           1.5px solid transparent;
  background:       transparent;
  cursor:           default;
  transition:       background .15s, border-color .15s, transform .1s;
  padding:          4px 2px 6px;
  gap:              2px;
  font-size:        .8125rem;
  font-weight:      500;
}

.v3cs-bw__cal-day.is-clickable { cursor: pointer; }

.v3cs-bw__cal-day-num { font-size: .8125rem; line-height: 1; }

.v3cs-bw__cal-day-status-dot {
  width:          5px; height: 5px;
  border-radius:  50%;
  background:     transparent;
}

.v3cs-bw__cal-day-check {
  position:   absolute;
  top:        3px; right: 4px;
  font-size:  8px;
  color:      #fff;
  line-height: 1;
}

/* Status variants */
.v3cs-bw__cal-day--available   .v3cs-bw__cal-day-status-dot { background: #10B981; }
.v3cs-bw__cal-day--partial     .v3cs-bw__cal-day-status-dot { background: linear-gradient(135deg, #10B981 50%, var(--v3cs-color-gold, #C6A15B) 50%); }
.v3cs-bw__cal-day--unavailable .v3cs-bw__cal-day-status-dot { background: var(--v3cs-color-gold, #C6A15B); }
.v3cs-bw__cal-day--lead_time   .v3cs-bw__cal-day-status-dot { background: #D1D5DB; }
.v3cs-bw__cal-day--past        .v3cs-bw__cal-day-status-dot { background: #E5E7EB; }

.v3cs-bw__cal-day.is-disabled   { opacity: .4; }
.v3cs-bw__cal-day.is-clickable:hover {
  background:     rgba(198,161,91,.08);
  border-color:   rgba(198,161,91,.35);
  transform:      scale(1.06);
}
.v3cs-bw__cal-day.is-selected {
  background:     var(--v3cs-color-gold, #C6A15B);
  border-color:   var(--v3cs-color-gold, #C6A15B);
  color:          #111;
}
.v3cs-bw__cal-day.is-selected .v3cs-bw__cal-day-status-dot { background: rgba(0,0,0,.25); }

/* Legend */
.v3cs-bw__cal-legend {
  display:     flex;
  gap:         var(--v3cs-space-5, 20px);
  justify-content: center;
  margin-top:  var(--v3cs-space-4, 16px);
  flex-wrap:   wrap;
}

.v3cs-bw__legend-item {
  display:     flex;
  align-items: center;
  gap:         6px;
  font-size:   .7rem;
  color:       var(--v3cs-color-text-muted, #6B7280);
}

.v3cs-bw__legend-dot {
  width: 8px; height: 8px;
  border-radius: 50%;
}
.v3cs-bw__legend-dot--available   { background: #10B981; }
.v3cs-bw__legend-dot--partial     { background: linear-gradient(135deg, #10B981 50%, #C6A15B 50%); }
.v3cs-bw__legend-dot--unavailable { background: #C6A15B; }

/* Selected date chips */
.v3cs-bw__selected-dates {
  margin-top:  var(--v3cs-space-4, 16px);
  padding-top: var(--v3cs-space-4, 16px);
  border-top:  1px solid var(--v3cs-color-border, #E4E4E7);
}

.v3cs-bw__selected-label {
  font-size: .75rem;
  color:     var(--v3cs-color-text-muted, #6B7280);
  margin:    0 0 var(--v3cs-space-2, 8px);
}

.v3cs-bw__date-chips {
  display:  flex;
  flex-wrap: wrap;
  gap:      var(--v3cs-space-2, 8px);
}

.v3cs-bw__date-chip {
  display:          inline-flex;
  align-items:      center;
  gap:              6px;
  font-size:        .75rem;
  font-weight:      500;
  background:       rgba(198,161,91,.12);
  color:            #7a5c1e;
  border:           1px solid rgba(198,161,91,.35);
  border-radius:    var(--v3cs-radius-pill, 9999px);
  padding:          4px 10px;
}

.v3cs-bw__date-chip-remove {
  border: none; background: none;
  color:  inherit; cursor: pointer;
  font-size: .9rem; line-height: 1;
  padding: 0; opacity: .6;
  transition: opacity .15s;
}
.v3cs-bw__date-chip-remove:hover { opacity: 1; }

/* ==========================================================================
   TIME PICKER — STEP 2
   ========================================================================== */

.v3cs-bw__time-picker { margin-bottom: var(--v3cs-space-6, 24px); }
.v3cs-bw__time-picker + .v3cs-bw__time-picker { border-top: 1px solid var(--v3cs-color-border, #E4E4E7); padding-top: var(--v3cs-space-6, 24px); }

.v3cs-bw__time-date-label {
  font-family:  var(--v3cs-font-heading, 'Cormorant Garamond', serif);
  font-size:    1.1rem;
  font-weight:  400;
  margin:       0 0 var(--v3cs-space-4, 16px);
}

.v3cs-bw__time-loading { font-size: .8125rem; color: var(--v3cs-color-text-muted, #9CA3AF); }

.v3cs-bw__time-legend {
  display:  flex; gap: var(--v3cs-space-5, 20px);
  flex-wrap: wrap; margin-bottom: var(--v3cs-space-3, 12px);
  font-size: .7rem; color: var(--v3cs-color-text-muted, #6B7280);
}
.v3cs-bw__time-legend span { display: flex; align-items: center; gap: 6px; }
.v3cs-time-dot { width: 10px; height: 10px; border-radius: 50%; }
.v3cs-time-dot--available   { background: #10B981; }
.v3cs-time-dot--unavailable { background: #E5E7EB; }
.v3cs-time-dot--selected    { background: var(--v3cs-color-gold, #C6A15B); }

.v3cs-bw__time-slots {
  display:               grid;
  grid-template-columns: repeat(4, 1fr);
  gap:                   var(--v3cs-space-2, 8px);
  margin-bottom:         var(--v3cs-space-4, 16px);
}

.v3cs-bw__slot {
  padding:        10px 6px;
  font-size:      .8rem;
  font-weight:    500;
  text-align:     center;
  border-radius:  var(--v3cs-radius-xs, 4px);
  border:         1.5px solid var(--v3cs-color-border, #E4E4E7);
  background:     transparent;
  cursor:         pointer;
  transition:     background .12s, border-color .12s, color .12s;
  white-space:    nowrap;
}

.v3cs-bw__slot--available:hover {
  border-color: #10B981;
  background:   rgba(16,185,129,.08);
}

.v3cs-bw__slot--available  { color: var(--v3cs-color-text, #111); border-color: #10B981; }
.v3cs-bw__slot--taken      { color: #D1D5DB; border-color: #F3F4F6; background: #F9FAFB; cursor: not-allowed; }
.v3cs-bw__slot--in-range   { background: rgba(198,161,91,.12); border-color: var(--v3cs-color-gold, #C6A15B); color: #7a5c1e; }
.v3cs-bw__slot--start,
.v3cs-bw__slot--end        { background: var(--v3cs-color-gold, #C6A15B); border-color: var(--v3cs-color-gold, #C6A15B); color: #111; }

.v3cs-bw__time-summary {
  padding:        10px 14px;
  background:     rgba(198,161,91,.08);
  border-radius:  var(--v3cs-radius-xs, 4px);
  border:         1px solid rgba(198,161,91,.3);
  font-size:      .875rem;
  color:          #7a5c1e;
}

.v3cs-bw__time-hint {
  font-size: .8rem; color: var(--v3cs-color-text-muted, #9CA3AF);
  font-style: italic;
}

.v3cs-bw__time-empty { font-size: .875rem; color: var(--v3cs-color-text-muted, #6B7280); }

/* ==========================================================================
   PACKAGE CARDS — STEP 3
   ========================================================================== */

.v3cs-bw__packages {
  display:               grid;
  grid-template-columns: repeat(3, 1fr);
  gap:                   var(--v3cs-space-4, 16px);
}

.v3cs-bw__package {
  position:       relative;
  display:        flex;
  flex-direction: column;
  gap:            var(--v3cs-space-3, 12px);
  padding:        var(--v3cs-space-5, 20px);
  border:         2px solid var(--v3cs-color-border, #E4E4E7);
  border-radius:  var(--v3cs-radius-md, 8px);
  cursor:         pointer;
  transition:     border-color .15s, transform .15s, box-shadow .15s;
  background:     #fff;
  outline:        none;
}
.v3cs-bw__package:hover { border-color: rgba(198,161,91,.5); transform: translateY(-2px); box-shadow: 0 6px 20px rgba(0,0,0,.07); }
.v3cs-bw__package.is-selected { border-color: var(--v3cs-color-gold, #C6A15B); box-shadow: 0 0 0 3px rgba(198,161,91,.18); }
.v3cs-bw__package:focus-visible { border-color: var(--v3cs-color-gold, #C6A15B); box-shadow: 0 0 0 3px rgba(198,161,91,.25); }
.v3cs-bw__package--featured { border-color: var(--v3cs-color-gold, #C6A15B); }

.v3cs-bw__package-badge {
  position:       absolute;
  top:            -1px; left: 50%;
  transform:      translateX(-50%) translateY(-50%);
  background:     var(--v3cs-color-gold, #C6A15B);
  color:          #111;
  font-size:      .65rem;
  font-weight:    700;
  letter-spacing: .08em;
  text-transform: uppercase;
  padding:        3px 10px;
  border-radius:  var(--v3cs-radius-pill, 9999px);
  white-space:    nowrap;
}

.v3cs-bw__package-header { display: flex; justify-content: space-between; align-items: flex-start; gap: var(--v3cs-space-2, 8px); }
.v3cs-bw__package-name { font-family: var(--v3cs-font-heading, 'Cormorant Garamond', serif); font-size: 1.1rem; font-weight: 400; margin: 0; }
.v3cs-bw__package-rate { font-size: .8125rem; font-weight: 700; color: var(--v3cs-color-gold, #C6A15B); white-space: nowrap; }
.v3cs-bw__package-desc { font-size: .75rem; color: var(--v3cs-color-text-muted, #6B7280); margin: 0; line-height: 1.4; }
.v3cs-bw__package-includes { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 4px; flex: 1; }
.v3cs-bw__package-includes li { font-size: .75rem; display: flex; align-items: flex-start; gap: 6px; line-height: 1.3; }
.v3cs-bw__package-includes li::before { content: '✓'; color: #10B981; font-size: .65rem; margin-top: 1px; flex-shrink: 0; }
.v3cs-bw__package-total { display: flex; justify-content: space-between; align-items: center; font-size: .8125rem; padding-top: var(--v3cs-space-3, 12px); border-top: 1px solid var(--v3cs-color-border, #E4E4E7); color: var(--v3cs-color-text-muted, #6B7280); }
.v3cs-bw__package-total strong { color: var(--v3cs-color-text, #111); font-size: .9375rem; }
.v3cs-bw__package-select-indicator { text-align: center; font-size: .75rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--v3cs-color-text-muted, #9CA3AF); padding: 6px; border: 1px dashed var(--v3cs-color-border, #E4E4E7); border-radius: var(--v3cs-radius-xs, 4px); transition: all .15s; }
.v3cs-bw__package.is-selected .v3cs-bw__package-select-indicator { background: var(--v3cs-color-gold, #C6A15B); border-color: var(--v3cs-color-gold, #C6A15B); color: #111; border-style: solid; }

/* ==========================================================================
   REVIEW — STEP 5
   ========================================================================== */

.v3cs-bw__review-grid { display: flex; flex-direction: column; gap: var(--v3cs-space-5, 20px); }
.v3cs-bw__review-section { padding: var(--v3cs-space-4, 16px); border: 1px solid var(--v3cs-color-border, #E4E4E7); border-radius: var(--v3cs-radius-xs, 4px); }
.v3cs-bw__review-label { font-size: .65rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--v3cs-color-text-muted, #9CA3AF); margin: 0 0 var(--v3cs-space-3, 12px); }
.v3cs-bw__review-session { display: flex; justify-content: space-between; align-items: center; gap: var(--v3cs-space-3, 12px); font-size: .875rem; padding: 4px 0; }
.v3cs-bw__review-date { font-weight: 600; }
.v3cs-bw__review-time { color: var(--v3cs-color-text-muted, #6B7280); }
.v3cs-bw__review-dur { font-size: .75rem; background: rgba(198,161,91,.1); color: #7a5c1e; padding: 2px 8px; border-radius: var(--v3cs-radius-pill, 9999px); }
.v3cs-bw__review-pkg { display: flex; justify-content: space-between; font-size: .875rem; font-weight: 500; }
.v3cs-bw__review-notes { font-size: .8125rem; color: var(--v3cs-color-text-muted, #6B7280); font-style: italic; }

.v3cs-bw__review-total { display: flex; flex-direction: column; align-items: flex-end; gap: 4px; padding: var(--v3cs-space-5, 20px); background: var(--v3cs-color-black, #111); border-radius: var(--v3cs-radius-md, 8px); color: #fff; }
.v3cs-bw__review-total span { font-size: .75rem; opacity: .65; }
.v3cs-bw__review-total strong { font-family: var(--v3cs-font-heading, 'Cormorant Garamond', serif); font-size: 2rem; font-weight: 300; color: var(--v3cs-color-gold, #C6A15B); }
.v3cs-bw__review-total-note { font-size: .7rem; opacity: .5; margin: 0; text-align: right; }

.v3cs-bw__submit { width: 100%; margin-top: var(--v3cs-space-5, 20px); justify-content: center; }
.v3cs-bw__submit-note { text-align: center; font-size: .75rem; color: var(--v3cs-color-text-muted, #9CA3AF); margin: var(--v3cs-space-2, 8px) 0 0; }

/* ==========================================================================
   SUCCESS — STEP 6
   ========================================================================== */

.v3cs-bw__step--success { text-align: center; padding: var(--v3cs-space-8, 40px) var(--v3cs-space-6, 24px); }

.v3cs-bw__success-icon { margin-bottom: var(--v3cs-space-5, 20px); }
.v3cs-bw__success-icon svg { stroke: #10B981; margin: 0 auto; }
.v3cs-bw__success-title { font-family: var(--v3cs-font-heading, 'Cormorant Garamond', serif); font-size: 2rem; font-weight: 300; margin: 0 0 var(--v3cs-space-4, 16px); }
.v3cs-bw__success-message { font-size: .9375rem; color: var(--v3cs-color-text-muted, #6B7280); line-height: 1.6; margin-bottom: var(--v3cs-space-7, 32px); }

.v3cs-bw__refs { margin-bottom: var(--v3cs-space-7, 32px); }
.v3cs-bw__refs h3 { font-size: .7rem; letter-spacing: .1em; text-transform: uppercase; color: var(--v3cs-color-text-muted, #9CA3AF); margin: 0 0 var(--v3cs-space-3, 12px); }

.v3cs-bw__ref-card { padding: var(--v3cs-space-4, 16px); background: var(--v3cs-color-black, #111); border-radius: var(--v3cs-radius-md, 8px); margin-bottom: var(--v3cs-space-2, 8px); }
.v3cs-bw__ref-code { font-family: monospace; font-size: 1.35rem; font-weight: 700; letter-spacing: .1em; color: var(--v3cs-color-gold, #C6A15B); margin-bottom: 4px; }
.v3cs-bw__ref-meta { font-size: .8125rem; color: rgba(255,255,255,.55); }

.v3cs-bw__success-next { text-align: left; background: #F9FAFB; border-radius: var(--v3cs-radius-md, 8px); padding: var(--v3cs-space-5, 20px); margin-bottom: var(--v3cs-space-6, 24px); }
.v3cs-bw__success-next p { margin: 0 0 var(--v3cs-space-3, 12px); font-weight: 600; font-size: .8125rem; }
.v3cs-bw__success-next ol { margin: 0; padding-left: var(--v3cs-space-5, 20px); font-size: .8125rem; color: var(--v3cs-color-text-muted, #6B7280); line-height: 2; }

/* ==========================================================================
   ERRORS
   ========================================================================== */

.v3cs-bw__errors {
  background:    #FEF2F2;
  border:        1px solid #FCA5A5;
  border-radius: var(--v3cs-radius-xs, 4px);
  padding:       var(--v3cs-space-4, 16px);
  margin-bottom: var(--v3cs-space-5, 20px);
  font-size:     .8125rem;
}
.v3cs-bw__errors p  { margin: 0 0 6px; font-weight: 600; color: #991B1B; }
.v3cs-bw__errors ul { margin: 0; padding-left: var(--v3cs-space-5, 20px); color: #B91C1C; line-height: 1.7; }

/* ==========================================================================
   NAVIGATION
   ========================================================================== */

.v3cs-bw__nav {
  display:         flex;
  justify-content: space-between;
  align-items:     center;
  padding:         var(--v3cs-space-5, 20px) var(--v3cs-space-7, 32px);
  border-top:      1px solid var(--v3cs-color-border, #E4E4E7);
  background:      #FAFAFA;
}

/* ==========================================================================
   RESPONSIVE
   ========================================================================== */

@media (max-width: 640px) {
  .v3cs-bw__body          { padding: var(--v3cs-space-5, 20px); }
  .v3cs-bw__nav            { padding: var(--v3cs-space-4, 16px) var(--v3cs-space-5, 20px); }
  .v3cs-bw__packages       { grid-template-columns: 1fr; }
  .v3cs-bw__time-slots     { grid-template-columns: repeat(3, 1fr); }
  .v3cs-bw__cal-weekday    { font-size: .5rem; }
  .v3cs-bw__cal-day-num    { font-size: .7rem; }
  .v3cs-bw__progress-step  { padding: 10px 12px; }
  .v3cs-bw__progress-label { display: none; }
}

/* ==========================================================================
   REDUCED MOTION
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {
  .v3cs-bw__cal-day,
  .v3cs-bw__package,
  .v3cs-bw__slot { transition: none; }
}

/* ==========================================================================
   PHASE 9 — BOOKING LUXURY REFINEMENTS
   Calendar states, transitions, progress indicator, premium spacing.
   ========================================================================== */

/* Calendar day — smooth state transitions */
.v3cs-bw__cal-day {
  transition:
    background-color 200ms cubic-bezier(0.25,0.46,0.45,0.94),
    border-color     200ms cubic-bezier(0.25,0.46,0.45,0.94),
    color            200ms cubic-bezier(0.25,0.46,0.45,0.94),
    transform        200ms cubic-bezier(0.25,0.46,0.45,0.94),
    box-shadow       200ms cubic-bezier(0.25,0.46,0.45,0.94);
}

/* Available — clean green with hover lift */
.v3cs-bw__cal-day--available:hover {
  border-color:     #10B981;
  background-color: rgba(16,185,129,0.08);
  transform:        translateY(-1px);
  box-shadow:       0 3px 10px rgba(16,185,129,0.18);
}

/* Unavailable — soft gold to signal "booked" not "error" */
.v3cs-bw__cal-day--unavailable {
  background-color: rgba(198,161,91,0.06);
  border-color:     rgba(198,161,91,0.2);
  color:            rgba(17,17,17,0.4);
}

/* Selected — authoritative black */
.v3cs-bw__cal-day.is-selected,
.v3cs-bw__cal-day.is-selected:hover {
  background-color: #111111;
  border-color:     #111111;
  color:            #FFFFFF;
  transform:        translateY(-2px);
  box-shadow:       0 6px 20px rgba(17,17,17,0.22);
}

/* Progress step — refined dot */
.v3cs-bw__progress-dot {
  transition:
    background-color 300ms cubic-bezier(0.25,0.46,0.45,0.94),
    transform        300ms cubic-bezier(0.25,0.46,0.45,0.94),
    box-shadow       300ms cubic-bezier(0.25,0.46,0.45,0.94);
}

.v3cs-bw__progress-step.is-active .v3cs-bw__progress-dot {
  background:  #C6A15B;
  transform:   scale(1.25);
  box-shadow:  0 0 0 4px rgba(198,161,91,0.18);
}

.v3cs-bw__progress-step.is-done .v3cs-bw__progress-dot {
  background:  #111111;
}

/* Progress connector line */
.v3cs-bw__progress-step::after {
  transition: background-color 400ms ease 200ms;
}

.v3cs-bw__progress-step.is-done::after {
  background: #111111;
}

/* Step enter animation */
.v3cs-bw__step {
  animation: v3cs-luxury-step-in 380ms cubic-bezier(0.25,0.46,0.45,0.94) both;
}

@keyframes v3cs-luxury-step-in {
  from { opacity: 0; transform: translateY(18px); }
  to   { opacity: 1; transform: translateY(0);    }
}

/* Slot buttons — premium states */
.v3cs-bw__slot {
  transition:
    background-color 200ms cubic-bezier(0.25,0.46,0.45,0.94),
    border-color     200ms cubic-bezier(0.25,0.46,0.45,0.94),
    color            200ms cubic-bezier(0.25,0.46,0.45,0.94),
    transform        200ms cubic-bezier(0.25,0.46,0.45,0.94),
    box-shadow       200ms cubic-bezier(0.25,0.46,0.45,0.94);
}

.v3cs-bw__slot--available:hover {
  background-color: #111111;
  border-color:     #111111;
  color:            #FFFFFF;
  transform:        translateY(-2px);
  box-shadow:       0 4px 14px rgba(17,17,17,0.18);
}

/* Package card — clean hover ring */
.v3cs-bw__package {
  transition:
    border-color     260ms cubic-bezier(0.25,0.46,0.45,0.94),
    transform        260ms cubic-bezier(0.25,0.46,0.45,0.94),
    box-shadow       260ms cubic-bezier(0.25,0.46,0.45,0.94);
  border-radius: 2px;
}

.v3cs-bw__package:hover {
  border-color: rgba(198,161,91,0.5);
  transform:    translateY(-3px);
  box-shadow:   0 8px 24px rgba(198,161,91,0.10);
}

.v3cs-bw__package.is-selected {
  border-color: #C6A15B;
  box-shadow:   0 0 0 2px rgba(198,161,91,0.2),
                0 8px 24px rgba(198,161,91,0.12);
}

/* Widget outer shell — subtle border */
#v3cs-booking-widget,
.v3cs-booking-widget {
  border:        1px solid rgba(17,17,17,0.08);
  border-radius: 4px;
}

/* Customer form — elegant inputs */
.v3cs-bw__input,
.v3cs-bw__textarea {
  border-radius:    0;
  border:           none;
  border-bottom:    1px solid rgba(17,17,17,0.18);
  padding:          12px 0;
  background:       transparent;
  transition:
    border-color 240ms cubic-bezier(0.25,0.46,0.45,0.94),
    box-shadow   240ms cubic-bezier(0.25,0.46,0.45,0.94);
}

.v3cs-bw__input:focus,
.v3cs-bw__textarea:focus {
  outline:             none;
  border-bottom-color: #C6A15B;
  box-shadow:          0 1px 0 0 #C6A15B;
}

/* Summary panel refinement */
.v3cs-bw__summary {
  border-left: 2px solid #C6A15B;
  padding-left: 20px;
}

/* Checkout GCash button — brand blue on primary */
.v3cs-co__pay-btn {
  background:    #007AFF;
  border-color:  #007AFF;
  transition:
    background-color 260ms cubic-bezier(0.25,0.46,0.45,0.94),
    transform        200ms ease,
    box-shadow       260ms cubic-bezier(0.25,0.46,0.45,0.94);
}

.v3cs-co__pay-btn:hover {
  background:  #0060CC;
  transform:   translateY(-2px);
  box-shadow:  0 8px 24px rgba(0,122,255,0.30);
  color:       #fff;
}

