/* koetting dark theme override for Easy!Appointments booking UI.
 * Base: neutral near-black (aktuno palette: #0c0c0c / #141414 / #171717 / #1c1c1c).
 * Accent: koetting green #33E08D (buttons, active, links). */
:root {
    --k-bg: #0c0c0c;
    --k-panel: #171717;
    --k-panel-2: #1c1c1c;
    --k-panel-3: #222222;
    --k-border: #2a2a2a;
    --k-border-2: #333333;
    --k-text: #e8e8e8;
    --k-muted: #999999;
    --k-green: #33E08D;
    --k-green-600: #27c47a;
    --k-green-ink: #0a0a0a;
}

html, body {
    background-color: var(--k-bg) !important;
    color: var(--k-text) !important;
}

body #main.container,
.wrapper {
    background-color: var(--k-bg) !important;
}

/* Booking card / main panel */
#book-appointment-wizard,
.bg-body {
    background-color: var(--k-panel) !important;
    color: var(--k-text) !important;
    border: 1px solid var(--k-border-2) !important;
    border-radius: 12px !important;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.55) !important;
}

/* Header bar */
.booking-header,
#book-appointment-wizard .booking-header,
.card-header, .navbar, #header {
    background-color: var(--k-panel-2) !important;
    border-bottom: 1px solid var(--k-border) !important;
    color: var(--k-text) !important;
}

h1, h2, h3, h4, h5, h6, .frame-title, legend, label, strong, b {
    color: var(--k-text) !important;
}

p, .text-muted, small, .small {
    color: var(--k-muted) !important;
}

a { color: var(--k-green) !important; }
a:hover { color: var(--k-green-600) !important; text-decoration: underline; }

/* Step wizard nav */
.nav-tabs, .wizard-nav { background-color: transparent !important; border-bottom: 1px solid var(--k-border) !important; }
.nav-tabs .nav-link, .wizard-nav .nav-link { color: var(--k-muted) !important; border: none !important; background: transparent !important; }
.nav-tabs .nav-link.active, .wizard-nav .nav-link.active {
    color: var(--k-green) !important;
    background: transparent !important;
    border: none !important;
    border-bottom: 2px solid var(--k-green) !important;
}

/* Buttons */
.btn-primary,
#book-appointment-submit,
.button-next {
    background-color: var(--k-green) !important;
    border-color: var(--k-green) !important;
    color: var(--k-green-ink) !important;
    font-weight: 600 !important;
}
.btn-primary:hover, .btn-primary:focus,
#book-appointment-submit:hover, .button-next:hover {
    background-color: var(--k-green-600) !important;
    border-color: var(--k-green-600) !important;
    color: var(--k-green-ink) !important;
}
.btn-outline-primary {
    color: var(--k-green) !important;
    border-color: var(--k-green) !important;
    background-color: transparent !important;
}
.btn-outline-primary:hover {
    background-color: var(--k-green) !important;
    color: var(--k-green-ink) !important;
}
.btn-secondary, .button-back, .btn-light, .btn-outline-secondary {
    background-color: var(--k-panel-2) !important;
    border-color: var(--k-border-2) !important;
    color: var(--k-text) !important;
}
.btn-secondary:hover, .button-back:hover { background-color: var(--k-panel-3) !important; }

/* Success states */
.text-success, .text-primary { color: var(--k-green) !important; }
.bg-success { background-color: var(--k-green) !important; color: var(--k-green-ink) !important; }
.bg-success.bg-opacity-10 { background-color: rgba(51, 224, 141, 0.10) !important; }
.border-success { border-color: var(--k-green) !important; }

/* Form inputs */
.form-control, .form-select, textarea,
input[type="text"], input[type="email"], input[type="tel"], input[type="number"], select {
    background-color: var(--k-panel-2) !important;
    color: var(--k-text) !important;
    border: 1px solid var(--k-border-2) !important;
}
.form-control::placeholder, .form-select::placeholder { color: #666666 !important; }
.form-control:focus, .form-select:focus, textarea:focus {
    background-color: var(--k-panel-3) !important;
    color: var(--k-text) !important;
    border-color: var(--k-green) !important;
    box-shadow: 0 0 0 0.2rem rgba(51, 224, 141, 0.18) !important;
}
.form-check-input {
    background-color: var(--k-panel-2) !important;
    border-color: var(--k-border-2) !important;
}
.form-check-input:checked {
    background-color: var(--k-green) !important;
    border-color: var(--k-green) !important;
}
label.form-label, .form-check-label { color: var(--k-text) !important; }

/* Cards / list groups */
.card, .list-group-item {
    background-color: var(--k-panel-2) !important;
    color: var(--k-text) !important;
    border-color: var(--k-border-2) !important;
}
.card-body { background-color: var(--k-panel-2) !important; }

/* Service / provider select items */
.service-item, .provider-item, #select-service .service, #select-provider .provider {
    background-color: var(--k-panel-2) !important;
    color: var(--k-text) !important;
    border: 1px solid var(--k-border-2) !important;
}
.service-item:hover, .provider-item:hover { border-color: var(--k-green) !important; }
.service-item.selected, .provider-item.selected { border-color: var(--k-green) !important; }

