/*
 * ADI Form Standardization v20260516
 * Final typography/form override layer for Advanced Domestic Intelligence.
 * Loaded after module CSS so legacy Master Data screens keep layout but use one UI language.
 */
:root {
  --adi-ui-font-family: Arial, Aptos, Helvetica, sans-serif;
  --adi-ui-body-size: 13px;
  --adi-ui-label-size: 12px;
  --adi-ui-field-size: 12px;
  --adi-ui-button-size: 12px;
  --adi-ui-table-size: 12px;
  --adi-ui-table-head-size: 11px;
  --adi-ui-title-size: 18px;
  --adi-ui-subtitle-size: 12px;
  --adi-ui-field-height: 36px;
  --adi-ui-radius: 10px;
  --adi-ui-border: #cbd5e1;
  --adi-ui-border-soft: #e2e8f0;
  --adi-ui-focus: rgba(249, 115, 22, .16);
  --adi-ui-orange: #f97316;
  --adi-ui-text: #0f172a;
  --adi-ui-muted: #64748b;
  --adi-ui-bg-soft: #f8fafc;
}

html body,
html body button,
html body input,
html body select,
html body textarea,
html body table,
html body th,
html body td,
html body label,
html body a,
html body .workspace-shell,
html body .app-main {
  font-family: var(--adi-ui-font-family) !important;
}

html body {
  font-size: var(--adi-ui-body-size) !important;
  color: var(--adi-ui-text);
}

html body .master-data-page,
html body .port-management-module,
html body .liner-management-module,
html body .route-master-module,
html body .route-pic-module,
html body .user-management-module,
html body .menu-management-module,
html body .standard-form,
html body .app-modal-box,
html body .pm-modal-card,
html body .route-modal-box,
html body .route-pic-modal-box {
  font-family: var(--adi-ui-font-family) !important;
  font-size: var(--adi-ui-body-size) !important;
  color: var(--adi-ui-text) !important;
}

/* Headings and helper copy */
html body .module-header h2,
html body .port-section-title,
html body .route-panel-header h3,
html body .route-pic-toolbar h2,
html body .pm-modal-head h2,
html body .pm-modal-title,
html body .route-modal-box h3,
html body .route-pic-modal-box h3,
html body .app-modal-box h3,
html body .app-modal-title,
html body .user-editor-panel-title,
html body .permission-title {
  font-family: var(--adi-ui-font-family) !important;
  font-size: var(--adi-ui-title-size) !important;
  line-height: 1.25 !important;
  font-weight: 800 !important;
  letter-spacing: -.01em !important;
  color: var(--adi-ui-text) !important;
}

html body .module-header p,
html body .pm-subtitle,
html body .route-muted,
html body .route-pic-toolbar p,
html body .app-modal-subtitle,
html body .pm-modal-subtitle,
html body .user-editor-panel-subtitle,
html body .permission-subtitle,
html body .table-empty,
html body .muted,
html body .small {
  font-family: var(--adi-ui-font-family) !important;
  font-size: var(--adi-ui-subtitle-size) !important;
  line-height: 1.45 !important;
  font-weight: 400 !important;
  color: var(--adi-ui-muted) !important;
}

/* Labels */
html body label,
html body .standard-form label,
html body .compact-modal-form label,
html body .module-filter-row label,
html body .pm-form-grid label,
html body .pm-field label,
html body .lm-field label,
html body .route-form-grid label,
html body .route-field label,
html body .route-pic-form-grid label,
html body .route-pic-field label,
html body .toolbar label,
html body .pm-filter label,
html body .lm-cost-form label,
html body .permission-table label {
  font-family: var(--adi-ui-font-family) !important;
  font-size: var(--adi-ui-label-size) !important;
  line-height: 1.25 !important;
  font-weight: 700 !important;
  letter-spacing: .01em !important;
  color: #334155 !important;
}

