/**
 * کنترل‌های فرم مدرن Nobex — input، select، textarea، checkbox، radio
 */

.nobex-otp,
.nobex-booking,
.nobex-wallet,
.nobex-my-bookings,
.nobex-dynamic-form,
.nobex-form-builder,
#nobex-dashboard {
	--nobex-accent: #2563eb;
	--nobex-accent-hover: #1d4ed8;
	--nobex-input-bg: #f8fafc;
	--nobex-input-bg-hover: #fff;
	--nobex-input-border: #e2e8f0;
	--nobex-input-border-hover: #cbd5e1;
	--nobex-input-text: #0f172a;
	--nobex-input-placeholder: #94a3b8;
	--nobex-input-radius: 10px;
	--nobex-input-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
	--nobex-input-focus-ring: 0 0 0 3px rgba(37, 99, 235, 0.14);
	--nobex-check-size: 20px;
	--nobex-form-padding: 24px 20px;
}

/* ── متن، عدد، ایمیل، select، textarea ── */

.nobex-otp__input,
.nobex-booking__input,
.nobex-booking__select,
.nobex-booking__textarea,
.nobex-wallet__input,
.nobex-dynamic-form__input,
.nobex-dynamic-form__textarea,
.nobex-dynamic-form__select,
.nobex-form-builder__prop input:not([type='checkbox']):not([type='radio']):not([type='color']),
.nobex-form-builder__prop select,
.nobex-form-builder__prop textarea,
#nobex-dashboard #nobex-form-select,
#nobex-dashboard #nobex-form-admin-title,
#nobex-dashboard #nobex-service-form,
#nobex-dashboard .nobex-dash__field input:not([type='checkbox']):not([type='radio']):not([type='color']),
#nobex-dashboard .nobex-dash__field select,
#nobex-dashboard .nobex-dash__field textarea,
#nobex-dashboard .nobex-dash__filters input,
#nobex-dashboard .nobex-dash__filters select,
#nobex-dashboard .nobex-dash__modal-box input:not([type='checkbox']):not([type='radio']),
#nobex-dashboard .nobex-dash__modal-box select,
#nobex-dashboard .nobex-dash__modal-box textarea,
#nobex-dashboard #nobex-sms-admin-mobile {
	display: block;
	width: 100%;
	padding: 11px 14px;
	border: 1.5px solid var(--nobex-input-border);
	border-radius: var(--nobex-input-radius);
	background-color: var(--nobex-input-bg);
	color: var(--nobex-input-text);
	font-size: 14px;
	line-height: 1.5;
	box-sizing: border-box;
	box-shadow: var(--nobex-input-shadow);
	transition: border-color 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease;
}

.nobex-otp-input,
input[data-otp],
input[data-nobex-code],
input[data-staff-code] {
	min-width: 11ch;
	max-width: 100%;
	font-size: 18px;
	line-height: 1.4;
	letter-spacing: 0.22em;
	font-variant-numeric: tabular-nums;
	text-align: center;
	padding-left: 18px;
	padding-right: 18px;
}

.nobex-booking [data-field-type="booking_otp"] .nobex-booking__widget,
.nobex-booking [data-field-type="booking_otp"] .nobex-otp-input {
	width: 100%;
	max-width: 100%;
}

.nobex-booking__select,
.nobex-dynamic-form__select,
#nobex-dashboard .nobex-dash__field select,
#nobex-dashboard .nobex-dash__filters select,
#nobex-dashboard #nobex-form-select,
#nobex-dashboard #nobex-form-admin-title,
#nobex-dashboard #nobex-service-form,
.nobex-form-builder__prop select {
	appearance: none;
	-webkit-appearance: none;
	padding-left: 36px;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2394a3b8' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: left 12px center;
	background-size: 16px;
	cursor: pointer;
}

.nobex-booking__textarea,
.nobex-dynamic-form__textarea,
.nobex-form-builder__prop textarea,
#nobex-dashboard .nobex-dash__field textarea,
#nobex-dashboard .nobex-dash__modal-box textarea {
	min-height: 88px;
	resize: vertical;
}

