/* ================================================================
   LUMINA SALON — WooSalonPro Integration Styles
   Premium booking widget look, hide kiosk/walk-in
   ================================================================ */

/* ── Hide walk-in & kiosk elements completely ─────────────────── */
.wssp-kiosk-btn,
.wssp-walkin-btn,
.wssp-walkin-link,
.wssp-walkin-option,
[class*="kiosk"],
[class*="walkin"],
[class*="walk-in"],
[id*="kiosk"],
[id*="walkin"],
[data-mode="kiosk"],
[data-service-type="walkin"],
a[href*="wssp_kiosk="],
a[href*="wssp_pos="],
a[href*="wssp_queue="],
.wssp-queue-btn,
.wssp-pos-btn,
.wssp-staff-toggle,
.wssp-admin-only,
#wssp-kiosk-trigger,
#wssp-queue-trigger { display: none !important; }

/* ── Booking page wrapper ──────────────────────────────────────── */
.ls-booking-page-wrap {
    max-width: 900px;
    margin: 0 auto;
    padding: clamp(24px,5vw,48px);
}
.ls-booking-page-hero {
    text-align: center;
    padding: clamp(80px,12vh,120px) 0 clamp(32px,4vh,48px);
    background: var(--ls-dark);
    margin-bottom: 0;
}
.ls-booking-page-hero h1 { color: var(--ls-white); margin-bottom: 8px; }
.ls-booking-page-hero p  { color: rgba(255,255,255,.55); }

/* ── WSSP booking widget premium overrides ─────────────────────── */
.wssp-booking-wrapper,
.wssp_booking_wrap,
.wssp-booking-container,
#wssp-booking,
.wssp-frontend-booking {
    font-family: var(--ls-font-body), sans-serif !important;
    color: var(--ls-text-dark) !important;
    max-width: 860px !important;
    margin: 0 auto !important;
}

/* Step navigation */
.wssp-steps-nav,
.wssp-booking-steps,
.wssp-step-tabs {
    display: flex !important;
    gap: 0 !important;
    border-bottom: 2px solid var(--ls-border) !important;
    margin-bottom: 32px !important;
    overflow-x: auto !important;
    scrollbar-width: none !important;
}
.wssp-steps-nav::-webkit-scrollbar { display: none !important; }

.wssp-step-tab,
.wssp-step-item {
    flex: 1 !important;
    padding: 12px 16px !important;
    text-align: center !important;
    font-size: .78rem !important;
    font-weight: 700 !important;
    letter-spacing: .06em !important;
    text-transform: uppercase !important;
    color: var(--ls-text-muted) !important;
    border-bottom: 2px solid transparent !important;
    margin-bottom: -2px !important;
    cursor: pointer !important;
    transition: all .2s !important;
    white-space: nowrap !important;
    background: none !important;
    border-top: none !important;
    border-left: none !important;
    border-right: none !important;
}
.wssp-step-tab.active,
.wssp-step-item.active,
.wssp-step-tab.wssp-active,
.wssp-step-tab:hover {
    color: var(--ls-black) !important;
    border-bottom-color: var(--ls-gold) !important;
}

/* Service cards */
.wssp-service-card,
.wssp-service-item,
.wssp-services-list .wssp-item {
    border: 1.5px solid var(--ls-border) !important;
    border-radius: 14px !important;
    padding: 16px !important;
    cursor: pointer !important;
    transition: all .2s !important;
    background: #fff !important;
}
.wssp-service-card:hover,
.wssp-service-item:hover,
.wssp-service-card.selected,
.wssp-service-item.active,
.wssp-service-item.wssp-selected {
    border-color: var(--ls-gold) !important;
    background: rgba(201,168,76,.03) !important;
    box-shadow: 0 0 0 3px rgba(201,168,76,.1) !important;
}

/* Staff cards */
.wssp-staff-card,
.wssp-staff-item {
    border: 1.5px solid var(--ls-border) !important;
    border-radius: 14px !important;
    overflow: hidden !important;
    cursor: pointer !important;
    transition: all .2s !important;
}
.wssp-staff-card:hover,
.wssp-staff-card.selected,
.wssp-staff-item.active {
    border-color: var(--ls-gold) !important;
    box-shadow: 0 4px 20px rgba(0,0,0,.1) !important;
}

