/**
 * Rota Bizden corporate frontend palette.
 * Scoped to Rota/MEC UI so theme and commerce internals keep their behavior.
 */
:root {
    --rota-brand-red: #e10a30;
    --rota-brand-navy: #243447;
    --rota-brand-surface: #f8f9fa;
    --rota-brand-text: #222222;
    --rota-brand-white: #ffffff;
}

/* Tour cards: title ribbons, categories, prices and primary actions. */
body .rota-tour-title-badge,
body .rota-tour-title-badge:visited,
body .rota-tour-title-badge:active,
body .rota-tour-enhanced:not(:hover) .rota-tour-title-badge {
    background: var(--rota-brand-navy) !important;
    box-shadow: 0 8px 18px rgba(36, 52, 71, .2) !important;
    color: var(--rota-brand-white) !important;
}

body .rota-tour-title-badge:hover,
body .rota-tour-title-badge:focus,
body .rota-tour-enhanced:hover .rota-tour-title-badge,
body .rota-tour-image-wrapper:hover .rota-tour-title-badge,
body .mec-event-image:hover .rota-tour-title-badge,
body .mec-event-image-wrap:hover .rota-tour-title-badge,
body .mec-event-thumbnail:hover .rota-tour-title-badge {
    background: var(--rota-brand-red) !important;
    color: var(--rota-brand-white) !important;
}

body .rota-tour-enhanced .mec-event-label-captions,
body .rota-tour-enhanced .mec-label,
body .rota-tour-flight-ribbon {
    background: var(--rota-brand-navy) !important;
    color: var(--rota-brand-white) !important;
}

body .rota-tour-badge,
body .rota-tour-promo-badge {
    background: var(--rota-brand-red) !important;
    box-shadow: 0 8px 18px rgba(225, 10, 48, .2) !important;
    color: var(--rota-brand-white) !important;
}

body .rota-tour-new-price,
body .rota-tour-current-price {
    color: var(--rota-brand-red) !important;
}

body .rota-tour-enhanced .mec-booking-button.rota-tour-review-button,
body .rota-tour-card-actions .mec-booking-button,
body.single-mec-events .mec-booking-button-register.mec-booking-button,
body.single-mec_event .mec-booking-button-register.mec-booking-button,
body .mec-wrap .mec-booking-button-register,
body .mec-wrap button.mec-book-form-next-button {
    background: var(--rota-brand-red) !important;
    border-color: var(--rota-brand-red) !important;
    color: var(--rota-brand-white) !important;
}

body .rota-tour-enhanced .mec-booking-button.rota-tour-review-button:hover,
body .rota-tour-enhanced .mec-booking-button.rota-tour-review-button:focus,
body .rota-tour-card-actions .mec-booking-button:hover,
body .rota-tour-card-actions .mec-booking-button:focus,
body.single-mec-events .mec-booking-button-register.mec-booking-button:hover,
body.single-mec-events .mec-booking-button-register.mec-booking-button:focus,
body.single-mec_event .mec-booking-button-register.mec-booking-button:hover,
body.single-mec_event .mec-booking-button-register.mec-booking-button:focus,
body .mec-wrap .mec-booking-button-register:hover,
body .mec-wrap .mec-booking-button-register:focus,
body .mec-wrap button.mec-book-form-next-button:hover,
body .mec-wrap button.mec-book-form-next-button:focus {
    background: var(--rota-brand-navy) !important;
    border-color: var(--rota-brand-navy) !important;
    color: var(--rota-brand-white) !important;
}

/* WhatsApp remains the same link; only its presentation changes. */
body .rota-tour-card-whatsapp,
body .rota-mobile-whatsapp,
body .rota-member-shell .rota-action-row a.rota-btn.rota-btn-whatsapp,
body .rota-member-shell a.rota-btn-whatsapp,
body .rota-booking-lookup .rota-action-row a.rota-btn.rota-btn-whatsapp,
body .rota-booking-lookup a.rota-btn-whatsapp {
    align-items: center !important;
    background: var(--rota-brand-red) !important;
    border-color: var(--rota-brand-red) !important;
    box-shadow: 0 8px 18px rgba(225, 10, 48, .18) !important;
    color: var(--rota-brand-white) !important;
    display: inline-flex !important;
    gap: 8px;
    justify-content: center !important;
}

