/* ============================================================
   Bookero Custom Styles - DOGtandem
   Styl: Nowoczesny + ciepły | Typografia: Open Sans + Oswald
   ============================================================ */

/* === DESIGN TOKENS === */
:root {
    --bk-gold:          #d29f68;
    --bk-gold-hover:    #c08f58;
    --bk-gold-dark:     #b8864d;
    --bk-gold-light:    rgba(210, 159, 104, 0.12);
    --bk-gold-xlight:   rgba(210, 159, 104, 0.05);
    --bk-gold-glow:     rgba(210, 159, 104, 0.25);
    --bk-beige:         #f9f0e7;
    --bk-beige-bg:      #fefcfa;
    --bk-text:          #2d2926;
    --bk-text-medium:   #6b5c52;
    --bk-text-light:    #a89080;
    --bk-border-rest:   #e8d5c0;
    --bk-card-bg:       #ffffff;
    --bk-card-shadow:   0 2px 16px rgba(0, 0, 0, 0.07);
    --bk-radius-sm:     6px;
    --bk-radius-md:     10px;
    --bk-radius-lg:     14px;
    --bk-radius-pill:   50px;
    --bk-font-heading:  'Oswald', Helvetica, Arial, sans-serif;
    --bk-font-body:     'Open Sans', Arial, sans-serif;
}

/* === WRAPPER === */
.bookero-plugin-form-wrapper {
    font-family: var(--bk-font-body) !important;
    color: var(--bk-text) !important;
    animation: bkFadeInUp 0.5s ease-out both !important;
}

@keyframes bkFadeInUp {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* === KONTENER BOOKERO === */
div#bookero-plugin {
    max-width: 800px;
    margin: 0 auto;
}

/* === NAGŁÓWEK GŁÓWNY === */
.bookero-plugin-header {
    color: var(--bk-text) !important;
    font-family: var(--bk-font-heading) !important;
    text-transform: uppercase !important;
    letter-spacing: 3px !important;
    font-size: 22px !important;
    font-weight: 600 !important;
    border-bottom: none !important;
    padding-bottom: 0 !important;
    margin-bottom: 8px !important;
}

.bookero-plugin-header::after {
    content: '' !important;
    display: block !important;
    width: 50px !important;
    height: 3px !important;
    background: var(--bk-gold) !important;
    border-radius: 2px !important;
    margin-top: 10px !important;
}

/* === NAGŁÓWKI SEKCJI === */
.bookero-plugin-form-heading {
    color: var(--bk-gold) !important;
    font-family: var(--bk-font-heading) !important;
    text-transform: uppercase !important;
    letter-spacing: 2px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    margin-bottom: 18px !important;
}

.bookero-plugin-form-heading.has-separator {
    border-top: none !important;
    padding-top: 0 !important;
    margin-top: 8px !important;
}

/* === ETYKIETY PÓL === */
.label-service,
.label-custom-duration,
.label-worker,
.label-param,
.label-customer-name,
.label-customer-email,
.label-customer-phone,
.label-reservation-type {
    color: var(--bk-text-medium) !important;
    font-family: var(--bk-font-body) !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    margin-bottom: 7px !important;
    display: block !important;
}

.field.is-required .label-service::after,
.field.is-required .label-custom-duration::after,
.field.is-required .label-worker::after,
.field.is-required .label-param::after,
.field.is-required .label-reservation-type::after {
    content: " *" !important;
    color: var(--bk-gold) !important;
    font-weight: bold !important;
}

/* === SEKCJE - KARTY === */
.services-section,
.workers-section,
.dates-section,
.params-section,
.hours-section,
.customer-section,
.payment-section,
.reservation-type-section,
.bookero-plugin-discount-code-section,
.inquiries-list-section {
    margin-bottom: 16px !important;
    padding: 24px !important;
    background: var(--bk-card-bg) !important;
    border-radius: var(--bk-radius-lg) !important;
    border: 1px solid var(--bk-border-rest) !important;
    box-shadow: var(--bk-card-shadow) !important;
    border-left: none !important;
}

.field {
    margin-bottom: 16px !important;
}