/* Time slots */
.wssp-time-slot,
.wssp-slot-btn,
.wssp-time-btn {
    border: 1.5px solid var(--ls-border) !important;
    border-radius: 10px !important;
    padding: 10px 14px !important;
    font-size: .85rem !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    transition: all .2s !important;
    background: #fff !important;
    color: var(--ls-text-dark) !important;
}
.wssp-time-slot:hover,
.wssp-time-slot.selected,
.wssp-slot-btn.active,
.wssp-time-btn.wssp-selected {
    border-color: var(--ls-gold) !important;
    background: var(--ls-gold) !important;
    color: var(--ls-black) !important;
}
.wssp-time-slot.unavailable,
.wssp-slot-btn.disabled {
    opacity: .4 !important;
    cursor: not-allowed !important;
    pointer-events: none !important;
}

/* Calendar */
.wssp-calendar-header { font-weight: 700 !important; font-size: .95rem !important; }
.wssp-calendar-day.selected,
.wssp-calendar-day.active,
.wssp-day-btn.selected {
    background: var(--ls-gold) !important;
    color: var(--ls-black) !important;
    border-radius: 8px !important;
    font-weight: 800 !important;
}
.wssp-calendar-day:hover,
.wssp-day-btn:hover {
    background: rgba(201,168,76,.15) !important;
    border-radius: 8px !important;
}

/* Form inputs */
.wssp-booking-form input[type="text"],
.wssp-booking-form input[type="email"],
.wssp-booking-form input[type="tel"],
.wssp-booking-form select,
.wssp-booking-form textarea {
    border: 1.5px solid var(--ls-border) !important;
    border-radius: 10px !important;
    padding: 12px 14px !important;
    font-family: var(--ls-font-body), sans-serif !important;
    font-size: .95rem !important;
    width: 100% !important;
    outline: none !important;
    transition: border-color .2s, box-shadow .2s !important;
}
.wssp-booking-form input:focus,
.wssp-booking-form select:focus,
.wssp-booking-form textarea:focus {
    border-color: var(--ls-gold) !important;
    box-shadow: 0 0 0 3px rgba(201,168,76,.12) !important;
}

/* Primary action buttons */
.wssp-btn-primary,
.wssp-continue-btn,
.wssp-book-btn,
.wssp-submit-btn,
button[class*="wssp"][class*="primary"],
.wssp-booking-wrapper .button.wssp-primary {
    background: linear-gradient(135deg, #c9a84c, #e8c97a) !important;
    background-size: 200% !important;
    color: var(--ls-black) !important;
    border: none !important;
    border-radius: 50px !important;
    padding: 14px 32px !important;
    font-family: var(--ls-font-body), sans-serif !important;
    font-weight: 700 !important;
    font-size: .9rem !important;
    letter-spacing: .04em !important;
    text-transform: uppercase !important;
    cursor: pointer !important;
    transition: all .25s !important;
    box-shadow: 0 4px 20px rgba(201,168,76,.3) !important;
}
.wssp-btn-primary:hover,
.wssp-continue-btn:hover,
.wssp-book-btn:hover {
    background-position: right !important;
    box-shadow: 0 6px 28px rgba(201,168,76,.45) !important;
    transform: translateY(-1px) !important;
}

/* Secondary / back buttons */
.wssp-btn-secondary,
.wssp-back-btn {
    background: transparent !important;
    color: var(--ls-text-muted) !important;
    border: 1.5px solid var(--ls-border) !important;
    border-radius: 50px !important;
    padding: 12px 24px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    transition: all .2s !important;
}
.wssp-btn-secondary:hover,
.wssp-back-btn:hover {
    border-color: var(--ls-text-dark) !important;
    color: var(--ls-text-dark) !important;
}

/* Summary / confirmation box */
.wssp-booking-summary,
.wssp-confirmation-box {
    background: var(--ls-cream) !important;
    border: 1px solid var(--ls-border) !important;
    border-radius: 16px !important;
    padding: 24px !important;
}
.wssp-confirmation-icon { color: var(--ls-gold) !important; font-size: 2.5rem !important; }

/* Price display */
.wssp-price,
.wssp-service-price {
    font-weight: 800 !important;
    color: var(--ls-gold) !important;
    font-size: 1rem !important;
}