/* Form controls */
html body input,
html body select,
html body textarea,
html body .standard-form input,
html body .standard-form select,
html body .standard-form textarea,
html body .compact-modal-form input,
html body .compact-modal-form select,
html body .compact-modal-form textarea,
html body .module-filter-row input,
html body .module-filter-row select,
html body .pm-form-grid input,
html body .pm-form-grid select,
html body .pm-form-grid textarea,
html body .pm-filter input,
html body .pm-filter select,
html body .pm-search-field,
html body .pm-city-input,
html body .lm-field input,
html body .lm-field select,
html body .lm-cost-table input,
html body .lm-cost-table select,
html body .route-search-row input,
html body .route-form-grid input,
html body .route-form-grid select,
html body .route-form-grid textarea,
html body .route-combo-input,
html body .route-pic-search-field input,
html body .route-pic-form-grid input,
html body .route-pic-form-grid select,
html body .route-pic-form-grid textarea,
html body .route-pic-combo-input {
  font-family: var(--adi-ui-font-family) !important;
  font-size: var(--adi-ui-field-size) !important;
  font-weight: 400 !important;
  line-height: 1.35 !important;
  color: var(--adi-ui-text) !important;
  box-sizing: border-box !important;
  border: 1px solid var(--adi-ui-border) !important;
  border-radius: var(--adi-ui-radius) !important;
  background-color: #fff !important;
  box-shadow: none !important;
}

html body input:not([type="checkbox"]):not([type="radio"]),
html body select,
html body .standard-form input:not([type="checkbox"]):not([type="radio"]),
html body .standard-form select,
html body .compact-modal-form input:not([type="checkbox"]):not([type="radio"]),
html body .compact-modal-form select,
html body .module-filter-row input:not([type="checkbox"]):not([type="radio"]),
html body .module-filter-row select,
html body .pm-form-grid input:not([type="checkbox"]):not([type="radio"]),
html body .pm-form-grid select,
html body .pm-filter input:not([type="checkbox"]):not([type="radio"]),
html body .pm-filter select,
html body .pm-search-field,
html body .pm-city-input,
html body .lm-field input:not([type="checkbox"]):not([type="radio"]),
html body .lm-field select,
html body .lm-cost-table input:not([type="checkbox"]):not([type="radio"]),
html body .lm-cost-table select,
html body .route-search-row input,
html body .route-form-grid input:not([type="checkbox"]):not([type="radio"]),
html body .route-form-grid select,
html body .route-combo-input,
html body .route-pic-search-field input,
html body .route-pic-form-grid input:not([type="checkbox"]):not([type="radio"]),
html body .route-pic-form-grid select,
html body .route-pic-combo-input {
  min-height: var(--adi-ui-field-height) !important;
  height: var(--adi-ui-field-height) !important;
  padding: 0 11px !important;
}

html body textarea,
html body .standard-form textarea,
html body .compact-modal-form textarea,
html body .pm-form-grid textarea,
html body .route-form-grid textarea,
html body .route-pic-form-grid textarea {
  min-height: 76px !important;
  padding: 9px 11px !important;
  resize: vertical !important;
}

html body input::placeholder,
html body textarea::placeholder {
  color: #94a3b8 !important;
  font-size: var(--adi-ui-field-size) !important;
  font-weight: 400 !important;
}

html body input:focus,
html body select:focus,
html body textarea:focus,
html body .route-combo-input:focus,
html body .route-pic-combo-input:focus,
html body .pm-city-input:focus {
  outline: none !important;
  border-color: var(--adi-ui-orange) !important;
  box-shadow: 0 0 0 3px var(--adi-ui-focus) !important;
}

html body input[readonly],
html body select[readonly],
html body textarea[readonly],
html body input:disabled,
html body select:disabled,
html body textarea:disabled {
  background-color: var(--adi-ui-bg-soft) !important;
  color: #64748b !important;
  opacity: 1 !important;
}

html body input[type="checkbox"],
html body input[type="radio"] {
  width: 16px !important;
  height: 16px !important;
  min-height: 16px !important;
  accent-color: var(--adi-ui-orange) !important;
}

/* Buttons */
html body button,
html body .btn,
html body .btn-mini,
html body .pm-btn,
html body .pm-add-btn,
html body .pm-icon-btn,
html body .pm-page-btn,
html body .lm-mini-btn,
html body .route-btn,
html body .route-action-btn,
html body .route-pic-btn,
html body .route-pic-action-btn,
html body .app-modal-close,
html body .pm-modal-close {
  font-family: var(--adi-ui-font-family) !important;
  font-size: var(--adi-ui-button-size) !important;
  line-height: 1.2 !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
}

