/* ════════════════════════════════════════════
   HOTEL HANSEAT · Contact form styling (WPForms)
   Dedicated stylesheet — kept separate from hanseat.css on purpose.
   Scoped ONLY to forms #180 (DE), #182 (EN), #184 (NL).
   Do NOT widen these selectors to other WPForms forms.
   All colors/fonts reuse the design tokens defined in hanseat.css
   (--deep, --gold/--gold-hi/--gold-lo, --ice, --sky family, Manrope,
   Cormorant Garamond) — loaded first, so the variables are available.
   ════════════════════════════════════════════ */

:is(#wpforms-180,#wpforms-182,#wpforms-184){
	background:transparent;
	box-shadow:none;
	border:none;
	padding:0;
	margin:0 auto;
	max-width:100%; /* form wrapper fills its available parent width, centered */
	width:100%;
	color-scheme:dark;
	text-align:left; /* the parent .finale section sets text-align:center — reset it here so labels/inputs are never inherited-centered */
}

/* Field grid: two columns on desktop/tablet. DOM order already matches
   Name / Private-Company / Phone / Email / People / Rooms / Subject / Message,
   so plain grid auto-flow reproduces the requested layout with no reordering. */
:is(#wpforms-180,#wpforms-182,#wpforms-184) .wpforms-field-container{
	display:grid;
	grid-template-columns:1fr 1fr;
	column-gap:32px;
	row-gap:20px;
	align-items:start;
}
:is(#wpforms-180,#wpforms-182,#wpforms-184) .wpforms-field{
	margin:0;
	padding:0; /* WPForms core adds 15px 0 by default; the grid row-gap above already spaces fields, so remove it to avoid doubled-up vertical space */
	width:100%;
	min-width:0; /* allow grid items to shrink below content size so inputs can be 100% of a narrow column */
}
:is(#wpforms-180,#wpforms-182,#wpforms-184) [id$="-field_7-container"],
:is(#wpforms-180,#wpforms-182,#wpforms-184) [id$="-field_8-container"]{
	grid-column:1/-1;
}

/* Labels — left-aligned, light, native body font */
:is(#wpforms-180,#wpforms-182,#wpforms-184) .wpforms-field-label{
	display:block;
	text-align:left;
	color:#fff;
	font-family:'Manrope',system-ui,sans-serif;
	font-weight:700;
	font-size:14px;
	letter-spacing:.02em;
	margin:0 0 8px;
}
:is(#wpforms-180,#wpforms-182,#wpforms-184) .wpforms-required-label{
	color:#e2685a;
}

/* Inputs / textarea — full column width.
   WPForms core sets `.wpforms-field-medium{max-width:60%}` on inputs;
   explicitly restoring max-width:100% here is what makes the fields fill
   their grid column instead of shrinking to 60% of it. */
:is(#wpforms-180,#wpforms-182,#wpforms-184) input[type="text"],
:is(#wpforms-180,#wpforms-182,#wpforms-184) input[type="email"],
:is(#wpforms-180,#wpforms-182,#wpforms-184) input[type="number"],
:is(#wpforms-180,#wpforms-182,#wpforms-184) textarea{
	display:block;
	width:100%;
	max-width:100%;
	min-height:50px;
	background:rgba(236,245,252,.045);
	border:1px solid rgba(156,202,238,.16);
	border-radius:4px;
	padding:13px 16px;
	color:var(--ice);
	font-family:'Manrope',system-ui,sans-serif;
	font-size:15px;
	line-height:1.5;
	text-align:left;
	transition:border-color .3s var(--ease),box-shadow .3s var(--ease),background .3s var(--ease);
}
:is(#wpforms-180,#wpforms-182,#wpforms-184) textarea{
	min-height:120px;
	resize:vertical;
}
:is(#wpforms-180,#wpforms-182,#wpforms-184) input::placeholder,
:is(#wpforms-180,#wpforms-182,#wpforms-184) textarea::placeholder{
	color:rgba(236,245,252,.4);
}
:is(#wpforms-180,#wpforms-182,#wpforms-184) input:focus,
:is(#wpforms-180,#wpforms-182,#wpforms-184) textarea:focus{
	outline:none;
	border-color:var(--gold);
	background:rgba(236,245,252,.07);
	box-shadow:0 0 0 3px rgba(201,164,92,.16);
}
:is(#wpforms-180,#wpforms-182,#wpforms-184) input:focus-visible,
:is(#wpforms-180,#wpforms-182,#wpforms-184) textarea:focus-visible{
	outline:3px solid var(--gold);
	outline-offset:2px;
}

/* Multiple Choice — Private/Company field: styled as a bordered control
   the same height/width as the text inputs beside it, choices laid out
   horizontally where there is room. */
:is(#wpforms-180,#wpforms-182,#wpforms-184) .wpforms-field-radio fieldset{
	border:0;margin:0;padding:0;width:100%;
}
:is(#wpforms-180,#wpforms-182,#wpforms-184) .wpforms-field-radio legend.wpforms-field-label{
	width:100%;
}
:is(#wpforms-180,#wpforms-182,#wpforms-184) .wpforms-field-radio ul{
	list-style:none;
	display:flex;
	align-items:center;
	flex-wrap:wrap;
	gap:12px 28px;
	margin:0;
	width:100%;
	max-width:100%;
	min-height:50px;
	padding:13px 16px;
	background:rgba(236,245,252,.045);
	border:1px solid rgba(156,202,238,.16);
	border-radius:4px;
}
:is(#wpforms-180,#wpforms-182,#wpforms-184) .wpforms-field-radio li{
	display:flex;
	align-items:center;
	gap:10px;
	margin:0;
}
:is(#wpforms-180,#wpforms-182,#wpforms-184) .wpforms-field-radio label.wpforms-field-label-inline{
	color:var(--ice);
	font-family:'Manrope',system-ui,sans-serif;
	font-size:15px;
	cursor:pointer;
	margin:0;
}
:is(#wpforms-180,#wpforms-182,#wpforms-184) .wpforms-field-radio input[type="radio"]{
	appearance:none;
	-webkit-appearance:none;
	accent-color:var(--gold);
	width:19px;
	height:19px;
	margin:0;
	border:2px solid rgba(156,202,238,.45);
	border-radius:50%;
	background-color:transparent;
	cursor:pointer;
	flex:0 0 auto;
}
:is(#wpforms-180,#wpforms-182,#wpforms-184) .wpforms-field-radio input[type="radio"]:checked{
	border-color:var(--gold);
	background-image:radial-gradient(circle,var(--gold) 0 40%,transparent 42%);
}
:is(#wpforms-180,#wpforms-182,#wpforms-184) .wpforms-field-radio input[type="radio"]:focus-visible{
	outline:3px solid var(--gold);
	outline-offset:2px;
}

/* Submit button — reuses the site's existing .btn-gold gradient/shadow treatment */
:is(#wpforms-180,#wpforms-182,#wpforms-184) .wpforms-submit-container{
	display:flex;
	justify-content:center;
	margin-top:18px; /* +10px breathing room above the submit button, requested adjustment */
}
:is(#wpforms-180,#wpforms-182,#wpforms-184) button.wpforms-submit{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	gap:10px;
	padding:16px 34px;
	border:none;
	border-radius:2px;
	background:linear-gradient(115deg,var(--gold-lo),var(--gold) 45%,var(--gold-hi));
	color:var(--deep);
	font-family:'Manrope',system-ui,sans-serif;
	font-weight:800;
	font-size:14px;
	letter-spacing:.12em;
	text-transform:uppercase;
	box-shadow:0 10px 30px rgba(201,164,92,.35);
	cursor:pointer;
	transition:transform .35s var(--ease),box-shadow .35s var(--ease);
}
:is(#wpforms-180,#wpforms-182,#wpforms-184) button.wpforms-submit:hover{
	transform:translateY(-3px);
	box-shadow:0 18px 44px rgba(201,164,92,.45);
}
:is(#wpforms-180,#wpforms-182,#wpforms-184) button.wpforms-submit:focus-visible{
	outline:3px solid var(--gold);
	outline-offset:3px;
}

/* Validation error states */
:is(#wpforms-180,#wpforms-182,#wpforms-184) .wpforms-error{
	color:#ff8a80;
	font-size:13px;
	font-weight:600;
	margin-top:6px;
	display:block;
	text-align:left;
}
:is(#wpforms-180,#wpforms-182,#wpforms-184) input.wpforms-error,
:is(#wpforms-180,#wpforms-182,#wpforms-184) textarea.wpforms-error{
	border-color:#ff8a80;
	background:rgba(255,138,128,.06);
}

/* Confirmation message */
:is(#wpforms-180,#wpforms-182,#wpforms-184) .wpforms-confirmation-container-full{
	color:var(--ice);
	font-family:'Manrope',system-ui,sans-serif;
	font-size:17px;
	line-height:1.7;
	text-align:center;
	padding:20px 0;
}

/* Tablet: keep two columns but tighten the gap slightly once space gets tighter */
@media (max-width:900px){
	:is(#wpforms-180,#wpforms-182,#wpforms-184) .wpforms-field-container{
		column-gap:22px;
	}
}

/* Mobile: single column, in original field order, full-width submit */
@media (max-width:640px){
	:is(#wpforms-180,#wpforms-182,#wpforms-184) .wpforms-field-container{
		grid-template-columns:1fr;
		row-gap:18px;
	}
	:is(#wpforms-180,#wpforms-182,#wpforms-184) button.wpforms-submit{
		width:100%;
	}
}