/* === POLA INPUT === */
.bookero-plugin-form-wrapper .field input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="submit"]),
.bookero-plugin-form-wrapper .params-section input,
input#bookero-plugin-discount-code,
input#bookero-plugin-customer-name,
input#bookero-plugin-customer-email {
    border: 1.5px solid var(--bk-border-rest) !important;
    border-radius: var(--bk-radius-md) !important;
    padding: 12px 14px !important;
    font-family: var(--bk-font-body) !important;
    font-size: 14px !important;
    letter-spacing: 0 !important;
    color: var(--bk-text) !important;
    background: var(--bk-beige-bg) !important;
    transition: border-color 0.2s ease, box-shadow 0.2s ease !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

.bookero-plugin-form-wrapper .field input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="submit"])::placeholder,
.bookero-plugin-form-wrapper .params-section input::placeholder,
input#bookero-plugin-discount-code::placeholder,
input#bookero-plugin-customer-name::placeholder,
input#bookero-plugin-customer-email::placeholder {
    color: var(--bk-text-light) !important;
    font-style: normal !important;
}

.bookero-plugin-form-wrapper .field input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="submit"]):focus,
.bookero-plugin-form-wrapper .params-section input:focus,
input#bookero-plugin-discount-code:focus,
input#bookero-plugin-customer-name:focus,
input#bookero-plugin-customer-email:focus {
    outline: none !important;
    border-color: var(--bk-gold) !important;
    box-shadow: 0 0 0 3px var(--bk-gold-glow) !important;
    background: var(--bk-card-bg) !important;
}

/* === MULTISELECT / DROPDOWN === */
.multiselect {
    border: 1.5px solid var(--bk-border-rest) !important;
    border-radius: var(--bk-radius-md) !important;
    font-family: var(--bk-font-body) !important;
    position: relative !important;
    min-height: 44px !important;
    transition: border-color 0.2s ease, box-shadow 0.2s ease !important;
    background: var(--bk-beige-bg) !important;
}

.multiselect.multiselect--active {
    border-color: var(--bk-gold) !important;
    box-shadow: 0 0 0 3px var(--bk-gold-glow) !important;
    background: var(--bk-card-bg) !important;
}

.multiselect__tags {
    min-height: 42px !important;
    padding: 10px 14px !important;
    border-radius: var(--bk-radius-md) !important;
    display: flex !important;
    align-items: center !important;
    background: transparent !important;
    border: none !important;
}

.multiselect__single {
    color: var(--bk-text) !important;
    font-family: var(--bk-font-body) !important;
    font-size: 14px !important;
    letter-spacing: 0 !important;
    line-height: 1.4 !important;
    padding: 0 !important;
    margin: 0 !important;
    background: transparent !important;
}

.multiselect__placeholder {
    color: var(--bk-text-light) !important;
    font-family: var(--bk-font-body) !important;
    font-size: 14px !important;
    padding: 0 !important;
    margin: 0 !important;
}

.multiselect__select {
    background: transparent !important;
    border-radius: 0 var(--bk-radius-md) var(--bk-radius-md) 0 !important;
    width: 36px !important;
    height: 42px !important;
    right: 1px !important;
    top: 1px !important;
    position: absolute !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.multiselect__select::before {
    color: var(--bk-text-medium) !important;
    border-color: var(--bk-text-medium) transparent transparent !important;
    border-style: solid !important;
    border-width: 5px 4px 0 4px !important;
    content: "" !important;
    position: absolute !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
}

.multiselect__content-wrapper {
    border: 1.5px solid var(--bk-gold) !important;
    border-top: none !important;
    border-radius: 0 0 var(--bk-radius-md) var(--bk-radius-md) !important;
    position: absolute !important;
    top: 100% !important;
    left: 0 !important;
    right: 0 !important;
    z-index: 1000 !important;
    background: var(--bk-card-bg) !important;
    max-height: 260px !important;
    overflow-y: auto !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.10) !important;
}

.multiselect__content {
    width: 100% !important;
    list-style: none !important;
    margin: 0 !important;
    padding: 4px 0 !important;
}

.multiselect__element {
    list-style: none !important;
}

.multiselect__option {
    font-family: var(--bk-font-body) !important;
    color: var(--bk-text) !important;
    font-size: 14px !important;
    letter-spacing: 0 !important;
    padding: 11px 14px !important;
    cursor: pointer !important;
    transition: background 0.15s ease !important;
    display: block !important;
    border-bottom: 1px solid rgba(210, 159, 104, 0.08) !important;
}

.multiselect__option:hover,
.multiselect__option--highlight {
    background: var(--bk-gold-light) !important;
    color: var(--bk-text) !important;
}