.nobex-otp__input::placeholder,
.nobex-booking__input::placeholder,
.nobex-booking__textarea::placeholder,
.nobex-wallet__input::placeholder,
.nobex-dynamic-form__input::placeholder,
.nobex-dynamic-form__textarea::placeholder,
#nobex-dashboard input::placeholder,
#nobex-dashboard textarea::placeholder {
	color: var(--nobex-input-placeholder);
	opacity: 1;
}

.nobex-otp__input:hover,
.nobex-booking__input:hover,
.nobex-booking__select:hover,
.nobex-booking__textarea:hover,
.nobex-wallet__input:hover,
.nobex-dynamic-form__input:hover,
.nobex-dynamic-form__textarea:hover,
.nobex-dynamic-form__select:hover,
.nobex-form-builder__prop input:not([type='checkbox']):not([type='radio']):not([type='color']):hover,
.nobex-form-builder__prop select:hover,
.nobex-form-builder__prop textarea:hover,
#nobex-dashboard #nobex-form-select:hover,
#nobex-dashboard #nobex-form-admin-title:hover,
#nobex-dashboard #nobex-service-form:hover,
#nobex-dashboard .nobex-dash__field input:not([type='checkbox']):not([type='radio']):not([type='color']):hover,
#nobex-dashboard .nobex-dash__field select:hover,
#nobex-dashboard .nobex-dash__field textarea:hover,
#nobex-dashboard .nobex-dash__filters input:hover,
#nobex-dashboard .nobex-dash__filters select:hover {
	border-color: var(--nobex-input-border-hover);
	background-color: var(--nobex-input-bg-hover);
}

.nobex-otp__input:focus,
.nobex-booking__input:focus,
.nobex-booking__select:focus,
.nobex-booking__textarea:focus,
.nobex-wallet__input:focus,
.nobex-dynamic-form__input:focus,
.nobex-dynamic-form__textarea:focus,
.nobex-dynamic-form__select:focus,
.nobex-form-builder__prop input:not([type='checkbox']):not([type='radio']):not([type='color']):focus,
.nobex-form-builder__prop select:focus,
.nobex-form-builder__prop textarea:focus,
#nobex-dashboard #nobex-form-select:focus,
#nobex-dashboard #nobex-form-admin-title:focus,
#nobex-dashboard #nobex-service-form:focus,
#nobex-dashboard .nobex-dash__field input:not([type='checkbox']):not([type='radio']):not([type='color']):focus,
#nobex-dashboard .nobex-dash__field select:focus,
#nobex-dashboard .nobex-dash__field textarea:focus,
#nobex-dashboard .nobex-dash__filters input:focus,
#nobex-dashboard .nobex-dash__filters select:focus,
#nobex-dashboard #nobex-sms-admin-mobile:focus {
	outline: none;
	border-color: var(--nobex-form-input-focus, var(--nobex-accent, #2563eb));
	background-color: var(--nobex-input-bg-hover);
	box-shadow: var(--nobex-input-focus-ring, 0 0 0 3px color-mix(in srgb, var(--nobex-form-input-focus, var(--nobex-accent, #2563eb)) 20%, transparent));
}

.nobex-otp__input:disabled,
.nobex-booking__input:disabled,
.nobex-booking__select:disabled,
.nobex-wallet__input:disabled,
.nobex-dynamic-form__input:disabled,
#nobex-dashboard input:disabled,
#nobex-dashboard select:disabled,
#nobex-dashboard textarea:disabled {
	opacity: 0.55;
	cursor: not-allowed;
	background-color: #f1f5f9;
}

#nobex-dashboard .nobex-dash__field input[type='color'] {
	width: 100%;
	height: 42px;
	padding: 4px;
	border: 1.5px solid var(--nobex-input-border);
	border-radius: var(--nobex-input-radius);
	background: var(--nobex-input-bg);
	cursor: pointer;
}

/* ── برچسب فیلد ── */

.nobex-otp__field label,
.nobex-wallet__field label,
.nobex-dynamic-form__label,
#nobex-dashboard .nobex-dash__field > label,
.nobex-form-builder__prop > label,
.nobex-form-builder__toolbar-field > label {
	display: block;
	margin-bottom: 6px;
	font-size: 13px;
	font-weight: 600;
	color: #475569;
	letter-spacing: -0.01em;
}

/* ── چک‌باکس و رادیو — ظاهر سفارشی ── */

.nobex-otp input[type='checkbox'],
.nobex-booking input[type='checkbox'],
.nobex-booking input[type='radio'],
.nobex-wallet input[type='checkbox'],
.nobex-dynamic-form input[type='checkbox'],
.nobex-dynamic-form input[type='radio'],
.nobex-form-builder input[type='checkbox'],
.nobex-form-builder input[type='radio'],
#nobex-dashboard input[type='checkbox'],
#nobex-dashboard input[type='radio'] {
	appearance: none;
	-webkit-appearance: none;
	flex-shrink: 0;
	width: var(--nobex-check-size);
	height: var(--nobex-check-size);
	margin: 0;
	border: 2px solid #cbd5e1;
	background: #fff;
	cursor: pointer;
	transition: border-color 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease;
}

.nobex-otp input[type='checkbox'],
.nobex-booking input[type='checkbox'],
.nobex-wallet input[type='checkbox'],
.nobex-dynamic-form input[type='checkbox'],
.nobex-form-builder input[type='checkbox'],
#nobex-dashboard input[type='checkbox'] {
	border-radius: 6px;
}

.nobex-booking input[type='radio'],
.nobex-dynamic-form input[type='radio'],
.nobex-form-builder input[type='radio'],
#nobex-dashboard input[type='radio'] {
	border-radius: 50%;
}

