/* Shared booking range component; no native date controls or external assets. */
.stay-date-field { flex: 0 0 auto; }
.stay-date-trigger {
    display: flex; align-items: center; gap: 12px; text-align: left;
    border: 1px solid transparent; border-radius: 5px; background: transparent;
    padding: 2px 14px 2px 9px; min-width: 218px; min-height: 48px;
}
.stay-date-trigger:hover, .stay-date-trigger[aria-expanded=true] { background: #edf1e6; border-color: #c5d3bd; }
.stay-date-trigger > svg { width: 23px; height: 23px; color: var(--primary); flex: 0 0 auto; }
.stay-date-trigger > span:nth-child(2) { display: grid; gap: 2px; }
.stay-date-label { font-size: 9px; text-transform: uppercase; letter-spacing: .09em; color: var(--secondary); font-weight: 650; }
.stay-date-trigger strong { font-size: 13px; font-weight: 650; line-height: 1.35; white-space: nowrap; }
.stay-date-trigger small { font-size: 10px; color: var(--secondary); }
.stay-date-chevron { margin-left: auto; font-size: 17px; color: var(--secondary); }
[data-mode=callcenter] .stay-date-trigger { min-width: 250px; }
[data-mode=callcenter] .stay-date-trigger strong { font-size: 12px; }
.search-bar .stay-date-field { border-right: 1px solid var(--border); }
.search-bar label:has(select[name=guests]) select { width: 60px !important; }
.search-bar label:has(select[name=category]) select { width: 100px !important; }
#booking-stay-dates { margin: 18px 0; border: 1px solid var(--border); border-radius: 7px; }
#booking-stay-dates .stay-date-trigger { width: 100%; padding: 12px; }

.stay-calendar {
    position: fixed; z-index: 1200; width: 638px; max-width: calc(100vw - 24px);
    background: var(--surface); border: 1px solid #d2dbca; border-radius: 10px;
    box-shadow: 0 18px 70px #183e382b, 0 2px 8px #183e380f;
    padding: 22px 24px 12px; overflow-y: auto; overscroll-behavior: contain;
    color: var(--text); isolation: isolate;
}
.stay-calendar-header { display: flex; justify-content: space-between; align-items: start; }
.stay-calendar-header .eyebrow { font-size: 8px; color: #64755a; margin: 0 0 7px; }
.stay-calendar-header h2 { font-size: 26px; margin: 0; letter-spacing: -.035em; }
.stay-calendar-close { width: 32px; height: 32px; border: 0; background: #f0f2e9; padding: 0; font-size: 23px; }
.stay-calendar-instruction { font-size: 11px; color: var(--secondary); margin: 10px 0 18px; }
.stay-month-navigation { display: flex; justify-content: space-between; position: relative; z-index: 1; margin-bottom: -32px; pointer-events: none; }
.stay-month-navigation button { width: 32px; height: 32px; padding: 0; font-size: 17px; background: transparent; border-color: var(--border); pointer-events: auto; }
.stay-months { display: grid; grid-template-columns: 1fr 1fr; gap: 26px; }
.stay-month h3 { text-align: center; font-size: 13px; letter-spacing: 0; line-height: 32px; margin: 0 0 12px; font-weight: 650; }
.stay-week { display: grid; grid-template-columns: repeat(7, 1fr); }
.stay-weekdays { margin-bottom: 6px; }
.stay-weekdays span { text-align: center; font-size: 9px; color: #77816e; line-height: 25px; }
.stay-day-cell { height: 37px; margin: 2px 0; position: relative; }
.stay-day-empty { height: 37px; margin: 2px 0; }
.stay-calendar .stay-day {
    width: 100%; height: 37px; padding: 0; border: 0; background: transparent;
    border-radius: 5px; font-size: 12px; position: relative; color: #304b3c;
}
.stay-day i { position: absolute; font-size: 19px; font-style: normal; bottom: -2px; left: 0; right: 0; line-height: 12px; color: #9b7440; }
.stay-calendar .stay-day:not([aria-disabled=true]):hover { background: #dce6d3; }
.stay-calendar .stay-day[aria-disabled=true] { color: #a4aa9c; cursor: not-allowed; }
.stay-calendar .stay-day.unavailable span { text-decoration: line-through; text-decoration-color: #9da797; }
.stay-calendar .stay-day.past { opacity: .55; }
.stay-calendar .stay-day[aria-current=date] span { box-shadow: 0 2px 0 #9f8353; padding-bottom: 3px; }
.stay-day-cell.in-range { background: #e0ead8; }
.stay-day-cell.range-preview { background: #eaf0e3; }
.stay-day-cell.range-start { border-radius: 5px 0 0 5px; }
.stay-day-cell.range-end { border-radius: 0 5px 5px 0; }
.stay-day-cell.range-start .stay-day, .stay-day-cell.range-end .stay-day {
    background: var(--primary); color: #fffef8; font-weight: 700;
}
.stay-day-cell.range-start .stay-day:hover, .stay-day-cell.range-end .stay-day:hover { background: #173b2e; }
.stay-day-cell.range-start i, .stay-day-cell.range-end i { color: #e4dbb4; }
.stay-calendar .stay-day:focus-visible { outline: 2px solid #a47839; outline-offset: -2px; z-index: 2; }
.stay-calendar-legend { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 17px; border-top: 1px solid var(--border); padding-top: 12px; font-size: 9px; color: var(--secondary); }
.stay-calendar-legend > span { display: inline-flex; align-items: center; gap: 5px; }
.stay-calendar-legend > span:last-child { margin-left: auto; }
.stay-calendar-legend i { display: inline-block; width: 5px; height: 5px; border-radius: 50%; background: #708864; }
.stay-calendar-legend .limited { background: #a78a55; }
.stay-calendar-legend .unavailable { width: 8px; height: 1px; background: #9ba594; border-radius: 0; }
.stay-calendar-error { min-height: 16px; margin: 8px 0 6px; font-size: 10px; color: #87632c; }
.stay-calendar-footer { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 14px 0 0; border-top: 1px solid var(--border); background: var(--surface); }
.stay-draft-summary { display: grid; gap: 4px; }
.stay-draft-summary strong { font-size: 14px; font-weight: 650; }
.stay-draft-summary span { font-size: 10px; color: var(--secondary); }
.stay-calendar-actions { display: flex; align-items: center; gap: 8px; flex-shrink: 0; }
.stay-calendar-actions button { font-size: 11px; }
.stay-calendar-actions > button:first-child { background: transparent; border-color: transparent; color: var(--secondary); padding: 10px 8px; }
.stay-calendar-actions .button { padding: 11px 15px; }
.stay-reference { text-align: left; color: #7c8772; font-size: 8px; margin: 11px 0 0; }

@media(min-width:901px) {
    [data-camp=camp-b][data-scenario=operations] .search-bar .stay-date-field { width: 100%; border-right: 0; border-bottom: 1px solid var(--border); padding-bottom: 8px; }
    [data-camp=camp-b][data-scenario=operations] .stay-date-trigger { width: 100%; min-width: 0; padding: 2px 8px; }
    [data-camp=camp-b][data-scenario=operations] .search-bar label:has(select[name=guests]) select { width: 40px !important; }
    [data-camp=camp-b][data-scenario=operations] .search-bar label:has(select[name=category]) select { width: 82px !important; }
}
@media(max-width:640px) {
    .stay-calendar {
        top: auto !important; left: 0 !important; right: 0; bottom: 0;
        width: 100%; max-width: none; max-height: calc(100dvh - 16px) !important;
        padding: 21px 20px max(12px, env(safe-area-inset-bottom));
        border-radius: 15px 15px 0 0; box-shadow: 0 -12px 70px #17382f50;
    }
    .stay-calendar::before { content: ''; display: block; width: 34px; height: 3px; border-radius: 3px; background: #c7d0bd; margin: -12px auto 17px; }
    .stay-months { display: block; }
    .stay-month + .stay-month { display: none; }
    .stay-month h3 { margin-bottom: 9px; font-size: 14px; line-height: 40px; }
    .stay-month-navigation { margin-bottom: -40px; }
    .stay-month-navigation button, .stay-calendar-close { width: 40px; height: 40px; }
    .stay-day-cell, .stay-day-empty, .stay-calendar .stay-day { height: 44px; }
    .stay-day-cell, .stay-day-empty { margin: 1px 0; }
    .stay-calendar .stay-day { font-size: 13px; }
    .stay-calendar-header h2 { font-size: 26px; }
    .stay-calendar-instruction { margin: 9px 0 16px; }
    .stay-calendar-footer { position: sticky; bottom: -12px; padding: 14px 0 12px; flex-wrap: wrap; z-index: 2; }
    .stay-calendar-actions { margin-left: auto; }
    .stay-draft-summary strong { font-size: 13px; }
    .stay-calendar-actions .button { min-height: 44px; padding: 10px 14px; }
    .stay-calendar-legend { gap: 9px 13px; }
    .stay-calendar-legend > span:last-child { margin-left: 0; }
    .stay-sheet-open::after { content: ''; position: fixed; inset: 0; background: #183e382b; z-index: 1100; pointer-events: none; }
    .stay-sheet-open { overflow: hidden; }
}
@media(max-width:540px) {
    .search-bar .stay-date-field { width: 100%; border: 0; border-bottom: 1px solid var(--border); padding: 0 0 7px; margin-bottom: 2px; }
    .stay-date-trigger, [data-mode=callcenter] .stay-date-trigger { width: 100%; min-width: 0; min-height: 48px; padding: 0 8px; }
    .stay-date-trigger > span:nth-child(2) { grid-template-columns: 1fr auto; gap: 2px 12px; flex: 1; }
    .stay-date-label { grid-column: 1 / -1; }
    .stay-date-trigger small { align-self: center; }
    .stay-date-trigger strong { font-size: 13px; }
    .search-bar .button { padding: 7px 12px; }
    [data-mode=callcenter] #toggle-filters { padding: 6px 8px; }
    .search-bar label:has(select[name=category]) select { width: 92px !important; }
}
@media(prefers-reduced-motion:reduce) { .stay-calendar, .stay-calendar * { animation: none !important; transition: none !important; } }

/* On tablet landscape, leave a clear column beside the operator's controls. */
@media(min-width:901px) and (max-width:1100px) {
    [data-mode=callcenter] .search-bar { width: 300px; max-width: 300px; top: 215px; padding: 12px; gap: 10px 0; }
    [data-mode=callcenter] .search-bar .stay-date-field { width: 100%; padding-bottom: 8px; border-right: 0; border-bottom: 1px solid var(--border); }
    [data-mode=callcenter] .stay-date-trigger { width: 100%; min-width: 0; padding: 2px 8px; }
    [data-mode=callcenter] .search-bar label { padding: 0 8px; }
    [data-mode=callcenter] .search-bar label:has(select[name=guests]) select { width: 40px !important; }
    [data-mode=callcenter] .search-bar label:has(select[name=category]) select { width: 82px !important; }
    [data-mode=callcenter] .search-bar .button { padding: 8px 15px; margin: 0 0 0 8px; }
    [data-mode=callcenter] #staff-search { flex-wrap: wrap; gap: 8px 0; }
    [data-mode=callcenter] #staff-search label { flex: 0 0 50%; max-width: 50%; }
    [data-mode=callcenter] #staff-search input, [data-mode=callcenter] #staff-search select { width: 100%; max-width: 100%; font-size: 11px; }
    [data-mode=callcenter] .kpi-strip { top: 115px; left: 30px; max-width: none; gap: 18px; }
    [data-mode=callcenter] .result-summary { top: 184px; left: 30px; }
    [data-mode=callcenter] .status-filters { width: 300px; grid-template-columns: 1fr 1fr; }
}
@media(min-width:641px) and (max-height:820px) {
    .stay-calendar { padding: 16px 20px 10px; }
    .stay-calendar-header .eyebrow { display: none; }
    .stay-calendar-header h2 { font-size: 24px; }
    .stay-calendar-instruction { margin: 8px 0 10px; }
    .stay-calendar-error:empty { display: none; }
    .stay-calendar-footer { margin-top: 12px; padding-top: 12px; }
    .stay-reference { margin-top: 6px; }
}