.multiselect__option--selected {
    background: var(--bk-gold) !important;
    color: #fff !important;
    font-weight: 600 !important;
}

.multiselect__option--group {
    background: var(--bk-beige) !important;
    color: var(--bk-text-medium) !important;
    font-weight: 700 !important;
    font-size: 11px !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    cursor: default !important;
}

.multiselect__option--disabled {
    cursor: default !important;
    opacity: 0.5 !important;
}

.multiselect.has-first-group-to-hide .multiselect__option--group:first-child {
    display: none !important;
}

/* === KALENDARZ === */
.calendar-wrapper {
    position: relative !important;
}

.calendar {
    border: 1px solid var(--bk-border-rest) !important;
    border-radius: var(--bk-radius-lg) !important;
    overflow: hidden !important;
    background: var(--bk-card-bg) !important;
    box-shadow: var(--bk-card-shadow) !important;
}

.calendar-nav {
    background: var(--bk-beige) !important;
    color: var(--bk-text) !important;
    padding: 12px 16px !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    border-bottom: 1px solid var(--bk-border-rest) !important;
}

.calendar-nav-month {
    color: var(--bk-text) !important;
    font-family: var(--bk-font-heading) !important;
    text-transform: uppercase !important;
    letter-spacing: 2px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    margin: 0 !important;
    flex-grow: 1 !important;
    text-align: center !important;
}

.calendar-nav-prev,
.calendar-nav-next {
    color: var(--bk-gold) !important;
    text-decoration: none !important;
    font-size: 18px !important;
    font-weight: bold !important;
    padding: 4px 10px !important;
    border-radius: var(--bk-radius-sm) !important;
    border: 1.5px solid var(--bk-border-rest) !important;
    background: var(--bk-card-bg) !important;
    transition: all 0.2s ease !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 32px !important;
    min-height: 32px !important;
}

.calendar-nav-prev:hover,
.calendar-nav-next:hover {
    background: var(--bk-gold-light) !important;
    border-color: var(--bk-gold) !important;
}

.calendar-nav-prev.is-hidden {
    visibility: hidden !important;
}

.calendar-days {
    display: block !important;
}

.calendar-days-heading {
    background: var(--bk-beige-bg) !important;
    display: grid !important;
    grid-template-columns: repeat(7, 1fr) !important;
    border-bottom: 1px solid var(--bk-border-rest) !important;
}

.calendar-days-heading-cell {
    color: var(--bk-text-light) !important;
    font-family: var(--bk-font-body) !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    font-size: 10px !important;
    font-weight: 700 !important;
    padding: 9px 4px !important;
    text-align: center !important;
    border: none !important;
}

.calendar-days-list {
    display: grid !important;
    grid-template-columns: repeat(7, 1fr) !important;
}

.calendar-days-list-cell {
    border: none !important;
    border-bottom: 1px solid rgba(210, 159, 104, 0.08) !important;
    color: var(--bk-text-light) !important;
    font-family: var(--bk-font-body) !important;
    font-size: 13px !important;
    text-align: center !important;
    padding: 10px 4px !important;
    cursor: default !important;
    transition: all 0.15s ease !important;
    min-height: 40px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: transparent !important;
}

.calendar-days-list-cell.is-open {
    background: var(--bk-gold-xlight) !important;
    color: var(--bk-text-medium) !important;
}

.calendar-days-list-cell.is-valid {
    background: transparent !important;
    color: var(--bk-text) !important;
    font-weight: 600 !important;
    cursor: pointer !important;
}

.calendar-days-list-cell.is-valid:hover {
    background: var(--bk-gold-light) !important;
    color: var(--bk-gold-dark) !important;
    transform: none !important;
    border-radius: var(--bk-radius-sm) !important;
}

.calendar-days-list-cell.is-selected {
    background: var(--bk-gold) !important;
    color: #fff !important;
    font-weight: 700 !important;
    border-radius: var(--bk-radius-sm) !important;
    box-shadow: 0 2px 8px var(--bk-gold-glow) !important;
}

.calendar-days-list-cell.is-offset {
    background: transparent !important;
    color: var(--bk-border-rest) !important;
    cursor: default !important;
}

/* === GODZINY === */
.hours-section {
    /* style dziedziczone z sekcji */
}

.hours-wrapper {
    margin-top: 12px !important;
}