body .rota-tour-card-whatsapp::before,
body .rota-mobile-whatsapp::before,
body .rota-member-shell a.rota-btn-whatsapp::before,
body .rota-booking-lookup a.rota-btn-whatsapp::before {
    color: var(--rota-brand-white);
    content: "\f232";
    flex: 0 0 auto;
    font-family: FontAwesome;
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: 1;
}

body .rota-tour-card-whatsapp:hover,
body .rota-tour-card-whatsapp:focus,
body .rota-mobile-whatsapp:hover,
body .rota-mobile-whatsapp:focus,
body .rota-member-shell .rota-action-row a.rota-btn.rota-btn-whatsapp:hover,
body .rota-member-shell .rota-action-row a.rota-btn.rota-btn-whatsapp:focus,
body .rota-booking-lookup .rota-action-row a.rota-btn.rota-btn-whatsapp:hover,
body .rota-booking-lookup .rota-action-row a.rota-btn.rota-btn-whatsapp:focus {
    background: var(--rota-brand-navy) !important;
    border-color: var(--rota-brand-navy) !important;
    color: var(--rota-brand-white) !important;
}

/* Single-tour information, content tabs and FAQ. */
body .rota-tour-tab {
    background: var(--rota-brand-surface) !important;
    border-color: #d8dee5 !important;
    border-top-color: var(--rota-brand-navy) !important;
}

body .rota-tour-tab-icon,
body .mec-faq-list .mec-faq-item > .mec-faq-title::before {
    background: var(--rota-brand-navy) !important;
    color: var(--rota-brand-white) !important;
}

body .rota-tour-tab-label,
body .rota-day-item summary,
body .mec-faq-list .mec-faq-item > .mec-faq-title h4 {
    color: var(--rota-brand-navy) !important;
}

body .rota-tour-price-card h3,
body .rota-price-box h3,
body .rota-price-sidebar .rota-price-box h3,
body .rota-extra-tab-buttons {
    background: var(--rota-brand-navy) !important;
    color: var(--rota-brand-white) !important;
}

body .rota-tour-reserve-button,
body .rota-departure-points li a {
    background: var(--rota-brand-red) !important;
    border-color: var(--rota-brand-red) !important;
    color: var(--rota-brand-white) !important;
}

body .rota-content-tab-buttons button {
    background: #1f3555 !important;
    border-color: #1f3555 !important;
    color: var(--rota-brand-white) !important;
    padding: 9px 12px;
    transition: all .25s ease;
}

body.single-mec-events .rota-content-tab-buttons button.is-active,
body.single-mec-events .rota-content-tab-buttons button.is-active:hover,
body.single-mec-events .rota-content-tab-buttons button.is-active:focus,
body.single-mec_event .rota-content-tab-buttons button.is-active,
body.single-mec_event .rota-content-tab-buttons button.is-active:hover,
body.single-mec_event .rota-content-tab-buttons button.is-active:focus,
body .rota-content-tab-buttons button.is-active {
    background: var(--rota-brand-red) !important;
    border-color: var(--rota-brand-red) !important;
    color: var(--rota-brand-white) !important;
}

body .rota-tour-reserve-button:hover,
body .rota-tour-reserve-button:focus,
body .rota-departure-points li a:hover,
body .rota-departure-points li a:focus {
    background: var(--rota-brand-navy) !important;
    border-color: var(--rota-brand-navy) !important;
    color: var(--rota-brand-white) !important;
}

body .rota-content-tab-buttons button:hover,
body .rota-content-tab-buttons button:focus {
    background: #2b4770 !important;
    border-color: #2b4770 !important;
    color: var(--rota-brand-white) !important;
}

body.single-mec-events .rota-content-tab-buttons button.is-active:hover,
body.single-mec-events .rota-content-tab-buttons button.is-active:focus,
body.single-mec_event .rota-content-tab-buttons button.is-active:hover,
body.single-mec_event .rota-content-tab-buttons button.is-active:focus,
body .rota-content-tab-buttons button.is-active:hover,
body .rota-content-tab-buttons button.is-active:focus {
    background: var(--rota-brand-red) !important;
    border-color: var(--rota-brand-red) !important;
    color: var(--rota-brand-white) !important;
}

body .rota-content-tab-buttons {
    gap: 6px !important;
}

body .rota-extra-tab-buttons button {
    background: #1f3555 !important;
    border-color: #1f3555 !important;
    color: var(--rota-brand-white) !important;
    transition: all .25s ease;
}

