/* Reviewed post-canonical corrections. Keep source-116 assets byte-exact. */
.kl-modal-header{
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:16px;
}

/* Shared form primitives used by entity forms and embedded Custom Fields. */
.klusaro-custom-fields-form{
	box-sizing:border-box;
	grid-column:1/-1;
	min-width:0;
	margin:20px 0 0;
	padding:18px;
	border:1px solid #e5e7eb;
	border-radius:12px;
	background:#fff;
	color:#111827;
}

.klusaro-custom-fields-form>.kl-form-legend{
	max-width:100%;
	margin:0;
	padding:0 8px;
	color:#111827;
	font-size:16px;
	font-weight:700;
	line-height:1.35;
}

.kl-form-grid{
	display:grid;
	gap:16px;
	grid-template-columns:repeat(2,minmax(0,1fr));
}

.kl-form-field{
	display:grid;
	gap:7px;
	min-width:0;
}

/* WordPress themes commonly ship element/type selectors after application CSS.
 * Keep the Klusaro classes authoritative for both colour and geometry so every
 * module presents the same control primitive. Native choice, colour, and hidden
 * inputs retain their purpose-specific rendering below. */
input.kl-field:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="color"]),
select.kl-select,
textarea.kl-textarea,
input.kl-entity-picker__search{
	box-sizing:border-box!important;
	width:100%!important;
	min-height:40px!important;
	padding:10px 12px!important;
	border:1px solid #d1d5db!important;
	border-radius:10px!important;
	background:#fff!important;
	background-color:#fff!important;
	color:#111827!important;
	-webkit-text-fill-color:#111827!important;
	font-size:14px!important;
	line-height:1.45!important;
	opacity:1!important;
	color-scheme:light;
}

textarea.kl-textarea{
	min-height:120px!important;
	resize:vertical;
}

input.kl-field:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="color"]):focus,
select.kl-select:focus,
textarea.kl-textarea:focus,
input.kl-entity-picker__search:focus{
	outline:none!important;
	border-color:#111827!important;
	box-shadow:0 0 0 3px rgba(17,24,39,.08)!important;
}

input.kl-field:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="color"]):disabled,
input.kl-field:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="color"])[readonly],
select.kl-select:disabled,
textarea.kl-textarea:disabled,
textarea.kl-textarea[readonly],
input.kl-entity-picker__search:disabled,
input.kl-entity-picker__search[readonly]{
	background:#f3f4f6!important;
	background-color:#f3f4f6!important;
	color:#6b7280!important;
	-webkit-text-fill-color:#6b7280!important;
	cursor:not-allowed!important;
	opacity:1!important;
}

input.kl-field:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="color"])[aria-invalid="true"],
input.kl-field:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="color"]).is-invalid,
select.kl-select[aria-invalid="true"],
select.kl-select.is-invalid,
textarea.kl-textarea[aria-invalid="true"],
textarea.kl-textarea.is-invalid,
input.kl-entity-picker__search[aria-invalid="true"],
input.kl-entity-picker__search.is-invalid{
	border-color:#dc2626!important;
	box-shadow:0 0 0 3px rgba(220,38,38,.1)!important;
}

input.kl-field:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="color"]):-webkit-autofill,
textarea.kl-textarea:-webkit-autofill,
input.kl-entity-picker__search:-webkit-autofill{
	-webkit-box-shadow:0 0 0 1000px #fff inset!important;
	-webkit-text-fill-color:#111827!important;
}

/* Legacy Booking Forms markup also uses kl-field on label containers. Reset
 * that container role and give its otherwise-unclassed direct input the same visual
 * primitive without broadening the rule to arbitrary theme or third-party forms. */
label.kl-field{
	display:grid;
	gap:7px;
	width:auto;
	margin:0;
	padding:0;
	border:0;
	border-radius:0;
	background:transparent!important;
	color:inherit!important;
	font-size:inherit;
}

label.kl-field>input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="color"]){
	box-sizing:border-box;
	width:100%;
	min-height:40px;
	padding:10px 12px;
	border:1px solid #d1d5db;
	border-radius:10px;
	background:#fff!important;
	background-color:#fff!important;
	color:#111827!important;
	-webkit-text-fill-color:#111827!important;
	font-size:14px;
	color-scheme:light;
}

label.kl-field>input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="color"]):focus{
	outline:none;
	border-color:#111827;
	box-shadow:0 0 0 3px rgba(17,24,39,.08);
}