.hours-list {
    display: grid !important;
    grid-template-columns: repeat(auto-fill, minmax(100px, 1fr)) !important;
    gap: 8px !important;
    padding: 0 !important;
    margin: 0 !important;
}

.hours-list-item {
    background: var(--bk-beige-bg) !important;
    border: 1.5px solid var(--bk-border-rest) !important;
    border-radius: var(--bk-radius-md) !important;
    padding: 10px 8px !important;
    text-align: center !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
    font-family: var(--bk-font-body) !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    color: var(--bk-text) !important;
    letter-spacing: 0 !important;
    min-height: 44px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.hours-list-item:hover {
    background: var(--bk-gold-light) !important;
    border-color: var(--bk-gold) !important;
    color: var(--bk-gold-dark) !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 3px 8px var(--bk-gold-glow) !important;
}

.hours-list-item.is-selected {
    background: var(--bk-gold) !important;
    color: #fff !important;
    border-color: var(--bk-gold) !important;
    box-shadow: 0 4px 12px var(--bk-gold-glow) !important;
    transform: translateY(-1px) !important;
}

.hours-list-item.is-disabled {
    background: #f5f5f5 !important;
    color: var(--bk-border-rest) !important;
    border-color: #ececec !important;
    cursor: not-allowed !important;
    opacity: 0.6 !important;
}

.hours-list-item.is-disabled:hover {
    transform: none !important;
    box-shadow: none !important;
    background: #f5f5f5 !important;
    border-color: #ececec !important;
}

/* === SEKCJA KLIENTA === */
.customer-section {
    /* style dziedziczone z sekcji */
}

/* === TELEFON (vue-tel-input) === */
.vue-tel-input {
    border: 1.5px solid var(--bk-border-rest) !important;
    border-radius: var(--bk-radius-md) !important;
    overflow: hidden !important;
    font-family: var(--bk-font-body) !important;
    transition: border-color 0.2s ease, box-shadow 0.2s ease !important;
    background: var(--bk-beige-bg) !important;
}

.vue-tel-input:focus-within {
    border-color: var(--bk-gold) !important;
    box-shadow: 0 0 0 3px var(--bk-gold-glow) !important;
    background: var(--bk-card-bg) !important;
}

.vti__dropdown {
    background: transparent !important;
    border-right: 1px solid var(--bk-border-rest) !important;
    padding: 10px 12px !important;
    cursor: pointer !important;
    transition: background 0.15s ease !important;
}

.vti__dropdown:hover {
    background: var(--bk-gold-xlight) !important;
}

.vti__selection {
    display: flex !important;
    align-items: center !important;
    color: var(--bk-text) !important;
    font-size: 14px !important;
}

.vti__flag {
    margin-right: 6px !important;
}

.vti__dropdown-arrow {
    color: var(--bk-text-medium) !important;
    margin-left: 4px !important;
    font-size: 10px !important;
}

.vti__dropdown-list {
    background: var(--bk-card-bg) !important;
    border: 1.5px solid var(--bk-gold) !important;
    border-top: none !important;
    max-height: 200px !important;
    overflow-y: auto !important;
    z-index: 1000 !important;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.10) !important;
}

.vti__dropdown-item {
    padding: 9px 14px !important;
    cursor: pointer !important;
    transition: background 0.15s ease !important;
    font-size: 13px !important;
    font-family: var(--bk-font-body) !important;
    color: var(--bk-text) !important;
}

.vti__dropdown-item:hover {
    background: var(--bk-gold-light) !important;
}

.vti__input {
    border: none !important;
    padding: 12px 14px !important;
    font-family: var(--bk-font-body) !important;
    font-size: 14px !important;
    letter-spacing: 0 !important;
    color: var(--bk-text) !important;
    flex: 1 !important;
    outline: none !important;
    background: transparent !important;
}

.vti__input::placeholder {
    color: var(--bk-text-light) !important;
}

/* === SEKCJA PŁATNOŚCI === */
.payment-section {
    /* style dziedziczone z sekcji */
}

.payment-methods {
    margin-bottom: 16px !important;
}

.payment-methods-item {
    background: var(--bk-beige-bg) !important;
    border: 1.5px solid var(--bk-border-rest) !important;
    border-radius: var(--bk-radius-md) !important;
    padding: 14px 16px !important;
    margin-bottom: 8px !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
}