body .rota-extra-tab-buttons button:hover,
body .rota-extra-tab-buttons button:focus {
    background: #2b4770 !important;
    border-color: #2b4770 !important;
    color: var(--rota-brand-white) !important;
}

body .rota-extra-tab-buttons button.is-active,
body .rota-extra-tab-buttons button.is-active:hover,
body .rota-extra-tab-buttons button.is-active:focus {
    background: var(--rota-brand-red) !important;
    border-color: var(--rota-brand-red) !important;
    color: var(--rota-brand-white) !important;
}

body .rota-day-program-info {
    align-items: center !important;
    display: flex !important;
    flex-wrap: wrap !important;
    font-size: 16px !important;
    gap: 6px 22px !important;
    line-height: 1.45 !important;
}

body .rota-day-program-info-item {
    align-items: center !important;
    display: inline-flex !important;
    gap: 7px !important;
    white-space: nowrap !important;
}

body .rota-day-program-info-item span[aria-hidden="true"] {
    font-size: 22px !important;
    line-height: 1 !important;
}

body .rota-content-tab-buttons,
body .rota-departure-points li,
body .rota-booking-step-head,
body .rota-room-selection-message {
    background: var(--rota-brand-surface) !important;
}

/* Booking and lodging visual accents only. */
body .rota-booking-step-head {
    border-left-color: var(--rota-brand-navy) !important;
}

body .rota-booking-step-head > span,
body .rota-add-room {
    background: var(--rota-brand-navy) !important;
    color: var(--rota-brand-white) !important;
}

body .rota-bed-option.is-selected {
    background: var(--rota-brand-surface) !important;
    border-color: var(--rota-brand-navy) !important;
    box-shadow: 0 0 0 2px rgba(36, 52, 71, .12) !important;
}

body .rota-bed-icon,
body .rota-room-selection-message strong {
    color: var(--rota-brand-navy) !important;
}

/* Member and reservation panels. Semantic status badge colors are preserved. */
body .rota-member-shell .rota-btn:not(.rota-btn-whatsapp),
body .rota-member-shell .rota-link-button,
body .rota-booking-lookup .rota-btn:not(.rota-btn-whatsapp),
body .rota-booking-form button {
    background: var(--rota-brand-red) !important;
    border-color: var(--rota-brand-red) !important;
    color: var(--rota-brand-white) !important;
}

body .rota-member-shell .rota-btn:not(.rota-btn-whatsapp):hover,
body .rota-member-shell .rota-link-button:hover,
body .rota-booking-lookup .rota-btn:not(.rota-btn-whatsapp):hover,
body .rota-booking-form button:hover {
    background: var(--rota-brand-navy) !important;
    border-color: var(--rota-brand-navy) !important;
    color: var(--rota-brand-white) !important;
}

/* Optional Click to Chat floating button, when enabled. */
body .ht-ctc-chat .ctc_s_3_1 .ht_ctc_padding,
body .ht-ctc-chat .ctc_s_3_1 .ctc_cta,
body .ht-ctc-chat .ctc_cta_stick {
    background-color: var(--rota-brand-red) !important;
    color: var(--rota-brand-white) !important;
}

body .ht-ctc-chat .ctc_s_3_1:hover .ht_ctc_padding,
body .ht-ctc-chat .ctc_s_3_1:hover .ctc_cta,
body .ht-ctc-chat .ctc_s_3_1:hover .ctc_cta_stick {
    background-color: var(--rota-brand-navy) !important;
}

body .ht-ctc-chat .ctc_s_3 svg stop,
body .ht-ctc-chat .ctc_s_3_1 svg stop {
    stop-color: var(--rota-brand-red) !important;
}

body .ht-ctc-chat .ctc_s_3:hover svg stop,
body .ht-ctc-chat .ctc_s_3_1:hover svg stop {
    stop-color: var(--rota-brand-navy) !important;
}

@media (max-width: 767px) {
    body .rota-tour-card-actions a,
    body .rota-mobile-contact-bar a {
        min-height: 48px;
    }

    body .rota-tour-card-whatsapp {
        font-size: 12px !important;
        white-space: nowrap;
    }

    body .rota-tour-title-badge {
        font-size: 14px !important;
        max-width: calc(100% - 28px) !important;
    }

    body .rota-member-shell .rota-btn,
    body .rota-booking-lookup .rota-btn {
        box-sizing: border-box;
        justify-content: center;
        width: 100%;
    }
}
