/*
 * Bookly skin for Majlis.
 * Primary colour should ALSO be set in Bookly → Appearance → colour = #C9A46A,
 * which covers most of the form. These rules polish what remains, scoped to .bookly-wrap
 * so Bookly's admin screens are untouched.
 */
.bookly-wrap { --bookly-main: var(--gold); font-family: var(--font-body); color: var(--ink); }
.bookly-wrap .bookly-form,
.bookly-wrap .bookly-css-root { font-family: var(--font-body) !important; color: var(--ink); }

/* Headings / step labels */
.bookly-wrap .bookly-progress-tracker > div,
.bookly-wrap .bookly-progress-tracker .step { font-family: var(--font-caps); letter-spacing: .08em; text-transform: uppercase; font-size: .75rem; }
.bookly-wrap .bookly-progress-tracker .active .step,
.bookly-wrap .bookly-progress-tracker .active { color: var(--walnut) !important; }

/* Inputs */
.bookly-wrap input[type="text"], .bookly-wrap input[type="email"], .bookly-wrap input[type="tel"],
.bookly-wrap input[type="number"], .bookly-wrap select, .bookly-wrap textarea {
	border: 1px solid #d8ccb6 !important; border-radius: 10px !important; background: #fffdf8 !important;
	min-height: 46px; padding: 8px 12px !important; font-size: 16px !important; color: var(--ink) !important;
}
.bookly-wrap input:focus, .bookly-wrap select:focus, .bookly-wrap textarea:focus {
	border-color: var(--gold) !important; box-shadow: 0 0 0 3px rgba(201,164,106,.25) !important; outline: none;
}
.bookly-wrap label { color: #4a453b; font-weight: 500; }

/* Buttons */
.bookly-wrap .bookly-btn, .bookly-wrap .bookly-nav-btn, .bookly-wrap button.bookly-btn,
.bookly-wrap .bookly-js-next-step, .bookly-wrap .bookly-js-back-step {
	border-radius: 999px !important; min-height: 46px; padding: 0 26px !important;
	font-family: var(--font-caps) !important; letter-spacing: .12em; text-transform: uppercase; font-size: .8rem !important;
	background: var(--gold) !important; border-color: var(--gold) !important; color: var(--ink) !important;
}
.bookly-wrap .bookly-js-back-step { background: transparent !important; color: var(--walnut) !important; }

/* Time slots & calendar */
.bookly-wrap .bookly-time-step .bookly-day,
.bookly-wrap .bookly-time-step button.bookly-hour { border-radius: 8px !important; }
.bookly-wrap .bookly-time-step button.bookly-hour:hover,
.bookly-wrap .bookly-time-step button.bookly-hour.bookly-js-selected { background: var(--olive-700) !important; color: var(--cream) !important; border-color: var(--olive-700) !important; }
.bookly-wrap .bookly-time-step .bookly-hour .bookly-hour-icon span { background: var(--gold) !important; }
.bookly-wrap .picker__day--selected, .bookly-wrap .picker__day--highlighted { background: var(--gold) !important; color: var(--ink) !important; }

/* Summary / details boxes */
.bookly-wrap .bookly-box { color: #3c372e; }
.bookly-wrap .bookly-bold, .bookly-wrap strong { color: var(--ink); }

/* Customer cabinet table */
.bookly-wrap table { width: 100%; border-collapse: collapse; }
.bookly-wrap table th { text-align: start; font-family: var(--font-caps); font-size: .75rem; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); border-bottom: 1px solid #e0d5c1; padding: 10px 8px; }
.bookly-wrap table td { border-bottom: 1px solid #eee4d3; padding: 12px 8px; }

html[lang^="ar"] .bookly-wrap .bookly-btn,
html[lang^="ar"] .bookly-wrap .bookly-progress-tracker > div { letter-spacing: 0; text-transform: none; font-size: .95rem !important; }
