/* =============================================================================
   OrganicSystem — UI-1.3 Global Input & Form Control Standardization
   Shared Light/Dark form-control theme layer. Consumes --os-input-* /
   --os-color-* semantic tokens. Does NOT touch buttons or validation logic.
   Load AFTER os-theme-apply.css so form-control states win without fighting
   os-buttons-theme.css.
   ============================================================================= */

/* ---- Shared field selector (text-like controls only; exclude button inputs) ---- */
.form-control,
.form-select,
.form-control-sm,
.form-select-sm,
textarea.form-control,
input[type="text"],
input[type="number"],
input[type="email"],
input[type="password"],
input[type="search"],
input[type="tel"],
input[type="url"],
input[type="date"],
input[type="time"],
input[type="datetime-local"],
input[type="month"],
input[type="week"],
select.form-select,
select:not([multiple]).form-select,
.login-input,
input.login-input,
select.login-input,
.dx-texteditor,
.dx-texteditor.dx-editor-outlined,
.dx-texteditor-input,
.dx-selectbox,
.dx-datebox,
.dx-numberbox,
.dx-textarea,
.dx-tagbox,
.dx-dropdownbox,
.dx-lookup,
.dx-autocomplete,
.module-main-filter-select,
.module-main-filter-select-multiple,
.prs-station-select,
.rotation-toolbar-select {
  background-color: var(--os-input-bg, var(--os-color-form-control-bg)) !important;
  color: var(--os-input-text, var(--os-color-input-text)) !important;
  border-color: var(--os-input-border, var(--os-color-form-border)) !important;
  -webkit-text-fill-color: var(--os-input-text, var(--os-color-input-text));
  caret-color: var(--os-input-text, var(--os-color-input-text));
  color-scheme: inherit;
}

/* ---- Placeholder ---- */
.form-control::placeholder,
.form-select::placeholder,
input::placeholder,
textarea::placeholder,
.dx-placeholder,
.dx-placeholder::before {
  color: var(--os-input-placeholder, var(--os-color-placeholder)) !important;
  -webkit-text-fill-color: var(--os-input-placeholder, var(--os-color-placeholder));
  opacity: 1;
}

/* ---- Hover ---- */
.form-control:hover:not(:disabled):not([readonly]):not(.is-invalid):not(.is-valid),
.form-select:hover:not(:disabled):not([readonly]):not(.is-invalid):not(.is-valid),
.dx-texteditor:hover:not(.dx-state-disabled):not(.dx-state-readonly):not(.dx-state-focused):not(.dx-invalid) {
  border-color: var(--os-color-border-strong, var(--os-border)) !important;
  background-color: var(--os-input-hover-bg, var(--os-color-input-hover)) !important;
}

/* ---- Focus (specificity beats os-theme-apply input:not([...]) chain) ---- */
.form-control:focus,
.form-control:focus-visible,
.form-select:focus,
.form-select:focus-visible,
input.form-control:focus:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):not([type="hidden"]):not([type="button"]):not([type="submit"]):not([type="reset"]):not([type="image"]),
input.form-control:focus-visible:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):not([type="hidden"]):not([type="button"]):not([type="submit"]):not([type="reset"]):not([type="image"]),
input:focus:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):not([type="hidden"]):not([type="button"]):not([type="submit"]):not([type="reset"]):not([type="image"]),
.dx-texteditor.dx-state-focused,
.dx-texteditor.dx-state-focused .dx-texteditor-input {
  background-color: var(--os-input-focus-bg, var(--os-color-input-focus)) !important;
  border-color: var(--os-input-focus-border, var(--os-color-focus-border)) !important;
  box-shadow: 0 0 0 0.15rem var(--os-input-focus-ring, var(--os-color-focus-ring)) !important;
  color: var(--os-input-text, var(--os-color-input-text)) !important;
  -webkit-text-fill-color: var(--os-input-text, var(--os-color-input-text));
  outline: none;
}