.nobex-otp input[type='checkbox']:hover,
.nobex-booking input[type='checkbox']:hover,
.nobex-booking input[type='radio']:hover,
.nobex-wallet input[type='checkbox']:hover,
.nobex-dynamic-form input[type='checkbox']:hover,
.nobex-dynamic-form input[type='radio']:hover,
.nobex-form-builder input[type='checkbox']:hover,
.nobex-form-builder input[type='radio']:hover,
#nobex-dashboard input[type='checkbox']:hover,
#nobex-dashboard input[type='radio']:hover {
	border-color: var(--nobex-accent);
}

.nobex-otp input[type='checkbox']:focus-visible,
.nobex-booking input[type='checkbox']:focus-visible,
.nobex-booking input[type='radio']:focus-visible,
.nobex-wallet input[type='checkbox']:focus-visible,
.nobex-dynamic-form input[type='checkbox']:focus-visible,
.nobex-dynamic-form input[type='radio']:focus-visible,
.nobex-form-builder input[type='checkbox']:focus-visible,
.nobex-form-builder input[type='radio']:focus-visible,
#nobex-dashboard input[type='checkbox']:focus-visible,
#nobex-dashboard input[type='radio']:focus-visible {
	outline: none;
	box-shadow: var(--nobex-input-focus-ring);
}

.nobex-otp input[type='checkbox']:checked,
.nobex-booking input[type='checkbox']:checked,
.nobex-wallet input[type='checkbox']:checked,
.nobex-dynamic-form input[type='checkbox']:checked,
.nobex-form-builder input[type='checkbox']:checked,
#nobex-dashboard input[type='checkbox']:checked {
	border-color: var(--nobex-accent);
	background-color: var(--nobex-accent);
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: center;
	background-size: 12px;
}

.nobex-booking input[type='radio']:checked,
.nobex-dynamic-form input[type='radio']:checked,
.nobex-form-builder input[type='radio']:checked,
#nobex-dashboard input[type='radio']:checked {
	border-color: var(--nobex-accent);
	background-color: #fff;
	box-shadow: inset 0 0 0 5px var(--nobex-accent);
}

/* ── ردیف چک‌باکس/رادیو ── */

