/* Shared interaction layer. Content stays visible when JavaScript is unavailable. */
:root { --th-effects-ready: 1; --th-ease: cubic-bezier(.22, 1, .36, 1); }
.th-reveal { visibility: visible !important; animation-name: th-rise; animation-duration: .55s; animation-fill-mode: both; animation-timing-function: var(--th-ease); }
.th-reveal.th-animated { animation-name: th-rise; }
.hotel-selection-card.th-reveal { opacity: 1 !important; }
@keyframes th-rise { from { opacity: .7; transform: translateY(16px); } to { opacity: 1; transform: none; } }
.th-reveal:focus-within { animation: none !important; opacity: 1 !important; transform: none !important; }
.bc_wrap .btn, #app .btn, .hotel-selection-detail {
    transition: background-color .18s ease, border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}
.bc_wrap .btn:active:not(:disabled), #app .btn:active:not(:disabled) { transform: translateY(1px); }
.bc_wrap .btn > .fa, #app .btn > .fa { margin-inline-end: .45em; }
.bc_wrap .btn:disabled, #app .btn:disabled { cursor: not-allowed; }
.bc_wrap :is(a, button, input, select, textarea):focus-visible,
#app :is(a, button, input, select, textarea):focus-visible {
    outline: 3px solid var(--th-primary, #087f8c); outline-offset: 3px;
}
.bc_wrap .hotel-selection-card { border-radius: 16px; box-shadow: 0 4px 18px rgba(18,55,67,.06); transition: box-shadow .24s ease, border-color .24s ease; }
.bc_wrap .hotel-selection-card:focus-within { border-color: var(--th-primary, #087f8c); box-shadow: 0 8px 28px rgba(18,55,67,.13); }
.bc_wrap .hotel-selection-image { overflow: hidden; border-radius: 15px 15px 0 0; }
.bc_wrap .hotel-selection-image img { transition: transform .6s var(--th-ease); }
.bc_wrap .hotel-selection-detail .fa-arrow-right { transition: transform .2s ease; }
.bc_wrap .hotel-selection-detail:focus-visible .fa-arrow-right { transform: translateX(3px); }
.bc_wrap .g-form-control { border-radius: 16px; }
/* The configured homepage has a custom hero rather than the standard search block. */
.bc_wrap .home-modern .home-highlights { gap: 10px; }
.bc_wrap .home-modern .home-highlights > span {
    display: inline-flex; align-items: center; gap: 9px; padding: 8px 13px;
    border: 1px solid rgba(255,218,138,.4); border-radius: 24px;
    background: rgba(18,55,67,.7); color: #fff; line-height: 1.4;
}
.bc_wrap .home-modern .home-highlights > span > .fa {
    display: inline-grid; place-items: center; width: 24px; height: 24px;
    margin: 0; border-radius: 50%; background: rgba(255,218,138,.15);
    color: #ffda8a; font-size: 13px;
}
.bc_wrap .home-modern h2.title, .bc_wrap .home-modern h3.title {
    position: relative; padding-inline-start: 17px;
}
.bc_wrap .home-modern h2.title::before, .bc_wrap .home-modern h3.title::before {
    content: ''; position: absolute; inset-inline-start: 0; top: .15em; bottom: .15em;
    width: 4px; border-radius: 4px; background: #087f8c;
}
#app .main-content .panel { border-radius: 14px; }
#app .main-content .panel .panel-title { color: var(--th-ink, #123743); }
#app .dashboard-page .welcome-title { color: var(--th-ink, #123743); font-size: clamp(20px, 2vw, 28px); font-weight: 600; letter-spacing: -.5px; text-transform: none !important; }
#app .dashboard-report-card { position: relative; border: 1px solid var(--th-border, #dce8eb); border-radius: 16px; box-shadow: 0 5px 20px rgba(18,55,67,.06); }
#app .dashboard-report-card .card-media { border-radius: 14px; }
#app .dashboard-report-card .card-media i { opacity: .85; }
#app .dashboard-report-card .card-amount { font-variant-numeric: tabular-nums; letter-spacing: -.7px; }
#app .main-sidebar .main-menu a { transition: background-color .18s ease, color .18s ease; }
#app .main-sidebar .main-menu a .icon { transition: color .18s ease; }
#app .main-sidebar .main-menu a:hover .icon { color: var(--th-accent, #ffda8a); }
#app .header-status-control { display: flex; flex-wrap: wrap; justify-content: flex-end; align-items: center; gap: 6px; margin-block: 16px 10px; }
#app .header-status-control a { display: inline-flex; align-items: center; gap: 5px; padding: 6px 10px; border: 1px solid var(--th-border, #dce8eb); border-radius: 20px; background: #fff; font-size: 12px; }
#app .header-status-control a:hover, #app .header-status-control a:focus-visible { background: var(--th-soft, #eaf5f3); color: var(--th-primary, #087f8c); text-decoration: none; }
@media (hover: hover) and (pointer: fine) {
    .bc_wrap .btn-primary:hover, #app .btn-primary:hover { box-shadow: 0 5px 14px rgba(8,127,140,.2); }
    .bc_wrap .hotel-selection-card:hover { box-shadow: 0 12px 32px rgba(18,55,67,.14); }
    .bc_wrap .hotel-selection-card:hover .hotel-selection-image img { transform: scale(1.035); }
    .bc_wrap .hotel-selection-detail:hover .fa-arrow-right { transform: translateX(3px); }
}
@media (max-width: 575px) {
    .th-reveal { animation-duration: .4s; }
    .bc_wrap .home-modern .home-highlights > span { padding: 6px 10px; gap: 6px; }
    .bc_wrap .home-modern .home-highlights > span > .fa { width: 20px; height: 20px; font-size: 11px; }
    #app .main-content .filter-div { flex-wrap: wrap; }
    #app .main-content .filter-div > .col-left { width: 100%; }
    .bc_wrap .btn-search, #app .filter-form .btn { min-height: 44px; }
    #app .header-status-control { justify-content: flex-start; }
}
@media (prefers-reduced-motion: reduce) {
    .th-reveal { visibility: visible !important; animation: none !important; }
    .bc_wrap .btn, #app .btn, .hotel-selection-detail,
    .bc_wrap .hotel-selection-card, .bc_wrap .hotel-selection-image img,
    .bc_wrap .hotel-selection-detail .fa-arrow-right,
    #app .main-sidebar .main-menu a, #app .main-sidebar .main-menu a .icon { transition: none !important; transform: none !important; }
}
@media print { .th-reveal { visibility: visible !important; animation: none !important; } }

/* Search controls: native counters, clear summaries and reachable touch targets. */
.bc_wrap .hotel-search-form .form-select-guests .render { white-space: normal; line-height: 1.6; }
.bc_wrap .hotel-search-form .guest-room-summary { font-weight: 600; }
.bc_wrap .hotel-search-form .select-guests-dropdown {
    min-width: 286px; max-width: calc(100vw - 32px); padding: 16px;
    border: 1px solid #d5e5e8; border-radius: 14px;
    max-height: min(480px, 65vh); overflow-y: auto; overscroll-behavior: contain;
    box-shadow: 0 12px 32px rgba(18,55,67,.16);
}
.bc_wrap .hotel-search-form .select-guests-dropdown .dropdown-item-row {
    display: flex; align-items: center; justify-content: space-between; gap: 12px;
    padding: 8px 0; border-bottom: 1px solid #edf2f4;
}
.bc_wrap .hotel-search-form .select-guests-dropdown .val { display: flex; align-items: center; gap: 6px; flex-shrink: 0; }
.bc_wrap .hotel-search-form .select-guests-dropdown button[data-input] {
    display: inline-grid; place-items: center; width: 44px; height: 44px;
    padding: 0; border: 1px solid #c8dfe2; border-radius: 50%;
    background: #eef7f8; color: #087f8c; font-size: 13px; cursor: pointer;
}
.bc_wrap .hotel-search-form .select-guests-dropdown button[data-input]:disabled { opacity: .4; cursor: not-allowed; }
.bc_wrap .hotel-search-form .select-guests-dropdown button[data-input] .fa { margin: 0; font-size: 14px; line-height: 1; }
.bc_wrap .hotel-search-form .select-guests-dropdown .count-display input {
    width: 44px; min-height: 44px; padding: 4px; border: 1px solid #d5e5e8;
    border-radius: 8px; background: #fff; color: #123743; text-align: center; font-size: 16px;
}
.bc_wrap .hotel-search-form .guest-picker-footer { padding-top: 12px; text-align: end; }
.bc_wrap .hotel-search-form .guest-picker-done { min-height: 44px; padding: 8px 20px; }
@media (max-width: 767px) {
    .bc_wrap .page-template-content.home-modern .bc-form-search-all .bc_form.hotel-search-form { padding: 8px; gap: 8px; }
    .bc_wrap .page-template-content.home-modern .bc-form-search-all .bc_form.hotel-search-form .form-group { min-height: 62px; padding: 9px 10px; }
    .bc_wrap .page-template-content.home-modern .bc-form-search-all .bc_form.hotel-search-form .hotel-name-search > label { font-size: 12px; margin-bottom: 5px; }
    .bc_wrap .page-template-content.home-modern .hotel-name-search-control input { height: 46px; font-size: 16px; }
    .bc_wrap .hotel-search-form .select-guests-dropdown { min-width: 270px; }
}