/* Visual refinement shared by service registration and booking fields. */

:is(.acc-box, .cre-box, .banho-porte, .tosa-card, .stay-rules) {
    --sps-ink: #392014;
    --sps-muted: #806c60;
    --sps-line: #eadfd6;
    --sps-soft: #fffaf6;
    --sps-brand: #f2935c;
    --sps-brand-dark: #d8733d;
    --sps-focus: 0 0 0 3px rgba(242, 147, 92, .18);
}

/* Registration forms */
:is(.acc-box, .cre-box, .banho-porte, .tosa-card, .stay-rules) {
    border: 1px solid var(--sps-line) !important;
    border-radius: 18px !important;
    background: #fff !important;
    box-shadow: 0 10px 30px rgba(70, 39, 22, .06) !important;
}

:is(.acc-box, .cre-box, .stay-rules) {
    padding: 24px !important;
}

:is(.section-title, .cre-box-title, .tosa-section-title, .stay-rules h3) {
    color: #392014 !important;
    font-weight: 750 !important;
    letter-spacing: -.01em;
}

:is(.section-title, .cre-box-title, .tosa-section-title)::before {
    content: "";
    width: 4px;
    height: 20px;
    flex: 0 0 4px;
    border-radius: 999px;
    background: linear-gradient(180deg, #f8b37f, #e87f46);
}

:is(.acc-box, .cre-box, .banho-porte, .tosa-card, .stay-rules) label {
    color: #5b4032;
    font-weight: 650;
}

:is(.acc-box, .cre-box, .banho-porte, .tosa-card, .stay-rules)
    :is(input:not([type="checkbox"]):not([type="radio"]), select, textarea) {
    min-height: 44px;
    border: 1px solid #dfd2c8 !important;
    border-radius: 11px !important;
    background-color: #fffdfb !important;
    color: #392014 !important;
    box-shadow: none !important;
    transition: border-color .18s ease, box-shadow .18s ease, background-color .18s ease;
}

:is(.acc-box, .cre-box, .banho-porte, .tosa-card, .stay-rules)
    :is(input:not([type="checkbox"]):not([type="radio"]), select, textarea):hover {
    border-color: #cdb9aa !important;
}

:is(.acc-box, .cre-box, .banho-porte, .tosa-card, .stay-rules)
    :is(input:not([type="checkbox"]):not([type="radio"]), select, textarea):focus {
    border-color: var(--sps-brand) !important;
    background-color: #fff !important;
    box-shadow: var(--sps-focus) !important;
    outline: 0;
}

:is(.acc-box, .cre-box, .banho-porte, .tosa-card, .stay-rules)
    :is(input[type="checkbox"], input[type="radio"]) {
    accent-color: var(--sps-brand);
}

.valores-porte-wrapper {
    gap: 16px !important;
}

.valores-porte-item,
.banho-porte,
.tosa-price-item {
    border: 1px solid #eadfd6 !important;
    border-radius: 16px !important;
    background: linear-gradient(145deg, #fff 0%, #fffaf6 100%) !important;
    box-shadow: 0 5px 18px rgba(70, 39, 22, .045) !important;
    transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease !important;
}

.valores-porte-item:hover,
.banho-porte:hover,
.tosa-price-item:hover {
    transform: translateY(-2px);
    border-color: #efb88f !important;
    box-shadow: 0 10px 24px rgba(70, 39, 22, .08) !important;
}

:is(.valores-porte-item, .banho-porte) .porte-title {
    color: #392014 !important;
    font-weight: 750 !important;
}

.incluso-item,
.acc-chip {
    border: 1px solid #ead8c9 !important;
    background: #fff8f1 !important;
    color: #563727 !important;
    box-shadow: 0 2px 8px rgba(70, 39, 22, .04);
}

.service-interval-card,
.exigencias-card,
.dc-exigencias-card,
.dc-pacotes-box {
    border: 1px solid #eadfd6 !important;
    border-radius: 16px !important;
    background: #fffaf6 !important;
}

.service-interval-choice {
    border: 1px solid #e4d5c9;
    border-radius: 999px;
    padding: 9px 14px;
    background: #fff;
    cursor: pointer;
    transition: border-color .18s ease, background-color .18s ease;
}

.service-interval-choice:hover {
    border-color: #f0a778;
    background: #fff7ef;
}

.extra-item,
.pacote-card {
    border: 1px solid #eadfd6 !important;
    border-radius: 16px !important;
    background: #fffaf6 !important;
    box-shadow: 0 5px 18px rgba(70, 39, 22, .04);
}

.btn-add-banho-tosa,
.pacote-add-btn,
.vacina-add-btn,
.dc-vacina-add-btn,
.stay-rules .btn-outline-primary {
    border: 1px solid #f2935c !important;
    border-radius: 999px !important;
    background: #f2935c !important;
    color: #fff !important;
    font-weight: 700 !important;
    box-shadow: 0 7px 16px rgba(242, 147, 92, .22);
}

.btn-add-banho-tosa:hover,
.pacote-add-btn:hover,
.vacina-add-btn:hover,
.dc-vacina-add-btn:hover,
.stay-rules .btn-outline-primary:hover {
    border-color: #d8733d !important;
    background: #d8733d !important;
    color: #fff !important;
}

.extras-banho #btnAddExtra,
.extras-banho #btnAddExtra:visited {
    border-color: #f2935c !important;
    background-color: #f2935c !important;
    color: #fff !important;
}

.extras-banho #btnAddExtra:hover,
.extras-banho #btnAddExtra:focus,
.extras-banho #btnAddExtra:active {
    border-color: #d8733d !important;
    background-color: #d8733d !important;
    color: #fff !important;
    box-shadow: 0 10px 22px rgba(216, 115, 61, .28) !important;
}