.nobex-control-option,
.nobex-dynamic-form__option,
#nobex-dashboard .nobex-dash__field > label:has(> input[type='checkbox']),
#nobex-dashboard .nobex-dash__field > label:has(> input[type='radio']),
#nobex-dashboard .nobex-dash__sms-flags label,
.nobex-form-builder__prop-check,
.nobex-form-builder__prop label:has(> input[type='checkbox']),
.nobex-form-builder__prop label:has(> input[type='radio']) {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 10px 14px;
	margin: 0 0 8px;
	border: 1.5px solid var(--nobex-input-border);
	border-radius: var(--nobex-input-radius);
	background: var(--nobex-input-bg);
	font-size: 14px;
	font-weight: 500;
	color: var(--nobex-input-text);
	cursor: pointer;
	transition: border-color 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease;
	user-select: none;
}

.nobex-control-option:hover,
.nobex-dynamic-form__option:hover,
#nobex-dashboard .nobex-dash__field > label:has(> input[type='checkbox']):hover,
#nobex-dashboard .nobex-dash__field > label:has(> input[type='radio']):hover,
#nobex-dashboard .nobex-dash__sms-flags label:hover,
.nobex-form-builder__prop-check:hover,
.nobex-form-builder__prop label:has(> input[type='checkbox']):hover,
.nobex-form-builder__prop label:has(> input[type='radio']):hover {
	border-color: var(--nobex-input-border-hover);
	background: var(--nobex-input-bg-hover);
}

.nobex-control-option:has(input:checked),
.nobex-dynamic-form__option:has(input:checked),
#nobex-dashboard .nobex-dash__field > label:has(> input[type='checkbox']:checked),
#nobex-dashboard .nobex-dash__field > label:has(> input[type='radio']:checked),
#nobex-dashboard .nobex-dash__sms-flags label:has(input:checked),
.nobex-form-builder__prop-check:has(input:checked),
.nobex-form-builder__prop label:has(> input[type='checkbox']:checked),
.nobex-form-builder__prop label:has(> input[type='radio']:checked) {
	border-color: #93c5fd;
	background: #eff6ff;
}

.nobex-dynamic-form__options {
	display: flex;
	flex-direction: column;
	gap: 6px;
}

#nobex-dashboard .nobex-dash__sms-flags {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

/* ── دکمه‌های مشترک ── */

.nobex-btn,
.nobex-otp__btn,
.nobex-booking__btn,
.nobex-wallet__btn,
#nobex-dashboard .nobex-btn,
#nobex-dashboard button.nobex-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	padding: 11px 18px;
	border: 1.5px solid var(--nobex-input-border);
	border-radius: var(--nobex-input-radius);
	background: #fff;
	color: var(--nobex-input-text);
	font-family: var(--nobex-font);
	font-size: 14px;
	font-weight: 600;
	line-height: 1.2;
	text-decoration: none;
	cursor: pointer;
	box-shadow: var(--nobex-input-shadow);
	transition: border-color 0.2s ease, background-color 0.2s ease, color 0.2s ease, box-shadow 0.2s ease, transform 0.15s ease;
}

.nobex-btn[hidden],
.nobex-otp__btn[hidden],
.nobex-booking__btn[hidden],
.nobex-wallet__btn[hidden],
#nobex-dashboard .nobex-btn[hidden],
#nobex-dashboard button.nobex-btn[hidden] {
	display: none !important;
}

.nobex-btn:hover:not(:disabled),
.nobex-otp__btn:hover:not(:disabled),
.nobex-booking__btn:hover:not(:disabled),
.nobex-wallet__btn:hover:not(:disabled),
#nobex-dashboard .nobex-btn:hover:not(:disabled) {
	border-color: var(--nobex-input-border-hover);
	background: var(--nobex-input-bg-hover);
}

.nobex-btn:active:not(:disabled),
.nobex-otp__btn:active:not(:disabled),
.nobex-booking__btn:active:not(:disabled),
.nobex-wallet__btn:active:not(:disabled),
#nobex-dashboard .nobex-btn:active:not(:disabled) {
	transform: translateY(1px);
}

