/* Origami Booking — selettore di date e ospiti. Il tema lo adatta con le variabili --ob-* e --obp-*. */
.obp-host, .obp-pop {
	--_accent: var(--ob-accent, #156e8a);
	--_accent-c: var(--ob-accent-contrast, #fff);
	--_text: var(--ob-text, #12343f);
	--_muted: var(--ob-muted, #5b7680);
	--_surface: var(--ob-surface, #fff);
	--_border: var(--ob-border, #d5e0e3);
	--_radius: var(--ob-radius, 4px);
	--_head: var(--ob-font-heading, inherit);
	--_body: var(--ob-font-body, inherit);
	--_range: var(--obp-range, color-mix(in srgb, var(--_accent) 12%, var(--_surface)));
	--_preview: var(--obp-preview, color-mix(in srgb, var(--_accent) 7%, var(--_surface)));
	--_hover: var(--obp-hover, color-mix(in srgb, var(--_accent) 10%, var(--_surface)));
	--_warn: var(--obp-warn, #8a5638);
	--_pop-radius: var(--obp-radius, 18px);
	--_shadow: var(--obp-shadow, 0 30px 80px -20px rgba(10, 40, 50, .35), 0 2px 8px rgba(10, 40, 50, .08));
	--_ease: cubic-bezier(.2, .8, .2, 1);
}
.obp-host { position: relative; }
.obp-pop, .obp-pop * { box-sizing: border-box; }

/* I campi nativi restano nel modulo (stessi name), invisibili. */
.obp-native { position: absolute !important; width: 1px !important; height: 1px !important; opacity: 0 !important; pointer-events: none !important; clip-path: inset(50%); margin: 0 !important; padding: 0 !important; border: 0 !important; }

/* Campo-bottone delle date */
.obp-trigger {
	display: flex; align-items: baseline; justify-content: space-between; gap: .5rem;
	width: 100%; min-height: 48px; padding: .6rem .85rem;
	background: var(--_surface); color: var(--_text);
	border: 1px solid var(--_border); border-radius: var(--_radius);
	font: inherit; font-size: 1rem; text-align: left; cursor: pointer;
	transition: border-color .2s, box-shadow .2s, background .2s;
}
.obp-trigger:hover { border-color: var(--_accent); }
.obp-trigger.is-empty .obp-trigger__value { color: var(--_muted); }
.obp-trigger__value { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-variant-numeric: tabular-nums; }
.obp-trigger__note { font-size: .78rem; letter-spacing: .04em; color: var(--_accent); white-space: nowrap; }
.obp-trigger__note:empty { display: none; }
.obp-field.is-active .obp-trigger { border-color: var(--_accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--_accent) 18%, transparent); }
.obp-trigger:focus-visible, .obp-step__btn:focus-visible, .obp-day:focus-visible, .obp-nav:focus-visible, .obp-close:focus-visible, .obp-clear:focus-visible { outline: 2px solid var(--_accent); outline-offset: 2px; }

/* Ospiti: − n + */
.obp-step { display: flex; align-items: center; justify-content: space-between; gap: .5rem; min-height: 48px; padding: 0 .35rem; background: var(--_surface); border: 1px solid var(--_border); border-radius: var(--_radius); }
.obp-step__value { min-width: 1.5ch; text-align: center; font-size: 1.05rem; font-variant-numeric: tabular-nums; }
.obp-step__btn { display: grid; place-items: center; width: 34px; height: 34px; padding: 0; border: 1px solid var(--_border); border-radius: 50%; background: transparent; color: var(--_accent); cursor: pointer; transition: background .2s, border-color .2s, transform .15s; }
.obp-step__btn:hover:not([disabled]) { background: var(--_hover); border-color: var(--_accent); }
.obp-step__btn:active:not([disabled]) { transform: scale(.92); }
.obp-step__btn[disabled] { opacity: .3; cursor: default; }
.obp-ico { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }

/* Calendario: popover su schermi larghi */
.obp-pop {
	position: fixed; z-index: 9990; top: 0; left: 0;
	width: min(46rem, calc(100vw - 16px));
	padding: 1.5rem 1.75rem 1.25rem;
	background: var(--_surface); color: var(--_text);
	border-radius: var(--_pop-radius); box-shadow: var(--_shadow);
	font-family: var(--_body); text-align: left;
	opacity: 0; transform: translateY(8px) scale(.985); transform-origin: top left;
	transition: opacity .22s var(--_ease), transform .32s var(--_ease);
}
.obp-pop.is-above { transform-origin: bottom left; transform: translateY(-8px) scale(.985); }
.obp-pop.is-open { opacity: 1; transform: none; }
.obp-pop[hidden] { display: none; }
.obp-pop.is-loading .obp-months { opacity: .55; }

.obp-pop__head { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; margin-bottom: 1.1rem; }
.obp-pop__title { margin: 0; font-family: var(--_head); font-weight: 400; font-size: 1.7rem; line-height: 1; color: var(--_text); }
.obp-pop__hint { margin: .45rem 0 0; font-size: .85rem; color: var(--_muted); min-height: 1.3em; }
.obp-pop__hint.is-warn { color: var(--_warn); }
.obp-pop__navs { display: flex; gap: .4rem; flex-shrink: 0; }
.obp-nav, .obp-close { display: grid; place-items: center; width: 40px; height: 40px; padding: 0; border: 1px solid var(--_border); border-radius: 50%; background: var(--_surface); color: var(--_text); cursor: pointer; transition: background .2s, border-color .2s; }
.obp-nav:hover:not([disabled]), .obp-close:hover { background: var(--_hover); border-color: var(--_accent); }
.obp-nav[disabled] { opacity: .25; cursor: default; }
.obp-close { display: none; }

.obp-weekrow { display: none; }
.obp-months { display: grid; grid-template-columns: 1fr 1fr; gap: 2.25rem; transition: opacity .2s; }
.obp-month__name { margin: 0 0 .6rem; font-family: var(--_head); font-weight: 400; font-size: 1.25rem; line-height: 1.1; text-transform: capitalize; color: var(--_text); text-align: center; }
.obp-grid { display: grid; gap: 2px 0; }
.obp-row { display: grid; grid-template-columns: repeat(7, 1fr); }
.obp-wd { display: grid; place-items: center; height: 28px; font-size: .68rem; letter-spacing: .12em; text-transform: uppercase; color: var(--_muted); }

/* Giorni */
.obp-cell { position: relative; display: grid; place-items: center; height: 44px; }
.obp-cell::before { content: ""; position: absolute; inset: 3px 0; background: transparent; transition: background .18s; }
.obp-cell.is-in::before, .obp-cell.is-preview::before { background: var(--_range); }
.obp-cell.is-preview::before { background: var(--_preview); }
.obp-cell.has-range.is-start::before, .obp-cell.has-preview.is-start::before { left: 50%; background: var(--_range); }
.obp-cell.has-preview.is-start::before { background: var(--_preview); }
.obp-cell.is-end::before, .obp-cell.is-preview-end::before { right: 50%; background: var(--_range); }
.obp-cell.is-preview-end::before { background: var(--_preview); }
.obp-row > .obp-cell:first-child.is-in::before, .obp-row > .obp-cell:first-child.is-preview::before { border-radius: 22px 0 0 22px; }
.obp-row > .obp-cell:last-child.is-in::before, .obp-row > .obp-cell:last-child.is-preview::before { border-radius: 0 22px 22px 0; }

.obp-day {
	position: relative; z-index: 1;
	display: grid; place-items: center;
	width: 42px; height: 42px; padding: 0;
	border: 1px solid transparent; border-radius: 50%;
	background: transparent; color: var(--_text);
	font: inherit; font-size: .95rem; font-variant-numeric: tabular-nums; line-height: 1;
	cursor: pointer; transition: background .18s, color .18s, border-color .18s, transform .15s;
}
.obp-day:hover:not([aria-disabled="true"]) { border-color: var(--_accent); }
.obp-day:active:not([aria-disabled="true"]) { transform: scale(.94); }
.obp-cell.is-start .obp-day, .obp-cell.is-end .obp-day, .obp-cell.is-preview-end .obp-day { background: var(--_accent); color: var(--_accent-c); border-color: var(--_accent); }
.obp-cell.is-preview-end .obp-day { background: color-mix(in srgb, var(--_accent) 75%, var(--_surface)); }
.obp-cell.is-today .obp-day::after { content: ""; position: absolute; bottom: 6px; left: 50%; width: 4px; height: 4px; margin-left: -2px; border-radius: 50%; background: currentColor; opacity: .55; }
.obp-day[aria-disabled="true"] { cursor: default; color: color-mix(in srgb, var(--_muted) 45%, transparent); }
.obp-cell.is-busy .obp-day[aria-disabled="true"] span { text-decoration: line-through; text-decoration-thickness: 1px; }
.obp-cell.is-short .obp-day { color: color-mix(in srgb, var(--_muted) 60%, transparent); cursor: not-allowed; }
.obp-cell.is-blank { pointer-events: none; }

.obp-pop__foot { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-top: 1.1rem; padding-top: 1rem; border-top: 1px solid var(--_border); }
.obp-pop__sum { margin: 0; font-size: .95rem; color: var(--_text); font-variant-numeric: tabular-nums; white-space: pre; }
.obp-pop__acts { display: flex; align-items: center; gap: 1rem; }
.obp-clear { padding: 0; border: 0; background: none; color: var(--_muted); font: inherit; font-size: .85rem; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.obp-clear:hover { color: var(--_text); }
.obp-done[disabled] { opacity: .4; pointer-events: none; }

/* Telefono: foglio dal basso, mesi in colonna */
.obp-backdrop { position: fixed; inset: 0; z-index: 9998; background: rgba(8, 30, 38, .45); backdrop-filter: blur(3px); animation: obp-fade .25s ease; }
.obp-backdrop[hidden] { display: none; }
.obp-pop.is-sheet {
	position: fixed; z-index: 9999; inset: auto 0 0 0; top: auto !important; left: 0 !important; bottom: 0 !important;
	width: 100%; max-height: 88vh; padding: 1.1rem 1rem calc(1rem + env(safe-area-inset-bottom));
	display: flex; flex-direction: column;
	border-radius: 22px 22px 0 0;
	transform: translateY(100%); transition: transform .38s var(--_ease), opacity .2s;
}
.obp-pop.is-sheet.is-open { transform: none; }
.obp-pop.is-sheet::before { content: ""; align-self: center; width: 40px; height: 4px; margin: -.35rem 0 .8rem; border-radius: 2px; background: var(--_border); }
.obp-pop.is-sheet .obp-pop__head { margin-bottom: .6rem; }
.obp-pop.is-sheet .obp-pop__title { font-size: 1.5rem; }
.obp-pop.is-sheet .obp-nav { display: none; }
.obp-pop.is-sheet .obp-close { display: grid; }
.obp-pop.is-sheet .obp-weekrow { display: grid; grid-template-columns: repeat(7, 1fr); padding: .35rem 0; border-bottom: 1px solid var(--_border); font-size: .68rem; letter-spacing: .12em; text-transform: uppercase; color: var(--_muted); text-align: center; }
.obp-pop.is-sheet .obp-months { display: block; flex: 1; overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch; padding-top: .5rem; scroll-behavior: smooth; }
.obp-pop.is-sheet .obp-month { margin-bottom: 1.4rem; }
.obp-pop.is-sheet .obp-month__name { text-align: left; padding-left: .35rem; }
.obp-pop.is-sheet .obp-row--head { display: none; }
.obp-pop.is-sheet .obp-cell { height: 46px; }
.obp-pop.is-sheet .obp-day { width: 44px; height: 44px; }
.obp-pop.is-sheet .obp-pop__foot { margin-top: .5rem; padding-top: .8rem; flex-wrap: wrap; gap: .6rem 1rem; }
.obp-pop.is-sheet .obp-pop__sum { flex: 1 1 100%; white-space: normal; }
.obp-pop.is-sheet .obp-pop__acts { flex: 1 1 100%; justify-content: space-between; }
.obp-pop.is-sheet .obp-done { flex: 0 0 auto; min-width: 9rem; }
html.obp-lock, html.obp-lock body { overflow: hidden; }

@keyframes obp-fade { from { opacity: 0; } }
@media (prefers-reduced-motion: reduce) {
	.obp-pop, .obp-pop.is-sheet, .obp-day, .obp-cell::before, .obp-trigger, .obp-step__btn { transition: none; }
	.obp-backdrop { animation: none; }
	.obp-pop.is-sheet .obp-months { scroll-behavior: auto; }
}