/* ---- Readonly (distinct from disabled) ---- */
.form-control[readonly]:not(:disabled),
.form-select[readonly]:not(:disabled),
input[readonly]:not(:disabled):not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):not([type="hidden"]):not([type="button"]):not([type="submit"]):not([type="reset"]),
textarea[readonly]:not(:disabled),
.dx-state-readonly .dx-texteditor-input,
.dx-texteditor.dx-state-readonly,
.dx-texteditor.dx-state-readonly .dx-texteditor-input {
  background-color: var(--os-input-readonly-bg, var(--os-color-input-readonly)) !important;
  color: var(--os-input-text, var(--os-color-input-text)) !important;
  -webkit-text-fill-color: var(--os-input-text, var(--os-color-input-text));
  border-color: var(--os-input-border, var(--os-color-form-border)) !important;
  opacity: 1;
}

/* ---- Disabled ---- */
.form-control:disabled,
.form-select:disabled,
input:disabled:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):not([type="hidden"]):not([type="button"]):not([type="submit"]):not([type="reset"]),
textarea:disabled,
.dx-state-disabled .dx-texteditor-input,
.dx-texteditor.dx-state-disabled,
.dx-texteditor.dx-state-disabled .dx-texteditor-input {
  background-color: var(--os-input-disabled-bg, var(--os-disabled, var(--os-color-input-disabled))) !important;
  color: var(--os-text-muted, var(--os-color-text-muted)) !important;
  -webkit-text-fill-color: var(--os-text-muted, var(--os-color-text-muted));
  border-color: var(--os-input-border, var(--os-color-form-border)) !important;
  opacity: 0.85;
  cursor: not-allowed;
}

/* ---- Validation: error (visual only — does not change rules/binding) ----
   Specificity must beat os-theme-apply’s long input:not([...]) chain. */
.form-control.is-invalid,
.form-select.is-invalid,
.was-validated .form-control:invalid,
.was-validated .form-select:invalid,
input.form-control.is-invalid:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):not([type="hidden"]):not([type="button"]):not([type="submit"]):not([type="reset"]):not([type="image"]),
input.is-invalid:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):not([type="hidden"]):not([type="button"]):not([type="submit"]):not([type="reset"]):not([type="image"]),
.was-validated input.form-control:invalid:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):not([type="hidden"]):not([type="button"]):not([type="submit"]):not([type="reset"]):not([type="image"]),
.dx-invalid .dx-texteditor-input,
.dx-texteditor.dx-invalid,
.dx-texteditor.dx-invalid .dx-texteditor-input {
  background-color: var(--os-input-error-bg, var(--os-color-input-error)) !important;
  border-color: var(--os-danger, var(--os-color-danger)) !important;
  color: var(--os-input-text, var(--os-color-input-text)) !important;
  -webkit-text-fill-color: var(--os-input-text, var(--os-color-input-text));
}

.form-control.is-invalid:focus,
.form-select.is-invalid:focus,
.was-validated .form-control:invalid:focus,
input.form-control.is-invalid:focus:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):not([type="hidden"]):not([type="button"]):not([type="submit"]):not([type="reset"]):not([type="image"]),
.dx-texteditor.dx-invalid.dx-state-focused,
.dx-texteditor.dx-invalid.dx-state-focused .dx-texteditor-input {
  border-color: var(--os-danger, var(--os-color-danger)) !important;
  box-shadow: 0 0 0 0.15rem color-mix(in srgb, var(--os-danger, var(--os-color-danger)) 28%, transparent) !important;
}

.invalid-feedback,
.field-validation-error,
.validation-summary-errors,
span[data-valmsg-for].field-validation-error {
  color: var(--os-danger, var(--os-color-danger));
}

/* ---- Validation: success ---- */
.form-control.is-valid,
.form-select.is-valid,
.was-validated .form-control:valid,
.was-validated .form-select:valid,
input.form-control.is-valid:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):not([type="hidden"]):not([type="button"]):not([type="submit"]):not([type="reset"]):not([type="image"]),
input.is-valid:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):not([type="hidden"]):not([type="button"]):not([type="submit"]):not([type="reset"]):not([type="image"]),
.was-validated input.form-control:valid:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):not([type="hidden"]):not([type="button"]):not([type="submit"]):not([type="reset"]):not([type="image"]) {
  background-color: var(--os-input-success-bg, var(--os-color-input-success)) !important;
  border-color: var(--os-success, var(--os-color-success)) !important;
  color: var(--os-input-text, var(--os-color-input-text)) !important;
  -webkit-text-fill-color: var(--os-input-text, var(--os-color-input-text));
}