.kl-form-field>.kl-label,
.kl-choice-group>.kl-label{
	margin:0;
	padding:0;
	color:#374151!important;
	font-size:13px;
	font-weight:600;
	line-height:1.45;
}

.kl-form-field>.kl-label .kl-required,
.kl-choice-group>.kl-label .kl-required{
	margin-left:3px;
	color:#dc2626!important;
}

.kl-form-field>.kl-help,
.kl-choice-group>.kl-help{
	display:block;
	margin:0;
	color:#6b7280!important;
	font-size:12px;
	font-weight:400;
	line-height:1.45;
}

.kl-choice-group{
	min-inline-size:0;
	margin:0;
	padding:0;
	border:0;
}

.kl-radio-options{
	display:grid;
	gap:8px;
}

.kl-checkbox-row,
.kl-radio-row{
	display:flex;
	align-items:flex-start;
	flex-wrap:nowrap;
	gap:8px;
	min-width:0;
	margin:0;
	padding:0;
	color:#374151!important;
	font-size:13px;
	font-weight:400;
	line-height:1.45;
}

.kl-checkbox-row>input[type="checkbox"],
.kl-radio-row>input[type="radio"],
.kl-checkbox-row>label>input[type="checkbox"],
.kl-radio-row>label>input[type="radio"]{
	box-sizing:border-box;
	flex:0 0 16px;
	width:16px!important;
	height:16px!important;
	min-width:16px;
	min-height:16px;
	margin:2px 0 0!important;
	padding:0!important;
	border:1px solid #9ca3af;
	background:#fff!important;
	accent-color:#2271b1;
	color-scheme:light;
	filter:none!important;
}

.kl-checkbox-row>span,
.kl-radio-row>span{
	min-width:0;
}

.kl-checkbox-row>label,
.kl-radio-row>label{
	display:flex;
	align-items:flex-start;
	gap:8px;
	min-width:0;
	margin:0;
	padding:0;
	color:#374151!important;
	font-size:13px;
	font-weight:400;
	line-height:1.45;
}

div.kl-checkbox-row,
div.kl-radio-row{
	flex-wrap:wrap;
}

.kl-checkbox-row>input[type="checkbox"]:focus-visible,
.kl-radio-row>input[type="radio"]:focus-visible,
.kl-checkbox-row>label>input[type="checkbox"]:focus-visible,
.kl-radio-row>label>input[type="radio"]:focus-visible{
	outline:2px solid #2271b1;
	outline-offset:2px;
}

.kl-select[multiple]{
	min-height:112px!important;
	padding:7px 10px!important;
}

.kl-field:disabled,
.kl-select:disabled,
.kl-textarea:disabled,
.kl-field[readonly],
.kl-textarea[readonly]{
	background:#f3f4f6!important;
	background-color:#f3f4f6!important;
	color:#6b7280!important;
	-webkit-text-fill-color:#6b7280!important;
	cursor:not-allowed;
	opacity:1!important;
}

label.kl-field>input:disabled,
label.kl-field>input[readonly]{
	background:#f3f4f6!important;
	background-color:#f3f4f6!important;
	color:#6b7280!important;
	-webkit-text-fill-color:#6b7280!important;
	cursor:not-allowed;
	opacity:1!important;
}

.kl-field[aria-invalid="true"],
.kl-select[aria-invalid="true"],
.kl-textarea[aria-invalid="true"],
.kl-field.is-invalid,
.kl-select.is-invalid,
.kl-textarea.is-invalid{
	border-color:#dc2626!important;
	box-shadow:0 0 0 3px rgba(220,38,38,.1);
}

label.kl-field>input[aria-invalid="true"],
label.kl-field>input.is-invalid{
	border-color:#dc2626!important;
	box-shadow:0 0 0 3px rgba(220,38,38,.1);
}

.kl-field:-webkit-autofill,
.kl-textarea:-webkit-autofill{
	-webkit-box-shadow:0 0 0 1000px #fff inset!important;
	-webkit-text-fill-color:#111827!important;
}

label.kl-field>input:-webkit-autofill{
	-webkit-box-shadow:0 0 0 1000px #fff inset!important;
	-webkit-text-fill-color:#111827!important;
}

.kl-custom-field-textarea,
.kl-custom-field-multiselect{
	grid-column:1/-1;
}

@media(max-width:640px){
	.klusaro-custom-fields-form{
		padding:16px;
	}

	.kl-form-grid{
		grid-template-columns:minmax(0,1fr);
	}

	.kl-custom-field-textarea,
	.kl-custom-field-multiselect{
		grid-column:auto;
	}
}