/* =============================================================================
   OrganicSystem — Professional ERP Form
   Complements os-forms.css / os-section-container.css. No field renames.
   ============================================================================= */

.os-erp-form-page,
.os-erp-form,
form[data-os-erp-form="on"] {
  --os-erp-form-accent: var(--os-color-primary, #0f766e);
  --os-erp-form-danger: var(--os-color-danger, #b42318);
  --os-erp-form-surface: var(--os-color-surface, #fff);
  --os-erp-form-muted: var(--os-color-surface-muted, #f4f4f4);
  --os-erp-form-border: var(--os-color-border, #d0d5dd);
}

/* Page shell */
.os-erp-form-page {
  min-width: 0;
  max-width: 100%;
}

.os-erp-form-page .os-page-scroll {
  min-width: 0;
}

/* Sticky toolbar is owned by the shell chrome host (site.js / os-scroll-engine).
   Do not re-stick headers here — mid-page sticky recreates hollow viewport gaps. */
.os-erp-form-page .os-desktop-page-header,
.os-erp-form-page .os-page-sticky-chrome {
  background: var(--os-erp-form-surface);
}

/* Professional form surface */
form.os-erp-form,
form[data-os-erp-form="on"] {
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
  min-width: 0;
  max-width: 100%;
}

/* Adaptive denser controls — LocalInvoice form-row (28px) */
form.os-erp-form .form-control,
form.os-erp-form .form-select,
form[data-os-erp-form="on"] .form-control,
form[data-os-erp-form="on"] .form-select {
  min-height: var(--os-form-row-height, 28px);
}

form.os-erp-form textarea.form-control,
form[data-os-erp-form="on"] textarea.form-control {
  min-height: 5rem;
}

/* Validation */
form.os-erp-form .is-invalid,
form.os-erp-form .os-erp-form-invalid,
form[data-os-erp-form="on"] .is-invalid,
form[data-os-erp-form="on"] .os-erp-form-invalid {
  border-color: var(--os-erp-form-danger) !important;
  box-shadow: 0 0 0 0.15rem rgba(180, 35, 24, 0.12);
}

form.os-erp-form .os-erp-form-field-message,
form[data-os-erp-form="on"] .os-erp-form-field-message {
  color: var(--os-erp-form-danger);
  font-size: 0.78rem;
  margin-top: 0.2rem;
}

form.os-erp-form .validation-summary-errors,
form[data-os-erp-form="on"] .validation-summary-errors,
.os-erp-form-page .validation-summary-errors {
  /* Fills/borders finalized in os-states-theme.css (UI-1.13). */
  border-radius: 0.4rem;
  padding: 0.65rem 0.85rem;
  margin-bottom: 0.75rem;
}

.os-erp-form-page .alert.os-erp-form-alert,
.os-erp-form-page .alert-danger {
  border-radius: 0.4rem;
}

/* Dirty save cue on toolbar */
[data-os-toolbar="save"].os-erp-form-save-dirty,
body.os-erp-form-is-dirty [data-os-toolbar="save"] {
  box-shadow: inset 0 -2px 0 var(--os-erp-form-accent);
}

body.os-erp-form-is-dirty [data-os-toolbar="save"]::after {
  content: '';
  display: inline-block;
  width: 0.4rem;
  height: 0.4rem;
  margin-left: 0.35rem;
  border-radius: 50%;
  background: var(--os-erp-form-accent);
  vertical-align: middle;
}

/* Focus ring for keyboard navigation */
form.os-erp-form :focus-visible,
form[data-os-erp-form="on"] :focus-visible {
  outline: 2px solid color-mix(in srgb, var(--os-erp-form-accent) 70%, white);
  outline-offset: 1px;
}

/* Responsive: stack actions / keep sections readable */
@media (max-width: 767.98px), (orientation: portrait) {
  .os-erp-form-page .os-desktop-page-header {
    flex-wrap: wrap;
    gap: 0.5rem;
  }

  form.os-erp-form,
  form[data-os-erp-form="on"] {
    gap: 0.65rem;
  }
}

/* Required marker when aria/html required is present — do not change names */
form.os-erp-form label.form-label:has(+ .form-control[required])::after,
form.os-erp-form label.form-label:has(+ .form-select[required])::after,
form.os-erp-form th:has(+ td .form-control[required])::after,
form.os-erp-form th:has(+ td .form-select[required])::after,
form.os-erp-form label.form-label:has(~ [required])::after {
  content: ' *';
  color: var(--os-erp-form-danger);
  font-weight: 700;
}

/* Shared file/document cell + inline add-row used by Training and similar Edit pages.
   Geometry is finalized in os-erp-page-system.css. */
.os-form-file-row {
  min-width: 0;
}

.os-inline-add-form {
  min-width: 0;
}