.form-control.is-valid:focus,
.form-select.is-valid:focus,
.was-validated .form-control:valid:focus,
input.form-control.is-valid:focus:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):not([type="hidden"]):not([type="button"]):not([type="submit"]):not([type="reset"]):not([type="image"]) {
  border-color: var(--os-success, var(--os-color-success)) !important;
  box-shadow: 0 0 0 0.15rem color-mix(in srgb, var(--os-success, var(--os-color-success)) 28%, transparent) !important;
}

.valid-feedback {
  color: var(--os-success, var(--os-color-success));
}

/* ---- Checkbox / radio ---- */
.form-check-input,
.form-check-input[type="checkbox"],
.form-check-input[type="radio"],
.dx-checkbox-icon,
.dx-radiobutton-icon {
  background-color: var(--os-input-bg, var(--os-color-checkbox, var(--os-color-form-control-bg))) !important;
  border-color: var(--os-color-checkbox-border, var(--os-input-border, var(--os-color-border-strong))) !important;
}

.form-check-input:hover:not(:disabled),
.dx-checkbox:not(.dx-state-disabled):hover .dx-checkbox-icon,
.dx-radiobutton:not(.dx-state-disabled):hover .dx-radiobutton-icon {
  border-color: var(--os-color-border-strong, var(--os-border)) !important;
}

.form-check-input:focus,
.form-check-input:focus-visible {
  border-color: var(--os-input-focus-border, var(--os-color-focus-border)) !important;
  box-shadow: 0 0 0 0.15rem var(--os-input-focus-ring, var(--os-color-focus-ring)) !important;
}

.form-check-input:checked,
.dx-checkbox-checked .dx-checkbox-icon {
  background-color: var(--os-color-checkbox-checked-bg, var(--os-primary, var(--os-color-primary))) !important;
  border-color: var(--os-color-checkbox-checked-border, var(--os-primary, var(--os-color-primary))) !important;
}

.form-check-input[type="radio"]:checked {
  background-color: var(--os-color-radio-checked-bg, var(--os-primary, var(--os-color-primary))) !important;
  border-color: var(--os-color-radio-checked-bg, var(--os-primary, var(--os-color-primary))) !important;
}

.form-check-input:disabled {
  background-color: var(--os-input-disabled-bg, var(--os-color-input-disabled)) !important;
  border-color: var(--os-input-border, var(--os-color-form-border)) !important;
  opacity: 0.65;
  cursor: not-allowed;
}

/* ---- Switch (Bootstrap form-switch) ---- */
.form-switch .form-check-input {
  background-image: var(--bs-form-switch-bg);
  background-color: var(--os-input-bg, var(--os-color-form-control-bg)) !important;
  border-color: var(--os-color-checkbox-border, var(--os-input-border)) !important;
}

.form-switch .form-check-input:focus {
  background-image: var(--bs-form-switch-bg);
  border-color: var(--os-input-focus-border, var(--os-color-focus-border)) !important;
  box-shadow: 0 0 0 0.15rem var(--os-input-focus-ring, var(--os-color-focus-ring)) !important;
}

.form-switch .form-check-input:checked {
  background-color: var(--os-color-checkbox-checked-bg, var(--os-primary, var(--os-color-primary))) !important;
  border-color: var(--os-color-checkbox-checked-border, var(--os-primary, var(--os-color-primary))) !important;
}

.form-switch .form-check-input:disabled {
  background-color: var(--os-input-disabled-bg, var(--os-color-input-disabled)) !important;
  opacity: 0.65;
}

/* ---- DevExtreme Switch ---- */
.dx-switch-container,
.dx-switch-wrapper {
  border-color: var(--os-input-border, var(--os-color-form-border)) !important;
}

.dx-switch-handle::before {
  background-color: var(--os-surface, var(--os-color-surface)) !important;
}

.dx-switch-on-value .dx-switch-container,
.dx-switch.dx-state-active .dx-switch-container {
  background-color: var(--os-color-checkbox-checked-bg, var(--os-primary)) !important;
  border-color: var(--os-color-checkbox-checked-border, var(--os-primary)) !important;
}

.dx-switch:not(.dx-switch-on-value) .dx-switch-container {
  background-color: var(--os-input-bg, var(--os-color-form-control-bg)) !important;
}

.dx-switch.dx-state-disabled .dx-switch-container {
  background-color: var(--os-input-disabled-bg, var(--os-color-input-disabled)) !important;
  opacity: 0.65;
}