.payment-methods-item:hover {
    background: var(--bk-gold-xlight) !important;
    border-color: var(--bk-gold) !important;
}

.payment-methods-item.is-active {
    background: var(--bk-gold-light) !important;
    border-color: var(--bk-gold) !important;
    box-shadow: 0 0 0 2px var(--bk-gold-glow) !important;
}

.payment-methods-item-wrapper {
    display: flex !important;
    align-items: center !important;
}

.payment-methods-item-icon {
    width: 22px !important;
    height: 22px !important;
    margin-right: 12px !important;
}

.payment-methods-item-name {
    font-family: var(--bk-font-body) !important;
    color: var(--bk-text) !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    letter-spacing: 0 !important;
}

/* === SWITCHER (toggle) === */
.switcher-wrapper {
    display: flex !important;
    align-items: center !important;
    margin-top: 14px !important;
    margin-bottom: 8px !important;
}

.switcher {
    width: 48px !important;
    height: 26px !important;
    background: var(--bk-border-rest) !important;
    border-radius: 26px !important;
    position: relative !important;
    cursor: pointer !important;
    transition: background 0.25s ease !important;
    margin-right: 12px !important;
    flex-shrink: 0 !important;
}

.switcher::before {
    content: "" !important;
    position: absolute !important;
    width: 20px !important;
    height: 20px !important;
    border-radius: 50% !important;
    background: #fff !important;
    top: 3px !important;
    left: 3px !important;
    transition: transform 0.25s ease !important;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.15) !important;
}

.switcher.is-active {
    background: var(--bk-gold) !important;
}

.switcher.is-active::before {
    transform: translateX(22px) !important;
}

.switcher-label {
    font-family: var(--bk-font-body) !important;
    color: var(--bk-text) !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
}

/* === PODSUMOWANIE PŁATNOŚCI === */
.payment-summary-section {
    margin-bottom: 16px !important;
    padding: 20px 24px !important;
    background: var(--bk-gold-light) !important;
    border-radius: var(--bk-radius-lg) !important;
    border: 1.5px solid var(--bk-border-rest) !important;
    box-shadow: none !important;
}

.payment-summary-quote {
    font-family: var(--bk-font-body) !important;
    color: var(--bk-text-medium) !important;
    font-size: 14px !important;
    letter-spacing: 0 !important;
    margin: 0 !important;
    text-align: center !important;
    line-height: 1.6 !important;
}

.payment-summary-price {
    color: var(--bk-gold-dark) !important;
    font-family: var(--bk-font-heading) !important;
    font-size: 22px !important;
    font-weight: 700 !important;
    letter-spacing: 1px !important;
}

/* === ZAPYTANIA (INQUIRIES) === */
.inquiries-list-section {
    /* style dziedziczone */
}

.inquiry {
    background: var(--bk-card-bg) !important;
    border: 1px solid var(--bk-border-rest) !important;
    border-radius: var(--bk-radius-md) !important;
    padding: 18px !important;
    margin-bottom: 12px !important;
    box-shadow: 0 1px 6px rgba(0, 0, 0, 0.05) !important;
}

.inquiry-heading {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    margin-bottom: 12px !important;
    padding-bottom: 10px !important;
    border-bottom: 1px solid var(--bk-border-rest) !important;
}

.inquiry-title {
    color: var(--bk-text) !important;
    font-family: var(--bk-font-heading) !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    margin: 0 !important;
}

.inquiry-price {
    color: var(--bk-gold-dark) !important;
    font-family: var(--bk-font-heading) !important;
    font-size: 18px !important;
    font-weight: 700 !important;
    letter-spacing: 1px !important;
}

.inquiry-datetime,
.inquiry-service,
.inquiry-custom-duration,
.inquiry-worker {
    margin-bottom: 8px !important;
    font-family: var(--bk-font-body) !important;
    color: var(--bk-text-medium) !important;
    font-size: 13px !important;
    letter-spacing: 0 !important;
}

.inquiry-label {
    color: var(--bk-gold) !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    font-size: 10px !important;
    letter-spacing: 0.5px !important;
}

.inquiry-actions {
    margin-top: 12px !important;
    padding-top: 12px !important;
    border-top: 1px solid var(--bk-border-rest) !important;
}

.inquiry-actions-details {
    color: var(--bk-gold) !important;
    font-family: var(--bk-font-body) !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    transition: color 0.2s ease !important;
}

