/**
 * Repair Order Form widget styles.
 *
 * Frontend styles for the Elementor Repair Order Form widget.
 */

@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@400;500;600;700&display=swap");
@import url("design-tokens.css");
@import url("components.css");
@import url("forms.css");
@import url("buttons.css");

.rt-repair-order-form {
	box-sizing: border-box;
	color: var(--rt-color-text);
	font-family: var(--rt-font-family);
	font-size: var(--rt-font-size-base);
	line-height: var(--rt-line-height-base);
}

.rt-repair-order-form *,
.rt-repair-order-form *::before,
.rt-repair-order-form *::after {
	box-sizing: inherit;
}

.rt-repair-order-form__title {
	margin: 0 0 var(--rt-space-5);
	color: var(--rt-color-text);
	font-size: var(--rt-font-size-2xl);
	font-weight: var(--rt-font-weight-semibold);
	line-height: var(--rt-line-height-tight);
}

.rt-repair-order-form .rt-form__section {
	overflow: hidden;
}

.rt-repair-order-form .rt-form__section + .rt-form__section {
	margin-top: 0;
}

.rt-repair-order-form .rt-form__actions {
	justify-content: flex-end;
	padding-top: var(--rt-space-4);
	border-top: 1px solid var(--rt-color-divider);
}

.rt-quick-add-device-form {
	display: flex;
	flex-direction: column;
	gap: var(--rt-space-4);
}

.rt-quick-add-device-form .rt-field {
	position: relative;
	min-width: 0;
}

.rt-quick-add-device-form select.select2-hidden-accessible {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	padding: 0 !important;
	margin: -1px !important;
	overflow: hidden !important;
	clip: rect(0, 0, 0, 0) !important;
	white-space: nowrap !important;
	border: 0 !important;
}

/* Popup Select2 — match native .rt-select height (containerCssClass may land on container or selection). */
.rt-quick-add-device-dialog .rt-quick-add-device-form .select2-container.select2-container--default {
	display: block;
	width: 100% !important;
	max-width: 100%;
}

.rt-quick-add-device-dialog .rt-quick-add-device-form .select2-container .select2-selection--single,
.rt-quick-add-device-dialog .rt-quick-add-device-form .select2-selection.select2-selection--single.rt-master-data-select2-container {
	box-sizing: border-box;
	position: relative;
	height: var(--rt-input-height-md);
	min-height: var(--rt-input-height-md);
}

/* The category field remains a native select; align its indicator with Select2. */
.rt-quick-add-device-dialog .rt-quick-add-device-form select.rt-select:not(.select2-hidden-accessible) {
	padding-right: 2.5rem;
	border: 1px solid #cbd5e1;
	border-radius: 6px;
	background-color: #fff;
	appearance: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%2364758b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right var(--rt-space-3) center;
	background-size: 0.75rem 0.5rem;
	color: #6b7280;
	transition: border-color 200ms ease, background-color 200ms ease, color 200ms ease;
}

.rt-quick-add-device-dialog .rt-quick-add-device-form select.rt-select:not(.select2-hidden-accessible):hover {
	border-color: #046bd2;
	background-color: #fff;
	color: #6b7280;
}

.rt-quick-add-device-dialog .rt-quick-add-device-form select.rt-select:not(.select2-hidden-accessible):focus {
	border-color: #046bd2;
	background-color: #fff;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23046bd2' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	color: #6b7280;
	outline: none;
	box-shadow: 0 0 0 3px rgba(4, 107, 210, .25);
}

.rt-quick-add-device-dialog
	.rt-quick-add-device-form
	select.rt-select:not(.select2-hidden-accessible):has(option:checked:not([value=""])) {
	border-color: #046bd2;
	background-color: #f0f7ff;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23046bd2' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	color: #046bd2;
	font-weight: 600;
}

.rt-quick-add-device-dialog .rt-quick-add-device-form select.rt-select option:checked {
	background: #f0f7ff;
	color: #046bd2;
	font-weight: 600;
}

.rt-quick-add-device-form__category-empty {
	margin: var(--rt-space-2) 0 0;
	padding: var(--rt-space-3);
	border: 1px dashed #cbd5e1;
	border-radius: 6px;
	background: #fff;
	color: #64748b;
	font-size: var(--rt-font-size-sm);
	text-align: center;
}

body.rt-dialog-open .select2-container--open.rt-master-data-select2-container,
body.rt-dialog-open .select2-container--open.rt-master-data-select2-dropdown-container,
body.rt-dialog-open .select2-dropdown.rt-master-data-select2-dropdown {
	z-index: 10000001;
}

.rt-popup-notice {
	margin: 0;
	padding: var(--rt-space-3);
	border-radius: var(--rt-radius-md);
	font-size: var(--rt-font-size-sm);
	line-height: var(--rt-line-height-base);
}

.rt-popup-notice.rt-error {
	border: 1px solid #f5c2c7;
	background: #f8d7da;
	color: #842029;
}

.rt-popup-notice[hidden] {
	display: none !important;
}

.rt-quick-add-device-dialog {
	z-index: 9999999;
}

.rt-quick-add-device-dialog .rt-dialog__overlay {
	z-index: 0;
	background: rgba(15, 23, 42, 0.55);
}

.rt-quick-add-device-dialog .rt-dialog__panel {
	z-index: 1;
	width: min(var(--rt-dialog-width-md), 100%);
	max-height: calc(100vh - 2rem);
}

.rt-quick-add-device-dialog .rt-dialog__header {
	padding: var(--rt-space-5) var(--rt-space-6);
}

.rt-quick-add-device-dialog .rt-dialog__close {
	box-sizing: border-box;
	display: flex;
	flex: 0 0 2rem;
	align-self: center;
	align-items: center;
	justify-content: center;
	padding: 0;
	line-height: 1;
}

.rt-quick-add-device-dialog .rt-dialog__body {
	padding: var(--rt-space-5) var(--rt-space-6);
}

.rt-quick-add-device-dialog .rt-dialog__footer {
	display: flex;
	flex-wrap: nowrap;
	align-items: center;
	justify-content: flex-end;
	gap: var(--rt-space-3);
	padding: var(--rt-space-4) var(--rt-space-6);
}

.rt-quick-add-device-dialog .rt-dialog__footer .rt-btn {
	min-width: 6.5rem;
	min-height: var(--rt-button-height-md);
}

.rt-quick-add-device-form__apply {
	margin-top: var(--rt-space-1);
}

.rt-quick-add-device-form__checkbox {
	display: inline-flex;
	align-items: flex-start;
	gap: var(--rt-space-2);
	color: var(--rt-color-text);
	font-size: var(--rt-font-size-sm);
	line-height: var(--rt-line-height-base);
	cursor: pointer;
}

.rt-quick-add-device-form__checkbox input[type="checkbox"] {
	flex: 0 0 auto;
	width: 1rem;
	height: 1rem;
	margin-top: 0.125rem;
}

.rt-quick-add-device-form__message {
	margin: 0;
	padding: var(--rt-space-3);
	border-radius: var(--rt-radius-md);
	font-size: var(--rt-font-size-sm);
	line-height: var(--rt-line-height-base);
}

.rt-quick-add-device-form__message--success {
	color: var(--rt-color-success-text, #0f5132);
	background: var(--rt-color-success-bg, #d1e7dd);
}

.rt-quick-add-device-form__message--error {
	color: var(--rt-color-danger-text, #842029);
	background: var(--rt-color-danger-bg, #f8d7da);
}