/* Stay pricing and calendar rules */
.stay-rules {
    margin-top: 28px !important;
}

.stay-rules h3 {
    margin: 0 0 7px !important;
    font-size: 1.25rem !important;
}

.stay-rules h4 {
    margin: 28px 0 8px !important;
    padding-top: 22px;
    border-top: 1px solid #f0e7df;
    color: #4a2c1d;
    font-size: 1rem !important;
    font-weight: 750;
}

.stay-rules-note {
    max-width: 920px;
    color: #806c60 !important;
    font-size: .86rem !important;
    line-height: 1.55;
}

.stay-grid {
    gap: 14px !important;
}

.stay-rule-row {
    gap: 12px !important;
    margin-bottom: 12px !important;
    padding: 16px !important;
    border: 1px solid #eee4dc;
    border-radius: 14px !important;
    background: #fffaf6 !important;
}

.stay-rule-row label,
.stay-grid label {
    margin-bottom: 6px !important;
    color: #6c5548 !important;
    font-size: .76rem !important;
    letter-spacing: .01em;
}

.stay-linked-option {
    align-items: center !important;
    margin: 10px 0 !important;
    padding: 16px !important;
    border: 1px solid #eadfd6;
    border-radius: 14px !important;
    background: #fffaf6 !important;
}

.stay-linked-option:has([data-linked-enabled]:checked) {
    border-color: #f0aa7c;
    background: #fff6ed !important;
    box-shadow: 0 0 0 3px rgba(242, 147, 92, .1);
}

/* Grooming variations */
.tosa-variation-config > .border {
    border: 1px solid #eadfd6 !important;
    border-radius: 16px !important;
    background: #fffaf6;
    box-shadow: 0 4px 16px rgba(70, 39, 22, .04);
    transition: opacity .18s ease, border-color .18s ease;
}