/* ---- Editor chrome icons ---- */
.dx-texteditor .dx-icon,
.dx-texteditor .dx-dropdowneditor-icon,
.dx-texteditor .dx-icon-clear,
.dx-texteditor .dx-icon-search,
.dx-texteditor .dx-icon-date,
.dx-texteditor .dx-icon-clock,
.dx-texteditor .dx-icon-spin-up,
.dx-texteditor .dx-icon-spin-down {
  color: var(--os-color-icon-muted, var(--os-text-muted)) !important;
}

/* ---- Labels (theme text; no layout change) ---- */
label.form-label,
.form-label,
.col-form-label,
.form-check-label {
  color: var(--os-color-form-label-text, var(--os-text));
}

/* ---- Autofill: prevent white flash / unreadable text in both themes ---- */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
select:-webkit-autofill {
  -webkit-text-fill-color: var(--os-input-text, var(--os-color-input-text)) !important;
  caret-color: var(--os-input-text, var(--os-color-input-text));
  box-shadow: 0 0 0 1000px var(--os-input-bg, var(--os-color-form-control-bg)) inset !important;
  transition: background-color 99999s ease-out 0s;
  border-color: var(--os-input-border, var(--os-color-form-border)) !important;
}

/* ---- Dark: native date/time + DX popup editors (base only — states win above) ---- */
html[data-theme="dark"] .form-control:not(:disabled):not([readonly]):not(.is-invalid):not(.is-valid),
html[data-theme="dark"] .form-select:not(:disabled):not([readonly]):not(.is-invalid):not(.is-valid),
html[data-theme="dark"] input[type="date"]:not(:disabled):not([readonly]),
html[data-theme="dark"] input[type="time"]:not(:disabled):not([readonly]),
html[data-theme="dark"] input[type="datetime-local"]:not(:disabled):not([readonly]),
html[data-theme="dark"] .dx-texteditor:not(.dx-state-disabled):not(.dx-state-readonly):not(.dx-invalid),
html[data-theme="dark"] .dx-texteditor:not(.dx-state-disabled):not(.dx-state-readonly):not(.dx-invalid) .dx-texteditor-input,
html[data-theme="dark"] .dx-dropdowneditor-overlay .dx-texteditor,
html[data-theme="dark"] .dx-dropdowneditor-overlay .dx-texteditor-input,
html[data-theme="dark"] .dx-header-filter-menu .dx-texteditor,
html[data-theme="dark"] .dx-header-filter-menu .dx-texteditor-input {
  background-color: var(--os-input-bg, var(--os-color-form-control-bg)) !important;
  color: var(--os-input-text, var(--os-color-input-text)) !important;
  border-color: var(--os-input-border, var(--os-color-form-border)) !important;
  -webkit-text-fill-color: var(--os-input-text, var(--os-color-input-text));
}

html[data-theme="dark"] input[type="date"]::-webkit-calendar-picker-indicator,
html[data-theme="dark"] input[type="time"]::-webkit-calendar-picker-indicator,
html[data-theme="dark"] input[type="datetime-local"]::-webkit-calendar-picker-indicator {
  filter: invert(0.85);
  opacity: 0.85;
}

/* ---- Light: never inherit dark field colors when theme flips (base only) ---- */
html[data-theme="light"] .form-control:not(:disabled):not([readonly]):not(.is-invalid):not(.is-valid),
html[data-theme="light"] .form-select:not(:disabled):not([readonly]):not(.is-invalid):not(.is-valid),
html[data-theme="light"] input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):not([type="hidden"]):not([type="button"]):not([type="submit"]):not([type="reset"]):not([type="image"]):not(:disabled):not([readonly]):not(.is-invalid):not(.is-valid),
html[data-theme="light"] textarea:not(:disabled):not([readonly]):not(.is-invalid):not(.is-valid),
html[data-theme="light"] .dx-texteditor:not(.dx-state-disabled):not(.dx-state-readonly):not(.dx-invalid),
html[data-theme="light"] .dx-texteditor:not(.dx-state-disabled):not(.dx-state-readonly):not(.dx-invalid) .dx-texteditor-input {
  background-color: var(--os-input-bg, var(--os-color-form-control-bg)) !important;
  color: var(--os-input-text, var(--os-color-input-text)) !important;
  border-color: var(--os-input-border, var(--os-color-form-border)) !important;
  -webkit-text-fill-color: var(--os-input-text, var(--os-color-input-text));
}

