/* Bookly booking form, restyled to match the FD Automotive design (charcoal + orange, Inter / Barlow Condensed). */
.fd-bookly { margin-top: 8px; }
.fd-bookly .bookly-form,
.fd-bookly .bookly-form * { font-family: "Inter", system-ui, sans-serif !important; }
.fd-bookly .bookly-form { color: #f5f2ed !important; max-width: 100% !important; }

/* Progress tracker */
.fd-bookly .bookly-progress-tracker > div { color: #a8a49d !important; font-size: .72rem !important; font-weight: 700 !important; letter-spacing: .14em !important; text-transform: uppercase !important; }
.fd-bookly .bookly-progress-tracker > div.active { color: #ff671c !important; }
.fd-bookly .bookly-progress-tracker .step { background: rgba(255,255,255,.12) !important; height: 3px !important; border-radius: 2px !important; margin-top: 8px !important; }
.fd-bookly .bookly-progress-tracker .active .step { background: #ff671c !important; }
.fd-bookly .bookly-stepper { display: none !important; }

/* Intro text */
.fd-bookly .bookly-box { color: #a8a49d !important; font-size: .95rem !important; line-height: 1.6 !important; }
.fd-bookly .bookly-box.bookly-bold { color: #f5f2ed !important; font-weight: 500 !important; }

/* Labels */
.fd-bookly .bookly-form label,
.fd-bookly .bookly-form .bookly-form-group > label,
.fd-bookly .bookly-form .bookly-form-group > div > label {
  color: #a8a49d !important; font-size: .72rem !important; font-weight: 700 !important;
  letter-spacing: .16em !important; text-transform: uppercase !important; margin-bottom: 8px !important;
}

/* Fields */
.fd-bookly .bookly-form input[type="text"],
.fd-bookly .bookly-form input[type="email"],
.fd-bookly .bookly-form input[type="tel"],
.fd-bookly .bookly-form input[type="number"],
.fd-bookly .bookly-form select,
.fd-bookly .bookly-form textarea {
  background: #0c0c0e !important; color: #f5f2ed !important;
  border: 1px solid rgba(255,255,255,.12) !important; border-radius: 4px !important;
  min-height: 48px !important; padding: 10px 14px !important; font-size: .95rem !important;
  box-shadow: none !important; transition: border-color .3s, box-shadow .3s !important;
}
.fd-bookly .bookly-form select {
  -webkit-appearance: none !important; appearance: none !important; padding-right: 38px !important;
  background-image: linear-gradient(45deg, transparent 50%, #ff671c 50%), linear-gradient(135deg, #ff671c 50%, transparent 50%) !important;
  background-position: calc(100% - 20px) 50%, calc(100% - 14px) 50% !important; background-size: 6px 6px !important; background-repeat: no-repeat !important;
}
.fd-bookly .bookly-form select option { background: #1a1a1e; color: #f5f2ed; }
.fd-bookly .bookly-form input:focus,
.fd-bookly .bookly-form select:focus,
.fd-bookly .bookly-form textarea:focus { border-color: #ff671c !important; box-shadow: 0 0 0 3px rgba(255,103,28,.18) !important; outline: none !important; }
.fd-bookly .bookly-form textarea { min-height: 120px !important; }
.fd-bookly .bookly-form input::placeholder, .fd-bookly .bookly-form textarea::placeholder { color: rgba(245,242,237,.4) !important; }

/* Week-day checkboxes */
.fd-bookly .bookly-week-days label, .fd-bookly .bookly-week-days span { color: #f5f2ed !important; }

/* Buttons */
.fd-bookly .bookly-form .bookly-btn,
.fd-bookly .bookly-form button.bookly-btn {
  background: #ff671c !important; color: #0c0c0e !important; border: 1.5px solid #ff671c !important; border-radius: 4px !important;
  min-height: 52px !important; padding: 0 28px !important; font-size: .82rem !important; font-weight: 700 !important;
  letter-spacing: .14em !important; text-transform: uppercase !important; box-shadow: none !important;
  transition: background-color .35s, color .35s, border-color .35s !important;
}
.fd-bookly .bookly-form .bookly-btn:hover { background: #f5f2ed !important; border-color: #f5f2ed !important; color: #0c0c0e !important; }
.fd-bookly .bookly-form .bookly-back-step,
.fd-bookly .bookly-form .bookly-btn.bookly-back-step { background: transparent !important; color: #f5f2ed !important; border-color: rgba(255,255,255,.35) !important; }
.fd-bookly .bookly-form .bookly-back-step:hover { background: #f5f2ed !important; color: #0c0c0e !important; }
.fd-bookly .bookly-form .bookly-nav-steps { border-top: 1px solid rgba(255,255,255,.09) !important; padding-top: 22px !important; margin-top: 10px !important; }

/* Time step: day columns and time slots */
.fd-bookly .bookly-form .bookly-column .bookly-day,
.fd-bookly .bookly-form .bookly-day { background: #1a1a1e !important; color: #f5f2ed !important; border: 0 !important; font-weight: 700 !important; letter-spacing: .08em !important; }
.fd-bookly .bookly-form .bookly-hour {
  background: #0c0c0e !important; color: #f5f2ed !important; border: 1px solid rgba(255,255,255,.12) !important; border-radius: 4px !important;
  transition: border-color .25s, background-color .25s, color .25s !important;
}
.fd-bookly .bookly-form .bookly-hour:hover { border-color: #ff671c !important; background: #ff671c !important; color: #0c0c0e !important; }
.fd-bookly .bookly-form .bookly-hour .bookly-hour-icon { border-color: #ff671c !important; }
.fd-bookly .bookly-form .bookly-hour:hover .bookly-hour-icon span { background: #0c0c0e !important; }
.fd-bookly .bookly-form .bookly-time-next, .fd-bookly .bookly-form .bookly-time-prev { background: #1a1a1e !important; border: 1px solid rgba(255,255,255,.12) !important; color: #f5f2ed !important; }

/* Inline calendar (time step) */
.fd-bookly .bookly-form .picker__holder, .fd-bookly .bookly-form .picker__box { background: #1a1a1e !important; border-color: rgba(255,255,255,.09) !important; }
.fd-bookly .bookly-form .picker__header, .fd-bookly .bookly-form .picker__weekday, .fd-bookly .bookly-form .picker__month, .fd-bookly .bookly-form .picker__year { color: #f5f2ed !important; }
.fd-bookly .bookly-form .picker__day { color: #f5f2ed !important; }
.fd-bookly .bookly-form .picker__day--disabled { color: rgba(245,242,237,.25) !important; background: transparent !important; }
.fd-bookly .bookly-form .picker__day--selected, .fd-bookly .bookly-form .picker__day--highlighted { background: #ff671c !important; color: #0c0c0e !important; }

/* Details/Done text + errors */
.fd-bookly .bookly-form .bookly-label-error { color: #f87171 !important; font-size: .82rem !important; }
.fd-bookly .bookly-form a { color: #ff671c !important; }

/* Time slots: readable text + orange ring */
.fd-bookly .bookly-form .bookly-hour .bookly-time-main,
.fd-bookly .bookly-form .bookly-hour .bookly-time-additional { color: inherit !important; font-weight: 600 !important; }
.fd-bookly .bookly-form .bookly-hour .bookly-hour-icon { border-color: #ff671c !important; background: transparent !important; }
.fd-bookly .bookly-form .bookly-hour .bookly-hour-icon span { background: #ff671c !important; }
.fd-bookly .bookly-form .bookly-hour:hover .bookly-hour-icon { border-color: #0c0c0e !important; }
.fd-bookly .bookly-form .bookly-column .bookly-day { color: #f5f2ed !important; background: transparent !important; }

/* Slot calendar (Bookly's Svelte/Tailwind calendar) */
.fd-bookly .bookly-slot-calendar .bookly-panel-mark { background: #1a1a1e !important; border-color: rgba(255,255,255,.09) !important; border-radius: 4px !important; }
.fd-bookly .bookly-slot-calendar [class*="bookly:border-slate-100"] { border-color: rgba(255,255,255,.09) !important; }
.fd-bookly .bookly-slot-calendar [class*="text-slate-600"],
.fd-bookly .bookly-slot-calendar [class*="text-gray-400"] { color: #a8a49d !important; }
.fd-bookly .bookly-slot-calendar [class*="bookly:bg-slate-100"] { background: transparent !important; color: rgba(245,242,237,.22) !important; }
.fd-bookly .bookly-slot-calendar [class*="bookly:bg-slate-100"] span { color: rgba(245,242,237,.22) !important; }
.fd-bookly .bookly-slot-calendar [class*="bookly:text-white"][class*="bg-"] { color: #0c0c0e !important; border-radius: 4px !important; }
.fd-bookly .bookly-slot-calendar [class*="bookly:text-white"][class*="bg-"] span { color: #0c0c0e !important; font-weight: 700 !important; }
.fd-bookly .bookly-slot-calendar [class*="text-bookly"] { border-radius: 4px !important; }
.fd-bookly .bookly-slot-calendar [class*="text-bookly"]:hover { background: rgba(255,103,28,.15) !important; }
.fd-bookly .bookly-slot-calendar [class*="calendar-controls-mark"] [class*="bookly:text-"] { color: #f5f2ed !important; }

/* Details step: name / phone / email side by side on wide screens, stacked on narrow ones */
.fd-bookly .bookly-details-step .bookly-box.bookly-table { display: flex !important; gap: 18px !important; }
.fd-bookly .bookly-details-step .bookly-box.bookly-table > .bookly-form-group { display: block !important; flex: 1 1 0 !important; width: auto !important; padding: 0 !important; margin: 0 !important; }
@media (max-width: 900px) {
  .fd-bookly .bookly-details-step .bookly-box.bookly-table { flex-direction: column !important; }
  .fd-bookly .bookly-details-step .bookly-box.bookly-table > .bookly-form-group { width: 100% !important; }
}
.fd-bookly .bookly-details-step .iti { width: 100% !important; }
.fd-bookly .bookly-details-step .iti input { padding-left: 52px !important; }
.fd-bookly .iti__country-list { background: #1a1a1e !important; color: #f5f2ed !important; border-color: rgba(255,255,255,.12) !important; }

/* Full-width booking panel: keep the service-step controls a comfortable width */
.fd-bookly .bookly-service-step .bookly-js-chain,
.fd-bookly .bookly-service-step .bookly-box:not(.bookly-nav-steps) { max-width: 760px; }

/* Same 4-step text tracker on every screen size (Bookly's mobile dot stepper counts a payment step we don't use) */
.fd-bookly .bookly-form ol.bookly-stepper { display: none !important; }
.fd-bookly .bookly-form .bookly-progress-tracker { display: table !important; width: 100% !important; }
@media (max-width: 640px) {
  .fd-bookly .bookly-form .bookly-progress-tracker > div { font-size: .6rem !important; letter-spacing: .08em !important; }
}
.fd-bookly .bookly-form .bookly-progress-tracker > div { display: table-cell !important; width: 25% !important; padding-right: 6px !important; vertical-align: bottom !important; }