.nobex-btn:disabled,
.nobex-otp__btn:disabled,
.nobex-booking__btn:disabled,
.nobex-wallet__btn:disabled,
#nobex-dashboard .nobex-btn:disabled {
	opacity: 0.55;
	cursor: not-allowed;
	box-shadow: none;
}

.nobex-btn--primary,
.nobex-otp__btn--primary,
.nobex-booking__btn,
.nobex-wallet__btn,
#nobex-dashboard .nobex-btn--primary {
	background: linear-gradient(180deg, #3b82f6 0%, var(--nobex-accent) 100%);
	border-color: var(--nobex-accent);
	color: #fff;
	box-shadow: 0 4px 14px rgba(37, 99, 235, 0.28);
}

.nobex-btn--primary:hover:not(:disabled),
.nobex-otp__btn--primary:hover:not(:disabled),
.nobex-booking__btn:hover:not(:disabled),
.nobex-wallet__btn:hover:not(:disabled),
#nobex-dashboard .nobex-btn--primary:hover:not(:disabled) {
	background: linear-gradient(180deg, #3b82f6 0%, var(--nobex-accent-hover) 100%);
	border-color: var(--nobex-accent-hover);
	color: #fff;
	box-shadow: 0 6px 16px rgba(37, 99, 235, 0.32);
}

.nobex-btn--ghost,
.nobex-otp__btn:not(.nobex-otp__btn--primary):not(.nobex-otp__btn--secondary),
#nobex-dashboard .nobex-btn--ghost {
	background: var(--nobex-input-bg);
}

.nobex-btn--secondary,
.nobex-otp__btn--secondary,
#nobex-dashboard .nobex-btn--secondary {
	background: #fff;
	border-color: #cbd5e1;
	color: #475569;
}

.nobex-btn--secondary:hover:not(:disabled),
.nobex-otp__btn--secondary:hover:not(:disabled),
#nobex-dashboard .nobex-btn--secondary:hover:not(:disabled) {
	border-color: #94a3b8;
	background: #f8fafc;
	color: #0f172a;
}

.nobex-btn--outline,
#nobex-dashboard .nobex-btn--outline {
	background: #fff;
	border-color: #93c5fd;
	color: var(--nobex-accent);
	box-shadow: none;
}

.nobex-btn--outline:hover:not(:disabled),
#nobex-dashboard .nobex-btn--outline:hover:not(:disabled) {
	background: #eff6ff;
	border-color: var(--nobex-accent);
	color: var(--nobex-accent-hover);
}

.nobex-btn--danger,
#nobex-dashboard .nobex-btn--danger {
	color: #b91c1c;
	border-color: #fecaca;
	background: #fff5f5;
	box-shadow: none;
}

.nobex-btn--danger:hover:not(:disabled),
#nobex-dashboard .nobex-btn--danger:hover:not(:disabled) {
	border-color: #fca5a5;
	background: #fef2f2;
	color: #991b1b;
}

.nobex-btn--link,
#nobex-dashboard .nobex-btn--link {
	padding: 4px 8px;
	border: none;
	background: transparent;
	box-shadow: none;
	color: #b91c1c;
}

.nobex-btn--link:hover:not(:disabled),
#nobex-dashboard .nobex-btn--link:hover:not(:disabled) {
	background: #fef2f2;
	color: #991b1b;
}

.nobex-btn--sm,
#nobex-dashboard .nobex-btn--sm {
	padding: 6px 12px;
	font-size: 12px;
	border-radius: 8px;
}

.nobex-btn--block,
.nobex-wallet__btn,
#nobex-dashboard .nobex-btn--block {
	width: 100%;
}

.nobex-booking__footer .nobex-booking__btn,
.nobex-booking [data-booking-submit] {
	width: 100%;
}

.nobex-otp__actions {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.nobex-otp__actions .nobex-otp__btn {
	width: 100%;
}

#nobex-dashboard #nobex-form-select,
#nobex-dashboard #nobex-service-form {
	min-width: 0;
	max-width: 100%;
}

@media (max-width: 900px) {
	#nobex-dashboard #nobex-form-select,
	#nobex-dashboard #nobex-service-form {
		width: 100%;
	}
}