/* Reinforce state colors under both themes (higher specificity than theme base) */
html[data-theme="light"] .form-control[readonly]:not(:disabled),
html[data-theme="dark"] .form-control[readonly]:not(:disabled),
html[data-theme="light"] .form-select[readonly]:not(:disabled),
html[data-theme="dark"] .form-select[readonly]:not(:disabled),
html[data-theme="light"] input[readonly]:not(:disabled):not([type="checkbox"]):not([type="radio"]):not([type="button"]):not([type="submit"]):not([type="reset"]),
html[data-theme="dark"] input[readonly]:not(:disabled):not([type="checkbox"]):not([type="radio"]):not([type="button"]):not([type="submit"]):not([type="reset"]),
html[data-theme="light"] textarea[readonly]:not(:disabled),
html[data-theme="dark"] textarea[readonly]:not(:disabled) {
  background-color: var(--os-input-readonly-bg, var(--os-color-input-readonly)) !important;
  color: var(--os-input-text, var(--os-color-input-text)) !important;
  -webkit-text-fill-color: var(--os-input-text, var(--os-color-input-text));
}

html[data-theme="light"] .form-control:disabled,
html[data-theme="dark"] .form-control:disabled,
html[data-theme="light"] .form-select:disabled,
html[data-theme="dark"] .form-select:disabled,
html[data-theme="light"] input:disabled:not([type="checkbox"]):not([type="radio"]):not([type="button"]):not([type="submit"]):not([type="reset"]),
html[data-theme="dark"] input:disabled:not([type="checkbox"]):not([type="radio"]):not([type="button"]):not([type="submit"]):not([type="reset"]),
html[data-theme="light"] textarea:disabled,
html[data-theme="dark"] textarea:disabled {
  background-color: var(--os-input-disabled-bg, var(--os-disabled, var(--os-color-input-disabled))) !important;
  color: var(--os-text-muted, var(--os-color-text-muted)) !important;
  -webkit-text-fill-color: var(--os-text-muted, var(--os-color-text-muted));
}

html[data-theme="light"] input.form-control.is-invalid:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):not([type="hidden"]):not([type="button"]):not([type="submit"]):not([type="reset"]):not([type="image"]),
html[data-theme="dark"] input.form-control.is-invalid:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):not([type="hidden"]):not([type="button"]):not([type="submit"]):not([type="reset"]):not([type="image"]),
html[data-theme="light"] .form-select.is-invalid,
html[data-theme="dark"] .form-select.is-invalid,
html[data-theme="light"] .was-validated input.form-control:invalid:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):not([type="hidden"]):not([type="button"]):not([type="submit"]):not([type="reset"]):not([type="image"]),
html[data-theme="dark"] .was-validated input.form-control:invalid:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):not([type="hidden"]):not([type="button"]):not([type="submit"]):not([type="reset"]):not([type="image"]) {
  background-color: var(--os-input-error-bg, var(--os-color-input-error)) !important;
  border-color: var(--os-danger, var(--os-color-danger)) !important;
  color: var(--os-input-text, var(--os-color-input-text)) !important;
  -webkit-text-fill-color: var(--os-input-text, var(--os-color-input-text));
}

html[data-theme="light"] input.form-control.is-valid:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):not([type="hidden"]):not([type="button"]):not([type="submit"]):not([type="reset"]):not([type="image"]),
html[data-theme="dark"] input.form-control.is-valid:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):not([type="hidden"]):not([type="button"]):not([type="submit"]):not([type="reset"]):not([type="image"]),
html[data-theme="light"] .form-select.is-valid,
html[data-theme="dark"] .form-select.is-valid,
html[data-theme="light"] .was-validated input.form-control:valid:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):not([type="hidden"]):not([type="button"]):not([type="submit"]):not([type="reset"]):not([type="image"]),
html[data-theme="dark"] .was-validated input.form-control:valid:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):not([type="hidden"]):not([type="button"]):not([type="submit"]):not([type="reset"]):not([type="image"]) {
  background-color: var(--os-input-success-bg, var(--os-color-input-success)) !important;
  border-color: var(--os-success, var(--os-color-success)) !important;
  color: var(--os-input-text, var(--os-color-input-text)) !important;
  -webkit-text-fill-color: var(--os-input-text, var(--os-color-input-text));
}