html body .btn,
html body .pm-add-btn,
html body .pm-btn,
html body .route-btn,
html body .route-pic-btn {
  min-height: var(--adi-ui-field-height) !important;
  border-radius: var(--adi-ui-radius) !important;
  padding: 0 14px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
}

html body .btn-mini,
html body .pm-icon-btn,
html body .pm-page-btn,
html body .route-action-btn,
html body .route-pic-action-btn,
html body .lm-mini-btn {
  font-size: 11px !important;
  min-height: 28px !important;
  border-radius: 8px !important;
  padding: 0 9px !important;
}

/* Tables */
html body table,
html body .data-table,
html body .pm-data-table,
html body .lm-cost-table,
html body .route-table,
html body .route-pic-table,
html body .permission-table {
  font-family: var(--adi-ui-font-family) !important;
  font-size: var(--adi-ui-table-size) !important;
  color: var(--adi-ui-text) !important;
}

html body th,
html body .data-table thead th,
html body .pm-data-table thead th,
html body .lm-cost-table thead th,
html body .route-table thead th,
html body .route-pic-table thead th,
html body .permission-table thead th {
  font-family: var(--adi-ui-font-family) !important;
  font-size: var(--adi-ui-table-head-size) !important;
  line-height: 1.25 !important;
  font-weight: 800 !important;
  letter-spacing: .03em !important;
  text-transform: uppercase !important;
  color: #475569 !important;
}

html body td,
html body .data-table tbody td,
html body .pm-data-table tbody td,
html body .lm-cost-table tbody td,
html body .route-table tbody td,
html body .route-pic-table tbody td,
html body .permission-table tbody td {
  font-family: var(--adi-ui-font-family) !important;
  font-size: var(--adi-ui-table-size) !important;
  line-height: 1.35 !important;
  font-weight: 400 !important;
  color: var(--adi-ui-text) !important;
}

/* Modal/form layout consistency */
html body .app-modal-box,
html body .pm-modal-card,
html body .route-modal-box,
html body .route-pic-modal-box {
  font-size: var(--adi-ui-body-size) !important;
  border-radius: 18px !important;
}

html body .standard-form,
html body .compact-modal-form,
html body .pm-form-grid,
html body .route-form-grid,
html body .route-pic-form-grid {
  font-size: var(--adi-ui-body-size) !important;
}

html body .form-two-col,
html body .pm-form-grid,
html body .route-form-grid,
html body .route-pic-form-grid {
  gap: 12px !important;
}

html body .field-error,
html body .form-error,
html body .pm-error,
html body .route-error,
html body .route-pic-error {
  font-family: var(--adi-ui-font-family) !important;
  font-size: 12px !important;
  line-height: 1.35 !important;
}

/* Route PIC was using fixed 300px controls; make it responsive without changing markup. */
html body .route-pic-form-grid {
  grid-template-columns: minmax(120px, .34fr) minmax(0, 1fr) !important;
  align-items: center !important;
}

html body .route-pic-form-grid input,
html body .route-pic-form-grid select,
html body .route-pic-form-grid textarea,
html body .route-pic-combo,
html body .route-pic-combo-input,
html body .route-pic-combo-panel,
html body .route-form-grid input,
html body .route-form-grid select,
html body .route-form-grid textarea,
html body .route-combo,
html body .route-combo-input,
html body .route-combo-panel {
  width: 100% !important;
  max-width: 100% !important;
}

html body .module-filter-row,
html body .pm-filter-row,
html body .route-search-row,
html body .route-pic-search-row {
  font-size: var(--adi-ui-body-size) !important;
}

@media (max-width: 760px) {
  :root {
    --adi-ui-field-height: 38px;
  }

  html body .form-two-col,
  html body .pm-form-grid,
  html body .route-form-grid,
  html body .route-pic-form-grid {
    grid-template-columns: 1fr !important;
  }

  html body .route-pic-form-grid label,
  html body .route-form-grid label {
    margin-bottom: -4px !important;
  }

  html body .module-header,
  html body .route-panel-header,
  html body .route-pic-toolbar,
  html body .pm-panel-head {
    gap: 10px !important;
  }
}