.inquiry-actions-details:hover {
    color: var(--bk-gold-dark) !important;
}

/* === KOD RABATOWY === */
.bookero-plugin-discount-code-section {
    /* style dziedziczone */
}

.bookero-plugin-discount-code-wrapper input {
    margin-top: 0 !important;
}

/* === PRZYCISK GŁÓWNY (SUBMIT) === */
.submit-button {
    color: #fff !important;
    background: linear-gradient(135deg, var(--bk-gold) 0%, var(--bk-gold-hover) 100%) !important;
    border: none !important;
    border-radius: var(--bk-radius-pill) !important;
    letter-spacing: 3px !important;
    font-size: 14px !important;
    font-family: var(--bk-font-heading) !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    padding: 16px 32px !important;
    cursor: pointer !important;
    transition: all 0.25s ease !important;
    width: 100% !important;
    margin-top: 24px !important;
    box-shadow: 0 4px 16px var(--bk-gold-glow) !important;
}

.submit-button:hover {
    background: linear-gradient(135deg, var(--bk-gold-hover) 0%, var(--bk-gold-dark) 100%) !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 8px 24px var(--bk-gold-glow) !important;
}

.submit-button:active {
    transform: translateY(0) !important;
    box-shadow: 0 2px 8px var(--bk-gold-glow) !important;
}

/* === PRZYCISK WSTECZ === */
.back-button {
    color: var(--bk-text-medium) !important;
    background: transparent !important;
    border: 1.5px solid var(--bk-border-rest) !important;
    border-radius: var(--bk-radius-pill) !important;
    padding: 12px 24px !important;
    font-family: var(--bk-font-heading) !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 2px !important;
    font-size: 12px !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
    margin-top: 12px !important;
    width: 100% !important;
}

.back-button:hover {
    border-color: var(--bk-gold) !important;
    color: var(--bk-gold) !important;
    background: var(--bk-gold-xlight) !important;
    transform: none !important;
    box-shadow: none !important;
}

/* === BŁĘDY FORMULARZA === */
.bookero-plugin-form-errors,
.bookero-plugin-errors,
.form-errors,
.errors-section,
[class*="form-error"],
[class*="errors-wrapper"] {
    background: #fff5f5 !important;
    border: 1.5px solid #e05252 !important;
    border-left: 4px solid #e05252 !important;
    border-radius: var(--bk-radius-md) !important;
    padding: 16px 20px !important;
    margin-bottom: 20px !important;
    margin-top: 8px !important;
    animation: bkShake 0.4s ease-out !important;
}

@keyframes bkShake {
    0%, 100% { transform: translateX(0); }
    20%       { transform: translateX(-5px); }
    40%       { transform: translateX(5px); }
    60%       { transform: translateX(-4px); }
    80%       { transform: translateX(4px); }
}

.bookero-plugin-form-errors p,
.bookero-plugin-errors p,
.form-errors p,
[class*="form-error"] p,
[class*="errors-wrapper"] p {
    color: #c0392b !important;
    font-family: var(--bk-font-body) !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    letter-spacing: 0 !important;
    margin: 0 0 6px 0 !important;
    line-height: 1.5 !important;
}

.bookero-plugin-form-errors p:first-child,
.bookero-plugin-errors p:first-child,
.form-errors p:first-child,
[class*="form-error"] p:first-child,
[class*="errors-wrapper"] p:first-child {
    font-size: 13px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    color: #c0392b !important;
    margin-bottom: 8px !important;
}

.bookero-plugin-form-errors p:last-child,
.bookero-plugin-errors p:last-child,
.form-errors p:last-child,
[class*="form-error"] p:last-child,
[class*="errors-wrapper"] p:last-child {
    margin-bottom: 0 !important;
}

/* === INFORMACJA O WYMAGANYCH POLACH === */
.required-fields-notice {
    color: var(--bk-text-light) !important;
    font-family: var(--bk-font-body) !important;
    font-size: 11px !important;
    letter-spacing: 0 !important;
    margin-top: 12px !important;
    font-style: italic !important;
}

/* === TOOLTIP === */
.tooltip {
    font-family: var(--bk-font-body) !important;
    position: absolute !important;
    z-index: 10000 !important;
}