/* Available time-slot buttons */
.available-hour, #available-hours .available-hour {
    background-color: var(--k-panel-2) !important;
    color: var(--k-text) !important;
    border: 1px solid var(--k-border-2) !important;
}
.available-hour:hover { border-color: var(--k-green) !important; color: var(--k-green) !important; }
.available-hour.selected-hour, .available-hour.selected {
    background-color: var(--k-green) !important;
    color: var(--k-green-ink) !important;
    border-color: var(--k-green) !important;
}

/* Flatpickr calendar */
.flatpickr-calendar {
    background: var(--k-panel-2) !important;
    color: var(--k-text) !important;
    border: 1px solid var(--k-border-2) !important;
    box-shadow: 0 6px 24px rgba(0, 0, 0, 0.6) !important;
}
.flatpickr-months, .flatpickr-month { background: var(--k-panel-2) !important; color: var(--k-text) !important; fill: var(--k-text) !important; }
.flatpickr-current-month, .flatpickr-current-month input.cur-year, .cur-month { color: var(--k-text) !important; }
.flatpickr-weekday { color: var(--k-muted) !important; background: var(--k-panel-2) !important; }
.flatpickr-monthDropdown-months { background: var(--k-panel-2) !important; color: var(--k-text) !important; }
.flatpickr-day { color: var(--k-text) !important; background: transparent !important; border-color: transparent !important; }
.flatpickr-day:hover { background: var(--k-panel-3) !important; border-color: var(--k-border-2) !important; }
.flatpickr-day.selected, .flatpickr-day.selected:hover {
    background: var(--k-green) !important;
    color: var(--k-green-ink) !important;
    border-color: var(--k-green) !important;
}
.flatpickr-day.today { border-color: var(--k-green) !important; }
.flatpickr-day.flatpickr-disabled, .flatpickr-day.prevMonthDay, .flatpickr-day.nextMonthDay { color: #444444 !important; }
.flatpickr-prev-month svg, .flatpickr-next-month svg { fill: var(--k-text) !important; }
.flatpickr-prev-month:hover, .flatpickr-next-month:hover { background: var(--k-panel-3) !important; }
.numInputWrapper span:hover { background: var(--k-panel-3) !important; }
.flatpickr-innerContainer, .flatpickr-rContainer { background: var(--k-panel-2) !important; }

/* Modals */
.modal-content { background-color: var(--k-panel) !important; color: var(--k-text) !important; border: 1px solid var(--k-border-2) !important; }
.modal-header, .modal-footer { border-color: var(--k-border-2) !important; background-color: var(--k-panel-2) !important; }
.modal-title { color: var(--k-text) !important; }
.modal-body { background-color: var(--k-panel) !important; color: var(--k-muted) !important; }
.btn-close { filter: invert(1) grayscale(1) brightness(1.5) !important; }

/* Cookie consent banner */
.cc-window, .cc-banner { background-color: var(--k-panel-2) !important; color: var(--k-text) !important; border-top: 1px solid var(--k-border-2) !important; }
.cc-btn, .cc-allow { background-color: var(--k-green) !important; color: var(--k-green-ink) !important; font-weight: 600 !important; }
.cc-deny { color: var(--k-muted) !important; }
.cc-link { color: var(--k-green) !important; }

hr { border-color: var(--k-border) !important; opacity: 1 !important; }

/* Alerts */
.alert-info { background-color: var(--k-panel-2) !important; border-color: var(--k-border-2) !important; color: var(--k-text) !important; }

/* Tables */
table, .table { color: var(--k-text) !important; }
.table > :not(caption) > * > * { background-color: transparent !important; color: var(--k-text) !important; border-color: var(--k-border) !important; }
.table-striped > tbody > tr:nth-of-type(odd) > * { background-color: rgba(255,255,255,0.03) !important; }