/* Itinere Rooms: custom BookNow theme, 17 September 2026. */
html, body { margin: 0; padding: 0 !important; background: #fff !important; }
body, input, select, textarea, button { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif; }
body { color: #252a2b; font-size: 14px; line-height: 1.6; }
.container { box-sizing: border-box; width: 100% !important; max-width: 1200px; margin: 0 auto; padding: 24px; border-radius: 0; background: #fff !important; filter: none; color: #252a2b !important; }
h1, h2, h3, h4 { color: #252a2b !important; font-weight: 500; text-shadow: none; }
h1, h1.startBookNow { font-size: 24px !important; line-height: 1.25; margin: 0 0 20px; }
#customMessage { font-size: 13px; color: #67675f; line-height: 1.7; margin-bottom: 20px; }
#customMessage p { margin: 0; }
label { font-size: 12px; color: #51534c; margin-bottom: 8px; }
input[type=text], input[type=email], input[type=tel], input[type=number], input[type=password], select, textarea { box-sizing: border-box; min-height: 46px; border: 1px solid #d6cab2; border-radius: 5px; box-shadow: none; background: #fff; color: #252a2b; padding: 10px 12px; font-size: 14px; }
input:focus, select:focus, textarea:focus { border-color: #a89163 !important; outline: 2px solid #d6cab260; outline-offset: 2px; box-shadow: none !important; }
.btn, .btn-primary, .btn-large { background: #252a2f !important; background-image: none !important; color: #fff !important; text-shadow: none; border: 1px solid #252a2f; border-radius: 5px; box-shadow: none; padding: 13px 24px; font-weight: 600; font-size: 14px; line-height: 20px; }
.btn:hover, .btn-primary:hover { background: #474c4a !important; }
.btn:focus-visible, button:focus-visible, summary:focus-visible { outline: 3px solid #ad9567; outline-offset: 3px; }
.input-append { display: flex; }
.input-append input { border-radius: 5px 0 0 5px; flex: 1; min-width: 0; }
.input-append .add-on { box-sizing: border-box; height: 46px; min-width: 42px; display: flex; align-items: center; justify-content: center; background: #f4f0e8; border: 1px solid #d6cab2; border-left: 0; border-radius: 0 5px 5px 0; }
#flags { margin: 0 0 12px 16px; }
#flags .lang-toggle { padding: 5px; border: 1px solid #e5dfd3; border-radius: 4px; }
.container:has(form.step1) { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 14px 24px; align-items: end; }
.container:has(form.step1) .startBookNow { display: none; }
.container:has(form.step1) #flags { grid-column: 2; grid-row: 1; justify-self: end; margin: 0; }
.container:has(form.step1) #customMessage { grid-column: 1; grid-row: 1; align-self: center; margin: 0; }
.container:has(form.step1) form { grid-column: 1; margin: 0; min-width: 0; }
form.step1 fieldset { display: grid; grid-template-columns: minmax(0, 2fr) minmax(100px,1fr); gap: 18px; }
form.step1 fieldset > .space1 { display: none; }
form.step1 fieldset > .pull-left { float: none; min-width: 0; }
form.step1 #dp { width: 100%; margin: 0; }
form.step1 #date_start, form.step1 #nights { width: 100%; margin-bottom: 0; }
.container:has(form.step1) .check-avail-btn { grid-column: 2; margin: 0; padding: 0; }
.check-avail-btn .btn { min-height: 46px; white-space: normal; }
.datepicker { border: 1px solid #d6cab2; border-radius: 10px; padding: 12px; box-shadow: 0 12px 35px #2028201a; background: #fff; }
.datepicker td, .datepicker th { border-radius: 4px; width: 31px; height: 31px; font-size: 13px; }
.datepicker td.active, .datepicker td.active:hover, .datepicker td span.active { background: #b7a67f !important; color: #fff !important; text-shadow: none; }
.datepicker td.day:hover, .datepicker td span:hover { background: #eee9df; }
.datepicker td.disabled, .datepicker td.old, .datepicker td.new { color: #a3a6a2; }
table { width: 100%; }
table tbody { color: #252a2b; }
.table th, .table td { padding: 14px 10px; border-color: #e8e3d9; vertical-align: middle; }
.table-striped tbody tr:nth-child(odd) td { background: #f8f6f1; }
.progress .bar { background: #aa966b; }
@media (max-width: 600px) {
 .container { padding: 16px 12px; }
 .container:has(form.step1) { grid-template-columns: minmax(0,1fr) auto; gap: 16px 10px; }
 .container:has(form.step1) form, .container:has(form.step1) .check-avail-btn { grid-column: 1 / -1; }
 form.step1 fieldset { gap: 12px; grid-template-columns: minmax(0, 2fr) minmax(80px,1fr); }
 .check-avail-btn .btn { width: 100%; }
 .table th, .table td { padding: 10px 5px; font-size: 12px; }
}