.tosa-variation-config > .border:not(.opacity-50) {
    border-color: #efbd98 !important;
    background: linear-gradient(145deg, #fff 0%, #fff8f1 100%);
}

.tosa-variation-config .row > [class*="col-"] {
    padding: 14px;
    border: 1px solid #eee5de;
    border-radius: 13px;
    background: #fff;
}

.tosa-variation-config .is-invalid {
    border-color: #dc3545 !important;
    box-shadow: 0 0 0 3px rgba(220, 53, 69, .12) !important;
}

/* Public booking sidebars */
:is(#hotelBookingSidebar, #daycareBookingSidebar, #serviceBookingSidebar) {
    --booking-ink: #442619;
    --booking-muted: #80685a;
    --booking-line: #eadfd6;
    --booking-brand: #f2935c;
}

:is(#hotelBookingSidebar, #daycareBookingSidebar, #serviceBookingSidebar) .bk-card {
    border: 1px solid var(--booking-line) !important;
    border-radius: 22px !important;
    background: linear-gradient(180deg, #fffdfb 0%, #fff9f4 100%) !important;
    box-shadow: 0 20px 50px rgba(67, 37, 21, .12) !important;
}

:is(#hotelBookingSidebar, #daycareBookingSidebar, #serviceBookingSidebar) .bk-head {
    padding-bottom: 14px;
    border-bottom: 1px solid #f0e7df;
}

:is(#hotelBookingSidebar, #daycareBookingSidebar, #serviceBookingSidebar) .bk-nav {
    border-color: #e5d8ce !important;
    background: #fff !important;
    box-shadow: 0 4px 12px rgba(70, 39, 22, .06);
}

:is(#hotelBookingSidebar, #daycareBookingSidebar, #serviceBookingSidebar) .bk-nav:hover {
    border-color: var(--booking-brand) !important;
    background: #fff7ef !important;
}

:is(#hotelBookingSidebar, #daycareBookingSidebar, #serviceBookingSidebar) .bk-section-title {
    margin: 20px 0 8px !important;
    color: var(--booking-ink) !important;
    font-size: .82rem !important;
    font-weight: 750 !important;
    letter-spacing: .015em;
}

:is(#hotelBookingSidebar, #daycareBookingSidebar, #serviceBookingSidebar)
    :is(.bk-pet-button, select.form-control, .bk-date-trigger) {
    border: 1px solid #dfd3ca !important;
    border-radius: 13px !important;
    background-color: #fff !important;
    box-shadow: 0 5px 14px rgba(70, 39, 22, .05) !important;
}

:is(#hotelBookingSidebar, #daycareBookingSidebar, #serviceBookingSidebar)
    :is(.bk-pet-button, select.form-control, .bk-date-trigger):focus {
    border-color: var(--booking-brand) !important;
    box-shadow: 0 0 0 3px rgba(242, 147, 92, .18) !important;
    outline: 0;
}

:is(#hotelBookingSidebar, #daycareBookingSidebar) #additional_pet_ids {
    width: 100%;
    height: auto !important;
    min-height: 94px;
    max-height: 154px;
    padding: 7px !important;
    overflow-y: auto;
    appearance: auto;
    background-image: none !important;
}

:is(#hotelBookingSidebar, #daycareBookingSidebar) #additional_pet_ids option {
    margin: 2px 0;
    padding: 9px 11px;
    border-radius: 9px;
    color: #5b4032;
    font-weight: 650;
}

:is(#hotelBookingSidebar, #daycareBookingSidebar) #additional_pet_ids option:checked {
    background: linear-gradient(90deg, #f2935c, #f6ad7b);
    color: #fff;
}

:is(#hotelBookingSidebar, #daycareBookingSidebar) #additional_pet_ids option[hidden] {
    display: none;
}

:is(#hotelBookingSidebar, #daycareBookingSidebar) #additional_pet_ids + .bk-chat-note {
    width: 100% !important;
    margin: 7px 0 0 !important;
    text-align: left !important;
    color: var(--booking-muted) !important;
}

:is(#hotelBookingSidebar, #daycareBookingSidebar, #serviceBookingSidebar) .bk-chip {
    border-color: #e6d9cf !important;
    border-radius: 11px !important;
    box-shadow: 0 3px 10px rgba(70, 39, 22, .04);
}

:is(#hotelBookingSidebar, #daycareBookingSidebar, #serviceBookingSidebar) .bk-chip.active {
    border-color: var(--booking-brand) !important;
    background: var(--booking-brand) !important;
    box-shadow: 0 7px 16px rgba(242, 147, 92, .22);
}

:is(#hotelBookingSidebar, #daycareBookingSidebar, #serviceBookingSidebar) .bk-total {
    margin: 18px 0 14px !important;
    padding-top: 16px;
    border-top: 1px solid #eee4dc;
    color: var(--booking-ink) !important;
    font-size: 1.5rem !important;
}

:is(#hotelBookingSidebar, #daycareBookingSidebar, #serviceBookingSidebar) .bk-primary {
    width: 100% !important;
    border: 0 !important;
    background: linear-gradient(135deg, #f2935c, #f6ad7b) !important;
    color: #2f170d !important;
    font-weight: 750 !important;
    box-shadow: 0 10px 22px rgba(242, 147, 92, .28);
}

:is(#hotelBookingSidebar, #daycareBookingSidebar, #serviceBookingSidebar) .bk-primary:hover {
    transform: translateY(-1px);
    filter: saturate(1.06);
}

:is(#hotelBookingSidebar, #daycareBookingSidebar, #serviceBookingSidebar) .bk-secondary {
    width: 100% !important;
    border-color: #dfd2c8 !important;
    background: #fff !important;
}

:is(#hotelBookingSidebar, #daycareBookingSidebar) #linkedStayServices [data-linked-option] {
    margin: 9px 0;
    padding: 12px;
    border: 1px solid #eadfd6;
    border-radius: 12px;
    background: #fff;
}

@media (max-width: 900px) {
    .stay-rules {
        padding: 18px !important;
    }

    .stay-daily-band-row,
    .stay-rule-row {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    .stay-linked-option {
        align-items: stretch !important;
        flex-direction: column;
    }

    .stay-linked-price {
        width: 100% !important;
    }
}

@media (max-width: 575px) {
    :is(.acc-box, .cre-box, .stay-rules) {
        padding: 16px !important;
        border-radius: 15px !important;
    }

    .stay-daily-band-row,
    .stay-rule-row,
    .stay-grid {
        grid-template-columns: 1fr !important;
    }

    :is(#hotelBookingSidebar, #daycareBookingSidebar, #serviceBookingSidebar) .bk-card {
        border-radius: 18px !important;
    }
}