.tooltip-inner {
    background: var(--bk-text) !important;
    color: #fff !important;
    border-radius: var(--bk-radius-sm) !important;
    padding: 7px 11px !important;
    font-size: 12px !important;
    letter-spacing: 0 !important;
    line-height: 1.5 !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;
}

/* === POPUP WYNIK === */
.result-popup-overlay {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    background: rgba(45, 41, 38, 0.75) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    z-index: 10000 !important;
    padding: 20px !important;
    box-sizing: border-box !important;
    backdrop-filter: blur(3px) !important;
}

.result-popup {
    background: var(--bk-card-bg) !important;
    border-radius: var(--bk-radius-lg) !important;
    padding: 0 !important;
    max-width: 480px !important;
    width: 100% !important;
    position: relative !important;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.20) !important;
}

.result-popup-wrapper {
    padding: 40px 36px !important;
    text-align: center !important;
    position: relative !important;
}

.result-popup-close {
    position: absolute !important;
    top: 14px !important;
    right: 16px !important;
    color: var(--bk-text-light) !important;
    font-size: 24px !important;
    font-weight: bold !important;
    text-decoration: none !important;
    line-height: 1 !important;
    width: 32px !important;
    height: 32px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 50% !important;
    background: var(--bk-beige) !important;
    transition: all 0.2s ease !important;
}

.result-popup-close:hover {
    background: var(--bk-gold-light) !important;
    color: var(--bk-gold-dark) !important;
    transform: scale(1.1) !important;
}

.result-popup-close::before {
    content: "\00d7" !important;
    display: block !important;
}

.result-popup-icon {
    margin-bottom: 20px !important;
    display: flex !important;
    justify-content: center !important;
}

.result-popup-icon.is-waiting {
    background: var(--bk-gold-light) !important;
    border-radius: 50% !important;
    width: 72px !important;
    height: 72px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 auto 20px auto !important;
}

.result-popup-icon svg {
    width: 52px !important;
    height: 52px !important;
}

.result-popup-icon svg path,
.result-popup-icon.is-waiting svg path {
    fill: var(--bk-gold) !important;
}

.result-popup-header {
    color: var(--bk-text) !important;
    font-family: var(--bk-font-heading) !important;
    text-transform: uppercase !important;
    letter-spacing: 2px !important;
    font-size: 22px !important;
    margin: 0 0 16px 0 !important;
    font-weight: 600 !important;
}

.result-popup-content {
    color: var(--bk-text-medium) !important;
    font-family: var(--bk-font-body) !important;
    font-size: 15px !important;
    letter-spacing: 0 !important;
    line-height: 1.7 !important;
    margin: 0 !important;
}

/* ============================================================
   PROGRESS BAR - Wskaźnik kroków
   ============================================================ */
.bk-progress-bar {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 28px 16px 20px !important;
    max-width: 800px !important;
    margin: 0 auto !important;
}

.bk-progress-step {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 7px !important;
    position: relative !important;
}

