/* La Villetta – booking form. Colours follow the Elementor kit variables, with fallbacks. */
.vb {
	--vb-verde: var(--verde, #2E4A3B);
	--vb-cotto: var(--cotto, #A64B26);
	--vb-cotto-scuro: var(--cotto-scuro, #8E3D1C);
	--vb-crema: var(--crema, #FAF8F3);
	--vb-sabbia: var(--sabbia, #F1ECE2);
	--vb-ink: var(--inchiostro, #1F2420);
	--vb-ink-soft: var(--inchiostro-tenue, #4B524C);
	font-family: Figtree, system-ui, sans-serif;
	font-size: 1.0625rem;
	line-height: 1.55;
	color: var(--vb-ink);
	max-width: 52rem;
	margin: 0 auto;
}
.vb *, .vb *::before, .vb *::after { box-sizing: border-box; }
.vb [hidden] { display: none !important; }

.vb-step {
	background: #fff;
	border-radius: 8px;
	padding: clamp(1.25rem, 4vw, 2.25rem);
	border: 1px solid #E6DFD2;
}
.vb-step:focus { outline: none; }
.vb-h2 {
	font-family: Newsreader, Georgia, serif;
	font-size: clamp(1.5rem, 3vw, 1.9rem);
	font-weight: 500;
	line-height: 1.15;
	margin: 0 0 .4rem;
	color: var(--vb-ink);
}
.vb-price-info { margin: 0 0 1.25rem; color: var(--vb-ink-soft); }

/* fields */
.vb-selects { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-bottom: 1.25rem; }
.vb-field { display: flex; flex-direction: column; gap: 6px; margin-bottom: 14px; font-weight: 600; font-size: 1rem; }
.vb-selects .vb-field { margin-bottom: 0; }
.vb-field input, .vb-field select, .vb-field textarea {
	font: inherit;
	font-weight: 400;
	width: 100%;
	min-height: 52px;
	padding: 12px 14px;
	border: 1.5px solid #CFC6B5;
	border-radius: 6px;
	background: #fff;
	color: var(--vb-ink);
}
.vb-field textarea { min-height: 90px; resize: vertical; }
.vb-field input:focus, .vb-field select:focus, .vb-field textarea:focus {
	outline: 3px solid rgba(176,78,38,.25);
	border-color: var(--vb-cotto);
}

/* calendar */
.vb-hint { font-weight: 600; color: var(--vb-verde); margin: 0 0 .75rem; }
.vb-cal { position: relative; }
.vb-cal-nav { position: absolute; top: -4px; right: 0; display: flex; gap: 8px; }
.vb-nav {
	width: 44px; height: 44px; border-radius: 50%;
	border: 1.5px solid var(--vb-verde); background: #fff; color: var(--vb-verde);
	font-size: 1.6rem; line-height: 1; cursor: pointer;
}
.vb-nav:disabled { opacity: .3; cursor: default; }
.vb-months { display: grid; grid-template-columns: 1fr 1fr; gap: 2rem; }
.vb-month-title {
	font-family: Newsreader, Georgia, serif; font-size: 1.25rem; font-weight: 500;
	text-transform: capitalize; margin: 8px 0 12px; color: var(--vb-ink);
}
.vb-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px; }
.vb-wd { text-align: center; font-size: .8rem; font-weight: 700; color: var(--vb-ink-soft); padding: 4px 0; text-transform: uppercase; }
.vb-day {
	aspect-ratio: 1 / 1; min-height: 40px;
	border: 0; border-radius: 4px;
	background: var(--vb-crema); color: var(--vb-ink);
	font: inherit; font-weight: 600; font-size: 1rem;
	cursor: pointer; padding: 0;
	transition: background-color .12s;
}
.vb-day:hover:not(:disabled) { background: var(--vb-sabbia); }
.vb-day:focus-visible { outline: 3px solid var(--vb-cotto); outline-offset: 1px; }
.vb-day.is-past { background: transparent; color: #B9B3A8; cursor: default; }
.vb-day.is-full { background: repeating-linear-gradient(135deg, #EEE9E1 0 6px, #E2DBD0 6px 12px); color: #9A9387; text-decoration: line-through; }
.vb-day.is-full.is-checkout-ok { text-decoration: none; color: var(--vb-ink); }
.vb-day.is-few { background: #F8E7D3; box-shadow: inset 0 -4px 0 #E3A66F; }
.vb-day.is-few:hover:not(:disabled) { background: #F2D9BE; }
.vb-day:disabled { cursor: default; }
.vb-day.is-range { background: #F3D9CC; border-radius: 4px; }
.vb-day.is-start, .vb-day.is-end { background: var(--vb-cotto); color: #fff; }

.vb-legend { list-style: none; display: flex; flex-wrap: wrap; gap: 18px; padding: 0; margin: 1rem 0 0; font-size: .95rem; color: var(--vb-ink-soft); }
.vb-legend li { display: flex; align-items: center; gap: 8px; }
.vb-sw { display: inline-block; width: 18px; height: 18px; border-radius: 5px; }
.vb-sw-free { background: var(--vb-crema); border: 1px solid #DDD4C4; }
.vb-sw-full { background: repeating-linear-gradient(135deg, #EEE9E1 0 4px, #E2DBD0 4px 8px); }
.vb-sw-few { background: #F8E7D3; box-shadow: inset 0 -3px 0 #E3A66F; }
.vb-sw-sel { background: var(--vb-cotto); }

/* summary */
.vb-summary {
	margin: 1.5rem 0 1rem; padding: 18px 20px; border-radius: 6px;
	background: var(--vb-crema); border: 1.5px solid var(--vb-sabbia);
}
.vb-summary.is-error { background: #FBEDE7; border-color: #EBC2B0; color: #7A2E12; font-weight: 600; }
.vb-summary.is-loading { color: var(--vb-ink-soft); }
.vb-sum-dates { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.vb-sum-dates small { display: block; font-size: .85rem; color: var(--vb-ink-soft); text-transform: uppercase; letter-spacing: .06em; font-weight: 700; }
.vb-sum-dates strong { font-size: 1.15rem; text-transform: capitalize; }
.vb-sum-line { margin: 10px 0 0; color: var(--vb-ink-soft); }
.vb-sum-total { display: flex; justify-content: space-between; align-items: baseline; margin: 12px 0 0; padding-top: 12px; border-top: 1px solid var(--vb-sabbia); }
.vb-sum-total strong { font-family: Newsreader, Georgia, serif; font-size: 1.8rem; font-weight: 500; color: var(--vb-ink); }
.vb-summary-compact { margin-top: .5rem; margin-bottom: 1.5rem; }

/* buttons */
.vb-btn {
	display: inline-flex; align-items: center; justify-content: center;
	min-height: 52px; padding: 14px 26px; border-radius: 6px; border: 0;
	font: inherit; font-weight: 600; font-size: 1.0625rem; cursor: pointer;
}
.vb-btn-primary { background: var(--vb-cotto); color: #fff; }
.vb-btn-primary:hover, .vb-btn-primary:focus-visible { background: var(--vb-cotto-scuro); }
.vb-btn-primary:disabled { opacity: .6; cursor: progress; }
.vb-btn-wide { width: 100%; margin-top: .5rem; }
.vb-back { background: none; border: 0; font: inherit; font-weight: 600; color: var(--vb-verde); cursor: pointer; padding: 6px 0; margin-bottom: .5rem; }

/* payment + consent */
.vb-pay { border: 0; padding: 0; margin: 10px 0 16px; }
.vb-pay legend { font-weight: 600; margin-bottom: 8px; padding: 0; }
.vb-pay label {
	display: flex; gap: 12px; align-items: flex-start; padding: 14px 16px; margin-bottom: 8px;
	border: 1px solid #CFC6B5; border-radius: 6px; cursor: pointer;
}
.vb-pay label:has(input:checked) { border-color: var(--vb-cotto); background: #FBF3EE; }
.vb-pay input, .vb-check input { width: 22px; height: 22px; margin-top: 2px; accent-color: var(--vb-cotto); flex: none; }
.vb-pay span { display: flex; flex-direction: column; }
.vb-pay small { color: var(--vb-ink-soft); font-size: .95rem; }
.vb-check { display: flex; gap: 12px; align-items: flex-start; margin: 8px 0 16px; font-size: 1rem; }
.vb-check a { color: var(--vb-verde); }
.vb-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }
.vb-error { background: #FBEDE7; color: #7A2E12; padding: 12px 16px; border-radius: 12px; font-weight: 600; margin: 0 0 8px; }
.vb-small { font-size: .95rem; color: var(--vb-ink-soft); text-align: center; margin: 12px 0 0; }

.vb-notes { margin: 1.5rem 0 0; padding: 1rem 0 0 1.1rem; border-top: 1px solid var(--vb-sabbia); color: var(--vb-ink-soft); font-size: .98rem; }
.vb-notes li { margin-bottom: 4px; }

.vb-step-done { text-align: center; }
.vb-done-icon {
	width: 64px; height: 64px; margin: 0 auto 1rem; border-radius: 50%;
	background: var(--vb-verde); color: #fff; font-size: 2rem; line-height: 64px;
}
.vb-step-done p { font-size: 1.15rem; max-width: 34rem; margin: .75rem auto 0; }

@media (max-width: 700px) {
	.vb-months { grid-template-columns: 1fr; gap: 1.25rem; }
	.vb-day { min-height: 42px; }
	.vb-cal-nav { top: 0; }
}

/* Page wrapper used on the Prenota page (classic content inside the theme). */
.vb-page { background: var(--crema, #F8F4EC); padding: clamp(2rem, 5vw, 4rem) clamp(1rem, 4vw, 3rem) clamp(3rem, 7vw, 6rem); }
.vb-page-head { max-width: 52rem; margin: 0 auto 1.75rem; }
.vb-page-head h1 { font-family: Newsreader, Georgia, serif; font-size: clamp(2.2rem, 4.2vw, 3.4rem); font-weight: 500; line-height: 1.1; letter-spacing: -.01em; margin: 0 0 .75rem; color: #1F2420; }
.vb-page-head p { font-family: Figtree, system-ui, sans-serif; font-size: 1.2rem; line-height: 1.6; color: #4B524C; margin: 0; }
.vb-page-head .vb-eyebrow { display: none; }

/* Privacy page */
.vb-legal { max-width: 46rem; margin: 0 auto; font-family: Figtree, system-ui, sans-serif; color: #1F2420; font-size: 1.0625rem; line-height: 1.7; }
.vb-legal h1 { font-family: Newsreader, Georgia, serif; font-size: clamp(2.2rem, 4.2vw, 3.2rem); font-weight: 500; line-height: 1.1; letter-spacing: -.01em; margin: 0 0 1rem; }
.vb-legal h2 { font-family: Newsreader, Georgia, serif; font-size: 1.5rem; font-weight: 500; line-height: 1.25; margin: 2.25rem 0 .6rem; scroll-margin-top: 100px; }
.vb-legal p, .vb-legal li { color: #4B524C; }
.vb-legal ul { padding-left: 1.2rem; margin: .5rem 0 1rem; }
.vb-legal li { margin-bottom: .4rem; }
.vb-legal strong { color: #1F2420; font-weight: 600; }
.vb-legal a { color: #1F2420; text-decoration: underline; text-underline-offset: 3px; }
.vb-legal .vb-legal-lead { font-size: 1.15rem; }

/* Cookie notice */
.vb-cookie {
	position: fixed; left: 16px; right: 16px; bottom: 16px; z-index: 9999;
	max-width: 40rem; margin: 0 auto; padding: 14px 16px 14px 20px;
	display: flex; align-items: center; gap: 16px;
	background: #1E3328; color: #FAF8F3; border-radius: 8px;
	box-shadow: 0 10px 30px rgba(0,0,0,.18);
	font-family: Figtree, system-ui, sans-serif; font-size: .95rem; line-height: 1.5;
}
.vb-cookie[hidden] { display: none; }
.vb-cookie p { margin: 0; color: #FAF8F3; }
.vb-cookie a { color: #FAF8F3; text-decoration: underline; text-underline-offset: 3px; }
.vb-cookie button {
	flex: none; border: 0; border-radius: 6px; padding: 10px 18px; cursor: pointer;
	background: #FAF8F3; color: #1E3328; font: inherit; font-weight: 600;
}
.vb-cookie button:hover, .vb-cookie button:focus-visible { background: #F1ECE2; }
@media (max-width: 600px) { .vb-cookie { flex-direction: column; align-items: stretch; text-align: left; } }

.vb-notice-inline { max-width: 52rem; margin: 0 auto 1rem; padding: 14px 18px; border-radius: 6px; background: #FBEDE7; color: #7A2E12; font-family: Figtree, system-ui, sans-serif; font-weight: 600; }

/* The theme styles every <button> (pink border, pink text, padding, pink hover).
   Reset them inside the booking form so the calendar keeps its own look and
   seven columns always fit. */
.vb .vb-day,
.vb .vb-nav,
.vb .vb-back,
.vb .vb-btn {
	border-style: solid;
	box-shadow: none;
	text-transform: none;
	letter-spacing: normal;
	white-space: nowrap;
}
.vb .vb-day {
	border: 0 !important;
	padding: 0 !important;
	min-width: 0 !important;
	width: 100%;
	color: var(--vb-ink) !important;
	background-color: var(--vb-crema);
	line-height: 1;
}
.vb .vb-day:hover:not(:disabled), .vb .vb-day:focus:not(:disabled) { background-color: var(--vb-sabbia); color: var(--vb-ink) !important; }
.vb .vb-day.is-past { background: transparent !important; color: #B9B3A8 !important; }
.vb .vb-day.is-full { background: repeating-linear-gradient(135deg, #EEE9E1 0 6px, #E2DBD0 6px 12px) !important; color: #9A9387 !important; }
.vb .vb-day.is-full.is-checkout-ok { color: var(--vb-ink) !important; }
.vb .vb-day.is-few { background-color: #F8E7D3 !important; }
.vb .vb-day.is-few:hover:not(:disabled) { background-color: #F2D9BE !important; }
.vb .vb-day.is-range { background: #F3D9CC !important; }
.vb .vb-day.is-start, .vb .vb-day.is-end { background: var(--vb-cotto) !important; color: #fff !important; box-shadow: none; }
.vb .vb-nav {
	padding: 0 !important; min-width: 0;
	border: 1px solid #CFC6B5 !important; background: #fff !important; color: var(--vb-ink) !important;
	display: inline-flex; align-items: center; justify-content: center;
}
.vb .vb-nav:hover:not(:disabled) { border-color: var(--vb-ink) !important; }
.vb .vb-back { border: 0 !important; background: none !important; color: var(--vb-verde) !important; padding: 6px 0 !important; }
.vb .vb-btn-primary { border: 0 !important; color: #fff !important; }
.vb .vb-grid { grid-template-columns: repeat(7, minmax(0, 1fr)); }
.vb .vb-months > * { min-width: 0; }
.vb .vb-nav { width: 44px !important; height: 44px !important; flex: none; border-radius: 50% !important; font-size: 1.5rem !important; line-height: 1 !important; }
.vb .vb-months .vb-month:last-child .vb-month-title { padding-right: 104px; }
@media (max-width: 700px) { .vb .vb-months .vb-month:first-child .vb-month-title { padding-right: 104px; } .vb .vb-months .vb-month:last-child .vb-month-title { padding-right: 0; } }
/* The theme makes every button transparent: give the form's main buttons their colour back. */
.vb .vb-btn-primary { background-color: var(--vb-cotto) !important; color: #fff !important; border: 0 !important; }
.vb .vb-btn-primary:hover:not(:disabled), .vb .vb-btn-primary:focus-visible { background-color: var(--vb-cotto-scuro) !important; color: #fff !important; }
.vb .vb-btn-primary:disabled { opacity: .6; }
.vb-cookie button { background-color: #FAF8F3 !important; color: #1E3328 !important; border: 0 !important; }
.vb-cookie button:hover, .vb-cookie button:focus-visible { background-color: #F1ECE2 !important; color: #1E3328 !important; }
.vb .vb-btn { min-height: 52px !important; padding: 14px 28px !important; font-family: Figtree, system-ui, sans-serif !important; font-size: 1.0625rem !important; font-weight: 600 !important; line-height: 1.2 !important; border-radius: 6px !important; }
.vb .vb-btn-wide { width: 100%; }

.vb-sum-tax { margin: 6px 0 0; font-size: .95rem; color: var(--vb-ink-soft); text-align: right; }

/* ---------- Mobile polish (site-wide; element IDs are shared by IT/EN/FR/DE copies) ---------- */
@media (max-width: 767px) {
	/* Header: logo | IT ⌄ | Prenota | menu, with breathing room. */
	.elementor-element-15d3b0ef { gap: 6px !important; }
	.elementor-element-15d3b0ef > .elementor-element-24fb42d { order: 1 !important; }
	.elementor-element-15d3b0ef > .btn-primario { order: 2; padding: 10px 16px !important; }
	.elementor-element-15d3b0ef > .elementor-element-3ff2b2d4 { order: 3 !important; margin-left: 2px; }
	.elementor-element-24fb42d .pll-parent-menu-item > a.elementor-item { font-size: 0 !important; padding: 10px 6px !important; letter-spacing: .04em; }
	.elementor-element-24fb42d .pll-parent-menu-item > a.elementor-item::before { font-size: 15px; font-weight: 600; position: static !important; opacity: 1 !important; transform: none !important; background: none !important; width: auto !important; height: auto !important; color: #1E3328; }
	.elementor-element-24fb42d .lang-item-it > a.elementor-item::before { content: "IT"; }
	.elementor-element-24fb42d .lang-item-en > a.elementor-item::before { content: "EN"; }
	.elementor-element-24fb42d .lang-item-fr > a.elementor-item::before { content: "FR"; }
	.elementor-element-24fb42d .lang-item-de > a.elementor-item::before { content: "DE"; }
	.elementor-element-24fb42d .lang-item-nl > a.elementor-item::before { content: "NL"; }
	.elementor-element-24fb42d .pll-parent-menu-item > a .sub-arrow { font-size: 11px; margin-left: 4px; }
	.elementor-element-24fb42d .sub-menu { right: 0; left: auto !important; min-width: 150px !important; }
	.elementor-element-6b50ebe8 > span:last-child { font-size: 12.5px !important; }

	/* Mobile menu panel: comfortable rows, clear current page. */
	.elementor-element-3ff2b2d4 .elementor-nav-menu--dropdown a.elementor-item { padding: 16px 20px !important; font-size: 18px !important; }
	.elementor-element-3ff2b2d4 .elementor-nav-menu--dropdown a.elementor-item-active { background: transparent !important; color: #A84E2E !important; }

	/* Page buttons stack full width with centred labels (the header button keeps its size). */
	[data-elementor-type="wp-page"] .btn-primario,
	[data-elementor-type="wp-page"] .btn-secondario { width: 100%; justify-content: center; text-align: center; box-sizing: border-box; }

	/* Camere gallery: wide first and last photo, 2 × 2 in between, no orphan. */
	.elementor-element-6bf9a61d > .foto:last-child { grid-column: span 2 !important; aspect-ratio: 4 / 3 !important; height: auto !important; width: 100% !important; object-fit: cover; }
}
.elementor-element-24fb42d .vb-lang-open > .sub-menu { display: block !important; position: absolute !important; top: 100% !important; right: 0 !important; left: auto !important; margin-top: 4px !important; min-width: 150px !important; z-index: 99; }

/* Accepted payment methods ([villetta_pagamenti] and under the booking calendar). */
.vb-pay { margin: 20px 0 4px; }
.vb-pay-row { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.vb-pay-chip { display: inline-flex !important; flex-direction: row !important; align-items: center; gap: 6px; height: 34px; padding: 0 12px; border: 1px solid #E6DFD2; border-radius: 6px; background: #FFFFFF; color: #3A4039; font-family: Figtree, system-ui, sans-serif; font-size: .85rem; font-weight: 600; line-height: 1; white-space: nowrap; }
.vb-pay-chip svg { width: auto; height: 20px; fill: currentColor; flex: none; }
.vb-pay-chip svg { width: 20px; }
.vb-pay-chip[aria-label="Visa"] svg, .vb-pay-chip[aria-label="Mastercard"] svg { width: 30px; height: 30px; }
.vb-pay-apple_pay svg, .vb-pay-google_pay svg { width: 34px; height: 34px; }
.vb-pay-text { margin: 10px 0 0; font-family: Figtree, system-ui, sans-serif; font-size: .9rem; line-height: 1.5; color: #4B524C; }
.elementor-widget-shortcode .vb-pay { margin-top: 8px; }

/* Call / WhatsApp buttons on phones (includes/contact.php). */
.vb-float { display: none; }
@media (max-width: 767px) {
	.vb-float { position: fixed; right: 14px; bottom: 16px; z-index: 90; display: flex; flex-direction: column; gap: 10px; }
	.vb-cookie:not([hidden]) ~ .vb-float { display: none; }
	.vb-float-btn { display: flex; align-items: center; justify-content: center; width: 48px; height: 48px; border-radius: 50%; color: #FFFFFF !important; box-shadow: 0 6px 16px rgba(31,36,32,.22); text-decoration: none; }
	.vb-float-btn svg { width: 24px; height: 24px; }
	.vb-float-wa { background: #2E4A3B; }
	.vb-float-wa svg { fill: currentColor; }
	.vb-float-tel { background: #A84E2E; }
	/* Room under the last footer line so the buttons never cover it. */
	[data-elementor-type="footer"] > .e-con:last-child, [data-elementor-type="footer"] > .elementor-element:last-child { padding-bottom: 128px !important; }
}

/* Reserve the calendar's height so the content below does not jump when it renders. */
.vb .vb-cal { min-height: 360px; }
@media (max-width: 700px) { .vb .vb-cal { min-height: 640px; } }
/* Links inside footer text lines are underlined, not told apart by colour alone. */
[data-elementor-type="footer"] p a { text-decoration: underline; text-underline-offset: 2px; }
/* Photos keep their aspect ratio. Elementor's .foto sets height:100%, which Safari/WebKit
   resolves against the whole grid section, stretching the photo over the text around it. */
.elementor img.foto { height: auto; }
/* Google score: its own line under the Booking.com block (the big 9,4 is Booking.com's), linked to the reviews
   on Maps. Elementor strips classes from shortcode markup, so it is targeted by element ID. */
[data-id="vbgoog58"] { margin: 0; color: #5b5f58; }
[data-id="vbgoog58"] a { color: inherit; text-decoration: underline !important; text-underline-offset: 3px; }
[data-id="vbgoog58"] a::before { content: "★ "; color: #b8860b; text-decoration: none; display: inline-block; margin-right: .25em; }