.nobex-dynamic-form {
	display: flex;
	flex-direction: column;
	gap: var(--nobex-form-section-gap, 16px);
	margin: 12px 0;
	padding: var(--nobex-form-padding, 24px 20px);
	border-radius: var(--nobex-panel-radius, 12px);
	box-sizing: border-box;
	color: var(--nobex-form-text, #0f172a);
	font-size: var(--nobex-form-font-size, 14px);
	background: var(--nobex-form-bg, transparent);
}

.nobex-dynamic-form__section-fields,
.nobex-dynamic-form--flat {
	display: grid;
	grid-template-columns: repeat(12, minmax(0, 1fr));
	gap: var(--nobex-form-gap, 12px);
	align-items: start;
}

.nobex-dynamic-form--flat {
	margin: 0;
	padding: 0;
	border: none;
	background: transparent;
	box-shadow: none;
}

.nobex-dynamic-form--flat .nobex-dynamic-form__field--full,
.nobex-dynamic-form--flat .nobex-dynamic-form__field--half,
.nobex-dynamic-form--flat .nobex-dynamic-form__field--span {
	width: auto;
	min-width: 0;
}

.nobex-dynamic-form__field[data-col-span] {
	grid-column: span var(--nobex-field-col-span, 12);
}

.nobex-dynamic-form__field[data-col-span="1"] { --nobex-field-col-span: 1; }
.nobex-dynamic-form__field[data-col-span="2"] { --nobex-field-col-span: 2; }
.nobex-dynamic-form__field[data-col-span="3"] { --nobex-field-col-span: 3; }
.nobex-dynamic-form__field[data-col-span="4"] { --nobex-field-col-span: 4; }
.nobex-dynamic-form__field[data-col-span="5"] { --nobex-field-col-span: 5; }
.nobex-dynamic-form__field[data-col-span="6"] { --nobex-field-col-span: 6; }
.nobex-dynamic-form__field[data-col-span="7"] { --nobex-field-col-span: 7; }
.nobex-dynamic-form__field[data-col-span="8"] { --nobex-field-col-span: 8; }
.nobex-dynamic-form__field[data-col-span="9"] { --nobex-field-col-span: 9; }
.nobex-dynamic-form__field[data-col-span="10"] { --nobex-field-col-span: 10; }
.nobex-dynamic-form__field[data-col-span="11"] { --nobex-field-col-span: 11; }
.nobex-dynamic-form__field[data-col-span="12"] { --nobex-field-col-span: 12; }

.nobex-booking .nobex-dynamic-form {
	margin: 0;
	padding: 0;
	border-radius: 0;
	background: transparent;
}

.nobex-dynamic-form__section {
	display: flex;
	flex-direction: column;
	gap: var(--nobex-form-gap, 12px);
	margin-bottom: var(--nobex-form-section-gap, 16px);
}

.nobex-dynamic-form__section-title {
	margin: 0 0 2px;
	font-size: calc(var(--nobex-form-label-size, 13px) + 1px);
	font-weight: 700;
	color: var(--nobex-form-text, #334155);
}

.nobex-dynamic-form__section-fields {
	width: 100%;
}

.nobex-dynamic-form__title {
	margin: 0 0 4px;
	font-size: calc(var(--nobex-form-font-size, 14px) + 1px);
	font-weight: 700;
	font-family: var(--nobex-font, 'IRANYekan', Tahoma, Arial, sans-serif);
	color: var(--nobex-form-accent, #2563eb);
}

.nobex-dynamic-form__field {
	display: flex;
	flex-direction: column;
	gap: 6px;
	min-width: 0;
}

.nobex-dynamic-form__field--full,
.nobex-dynamic-form__field--half,
.nobex-dynamic-form__field--span {
	grid-column: span var(--nobex-field-col-span, 12);
}

.nobex-dynamic-form__field--half {
	--nobex-field-col-span: 6;
}

.nobex-dynamic-form__required {
	color: var(--nobex-form-required-color, #dc2626);
}

.nobex-dynamic-form__label {
	color: var(--nobex-form-label, #475569);
	font-size: var(--nobex-form-label-size, 13px);
	font-weight: 600;
}

.nobex-dynamic-form__input,
.nobex-dynamic-form__textarea,
.nobex-dynamic-form__select {
	border-style: solid;
	border-radius: var(--nobex-form-radius, 10px);
	border-width: var(--nobex-form-border-width, 1px);
	border-color: var(--nobex-form-input-border, #e2e8f0);
	background: var(--nobex-form-input-bg, #ffffff);
	color: var(--nobex-form-text, #0f172a);
	padding: var(--nobex-form-input-padding, 10px);
	font-size: var(--nobex-form-font-size, 14px);
	box-shadow: none;
}

.nobex-dynamic-form__input:focus,
.nobex-dynamic-form__textarea:focus,
.nobex-dynamic-form__select:focus {
	border-color: var(--nobex-form-input-focus, var(--nobex-form-accent, #2563eb));
	box-shadow: 0 0 0 3px color-mix(in srgb, var(--nobex-form-input-focus, var(--nobex-form-accent, #2563eb)) 20%, transparent);
}

.nobex-dynamic-form__widget-placeholder {
	padding: 14px 16px;
	border: 1px dashed var(--nobex-form-input-border, #cbd5e1);
	border-radius: var(--nobex-form-radius, 8px);
	background: color-mix(in srgb, var(--nobex-form-input-bg, #f8fafc) 90%, #f1f5f9);
	color: var(--nobex-form-label, #64748b);
	font-size: 13px;
}

.nobex-dynamic-form__booking-row {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	gap: 8px;
	align-items: stretch;
	width: 100%;
	max-width: 100%;
	min-width: 0;
	box-sizing: border-box;
}

.nobex-dynamic-form__booking-row .nobex-dynamic-form__input {
	flex: 1 1 0;
	min-width: 0;
	width: auto;
	max-width: 100%;
}

.nobex-dynamic-form__booking-row .nobex-dynamic-form__preview-btn,
.nobex-dynamic-form__booking-row .nobex-booking__btn {
	flex: 0 0 auto;
	width: auto;
	max-width: none;
	white-space: nowrap;
}

.nobex-dynamic-form__time-slots {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
}

.nobex-dynamic-form__time-slot {
	padding: 8px 12px;
	border: var(--nobex-form-border-width, 1px) solid var(--nobex-form-input-border, #e2e8f0);
	border-radius: var(--nobex-form-radius, 8px);
	background: var(--nobex-form-input-bg, #fff);
	color: var(--nobex-form-text, #0f172a);
	font-size: var(--nobex-form-font-size, 13px);
	cursor: default;
}

.nobex-dynamic-form__time-slot:first-child {
	border-color: var(--nobex-form-accent, #2563eb);
	background: color-mix(in srgb, var(--nobex-form-accent, #2563eb) 10%, #fff);
	color: var(--nobex-form-accent, #2563eb);
}

.nobex-dynamic-form__field--compact .nobex-dynamic-form__label {
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.nobex-dynamic-form__time-slots--compact {
	display: flex;
	flex-wrap: nowrap;
	gap: 4px;
	overflow: hidden;
}

.nobex-dynamic-form__venue-seats {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 6px;
}

.nobex-dynamic-form__venue-seat {
	padding: 8px 6px;
	border: var(--nobex-form-border-width, 1px) solid var(--nobex-form-input-border, #e2e8f0);
	border-radius: var(--nobex-form-radius, 8px);
	background: var(--nobex-form-input-bg, #fff);
	color: var(--nobex-form-text, #0f172a);
	font-size: var(--nobex-form-font-size, 12px);
	cursor: default;
	text-align: center;
}

.nobex-dynamic-form__venue-seat--active,
.nobex-dynamic-form__venue-seat:first-child {
	border-color: var(--nobex-form-accent, #2563eb);
	background: color-mix(in srgb, var(--nobex-form-accent, #2563eb) 10%, #fff);
	color: var(--nobex-form-accent, #2563eb);
}

.nobex-dynamic-form__venue-seats--compact {
	display: flex;
	flex-wrap: nowrap;
	gap: 4px;
	overflow: hidden;
}

.nobex-dynamic-form__venue-seats--compact .nobex-dynamic-form__venue-seat {
	min-width: 34px;
	padding: 6px 4px;
}

.nobex-dynamic-form__help {
	font-size: var(--nobex-form-help-size, 12px);
	color: var(--nobex-form-help-color, #6b7280);
}

.nobex-dynamic-form--labels-inline .nobex-dynamic-form__field {
	flex-direction: row;
	align-items: center;
	flex-wrap: wrap;
	gap: 8px 12px;
}

.nobex-dynamic-form--labels-inline .nobex-dynamic-form__label {
	flex: 0 0 auto;
	min-width: 88px;
	margin: 0;
}

.nobex-dynamic-form--labels-inline .nobex-dynamic-form__input,
.nobex-dynamic-form--labels-inline .nobex-dynamic-form__select,
.nobex-dynamic-form--labels-inline .nobex-dynamic-form__textarea,
.nobex-dynamic-form--labels-inline .nobex-dynamic-form__booking-row,
.nobex-dynamic-form--labels-inline .nobex-dynamic-form__time-slots,
.nobex-dynamic-form--labels-inline .nobex-dynamic-form__options {
	flex: 1;
	min-width: 140px;
}

.nobex-dynamic-form--labels-inline .nobex-dynamic-form__help {
	flex-basis: 100%;
	margin-right: calc(88px + 12px);
}

@media (max-width: 640px) {
	.nobex-dynamic-form__section-fields,
	.nobex-dynamic-form--flat {
		grid-template-columns: 1fr;
	}

	.nobex-dynamic-form__field[data-col-span],
	.nobex-dynamic-form__field--full,
	.nobex-dynamic-form__field--half,
	.nobex-dynamic-form__field--span {
		grid-column: 1 / -1 !important;
		--nobex-field-col-span: 1;
	}

	.nobex-dynamic-form__booking-row {
		flex-direction: column;
	}
}

.nobex-birth-date-parts {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 10px;
	width: 100%;
}

.nobex-birth-date-parts--compact {
	gap: 6px;
}

.nobex-birth-date-parts__item {
	display: flex;
	flex-direction: column;
	gap: 4px;
	min-width: 0;
}

.nobex-birth-date-parts__label {
	font-size: 11px;
	font-weight: 600;
	color: var(--nobex-form-label, #475569);
}

.nobex-birth-date-parts .nobex-dynamic-form__input,
.nobex-birth-date-parts .nobex-dynamic-form__select {
	width: 100%;
	min-width: 0;
}

.nobex-birth-date-parts--invalid .nobex-dynamic-form__input,
.nobex-birth-date-parts--invalid .nobex-dynamic-form__select {
	border-color: #dc2626;
}

.nobex-birth-date-parts--compact .nobex-birth-date-parts__label {
	font-size: 10px;
}

.nobex-birth-date-parts--compact .nobex-dynamic-form__input,
.nobex-birth-date-parts--compact .nobex-dynamic-form__select {
	font-size: 12px;
	padding: 6px 8px;
}

@media (max-width: 420px) {
	.nobex-birth-date-parts {
		grid-template-columns: 1fr;
	}
}

.nobex-dynamic-form__row {
	grid-column: 1 / -1;
	display: flex;
	flex-direction: column;
	gap: var(--nobex-form-gap, 12px);
}

.nobex-dynamic-form__row-title {
	font-size: calc(var(--nobex-form-label-size, 13px) + 1px);
	font-weight: 700;
	color: var(--nobex-form-label, #475569);
}

.nobex-dynamic-form__row-grid {
	display: grid;
	grid-template-columns: repeat(var(--nobex-row-columns, 2), minmax(0, 1fr));
	gap: var(--nobex-form-gap, 12px);
	align-items: start;
}

.nobex-dynamic-form__row-col {
	display: flex;
	flex-direction: column;
	gap: var(--nobex-form-gap, 12px);
	min-width: 0;
}

.nobex-dynamic-form__row-col .nobex-dynamic-form__field {
	width: 100%;
}

.nobex-dynamic-form__options--checkbox-group {
	display: flex;
	flex-direction: column;
	gap: 8px;
}

@media (max-width: 640px) {
	.nobex-dynamic-form__row-grid {
		grid-template-columns: 1fr;
	}
}