.bk-progress-step-circle {
    width: 38px !important;
    height: 38px !important;
    border-radius: 50% !important;
    background: var(--bk-beige, #f9f0e7) !important;
    border: 2px solid var(--bk-border-rest, #e8d5c0) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    transition: all 0.3s ease !important;
}

.bk-progress-step-number {
    font-family: 'Oswald', sans-serif !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    color: var(--bk-text-light, #a89080) !important;
    line-height: 1 !important;
}

.bk-progress-step-label {
    font-family: 'Open Sans', sans-serif !important;
    font-size: 10px !important;
    font-weight: 700 !important;
    color: var(--bk-text-light, #a89080) !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    white-space: nowrap !important;
}

/* Aktywny krok */
.bk-progress-step.is-active .bk-progress-step-circle {
    background: var(--bk-gold, #d29f68) !important;
    border-color: var(--bk-gold, #d29f68) !important;
    box-shadow: 0 0 0 5px rgba(210, 159, 104, 0.20) !important;
}

.bk-progress-step.is-active .bk-progress-step-number {
    color: #fff !important;
}

.bk-progress-step.is-active .bk-progress-step-label {
    color: var(--bk-gold, #d29f68) !important;
    font-weight: 700 !important;
}

/* Ukończony krok */
.bk-progress-step.is-done .bk-progress-step-circle {
    background: var(--bk-gold-hover, #c08f58) !important;
    border-color: var(--bk-gold-hover, #c08f58) !important;
}

.bk-progress-step.is-done .bk-progress-step-number {
    color: #fff !important;
}

.bk-progress-step.is-done .bk-progress-step-label {
    color: var(--bk-text-medium, #6b5c52) !important;
}

/* Łączniki */
.bk-progress-connector {
    flex: 1 !important;
    height: 2px !important;
    background: var(--bk-border-rest, #e8d5c0) !important;
    margin: 0 6px !important;
    margin-bottom: 24px !important;
    transition: background 0.3s ease !important;
    min-width: 20px !important;
}

.bk-progress-connector.is-done {
    background: var(--bk-gold-hover, #c08f58) !important;
}

/* ============================================================
   RESPONSYWNOŚĆ - 768px (tablet)
   ============================================================ */
@media (max-width: 768px) {
    .bookero-plugin-form-wrapper {
        padding: 0 !important;
    }

    .services-section,
    .workers-section,
    .dates-section,
    .params-section,
    .hours-section,
    .customer-section,
    .payment-section,
    .reservation-type-section,
    .bookero-plugin-discount-code-section,
    .inquiries-list-section {
        padding: 18px !important;
        border-radius: var(--bk-radius-md) !important;
    }

    .submit-button {
        font-size: 13px !important;
        letter-spacing: 2px !important;
        padding: 14px 24px !important;
    }

    .calendar-days-list-cell {
        padding: 8px 2px !important;
        font-size: 12px !important;
        min-height: 36px !important;
    }

    .hours-list {
        grid-template-columns: repeat(auto-fill, minmax(75px, 1fr)) !important;
        gap: 7px !important;
    }

    .hours-list-item {
        padding: 9px 6px !important;
        font-size: 12px !important;
    }

    .inquiry-heading {
        flex-direction: column !important;
        align-items: flex-start !important;
    }

    .inquiry-price {
        margin-top: 8px !important;
    }

    .vti__dropdown-list {
        font-size: 11px !important;
    }

    .payment-methods-item-name {
        font-size: 13px !important;
    }

    .result-popup-wrapper {
        padding: 30px 20px !important;
    }

    .result-popup-header {
        font-size: 18px !important;
    }

    .result-popup-content {
        font-size: 14px !important;
    }
}

/* ============================================================
   RESPONSYWNOŚĆ - 480px (telefon)
   ============================================================ */
@media (max-width: 480px) {
    .services-section,
    .workers-section,
    .dates-section,
    .params-section,
    .hours-section,
    .customer-section,
    .payment-section,
    .reservation-type-section,
    .bookero-plugin-discount-code-section,
    .inquiries-list-section {
        padding: 14px !important;
        margin-bottom: 12px !important;
    }

    .calendar-nav-month {
        font-size: 12px !important;
        letter-spacing: 1px !important;
    }

    .calendar-days-heading-cell {
        font-size: 9px !important;
        padding: 7px 2px !important;
    }

    .calendar-days-list-cell {
        padding: 7px 2px !important;
        font-size: 11px !important;
        min-height: 32px !important;
    }

    .hours-list {
        grid-template-columns: repeat(3, 1fr) !important;
        gap: 6px !important;
    }

    .submit-button,
    .back-button {
        width: 100% !important;
        display: block !important;
    }

    .multiselect__content-wrapper {
        max-height: 200px !important;
    }

    .bk-progress-step-label {
        font-size: 9px !important;
        letter-spacing: 0 !important;
    }

    .bk-progress-step-circle {
        width: 30px !important;
        height: 30px !important;
    }

    .bk-progress-step-number {
        font-size: 12px !important;
    }

    .bk-progress-connector {
        margin: 0 4px !important;
        margin-bottom: 20px !important;
    }
}

/* ============================================================
   RESPONSYWNOŚĆ - 360px (małe telefony)
   ============================================================ */
@media (max-width: 360px) {
    .services-section,
    .workers-section,
    .dates-section,
    .params-section,
    .hours-section,
    .customer-section,
    .payment-section,
    .reservation-type-section,
    .bookero-plugin-discount-code-section,
    .inquiries-list-section {
        padding: 10px !important;
    }

    .hours-list {
        grid-template-columns: repeat(2, 1fr) !important;
    }

    .calendar-days-list-cell {
        min-height: 28px !important;
        font-size: 10px !important;
    }

    .bookero-plugin-form-wrapper {
        font-size: 13px !important;
    }
}