/* Work Orders — page-specific additions on top of the shared vx design system.
   Loaded globally via app.js alongside vx-design-system.css (see rationale there). */
.wo-filter-grid { display: grid; grid-template-columns: 2fr 1fr 1fr 1fr auto; gap: 12px; align-items: end; padding: 16px 24px; border-bottom: 1px solid #EEF1F6; }
@media (max-width: 900px) { .wo-filter-grid { grid-template-columns: 1fr; } }

.wo-table-row { display: grid; grid-template-columns: 2.4fr 1.6fr 1.6fr .9fr 1fr .9fr 90px; align-items: center; padding: 14px 24px; border-bottom: 1px solid #F1F4F9; text-decoration: none; color: inherit; }
.wo-table-row:hover { background: #F9FBFE; }
.wo-table-head { display: grid; grid-template-columns: 2.4fr 1.6fr 1.6fr .9fr 1fr .9fr 90px; padding: 12px 24px; background: #F7F9FC; border-bottom: 1px solid #EEF1F6; }
.wo-table-head span { font-size: 11px; font-weight: 700; letter-spacing: 0.06em; color: #7A869E; }

/* Vendor/Unit autocomplete fields render their own display input via JS — match vx-input visually */
.vendor-autocomplete-display, .unit-autocomplete-display {
    width: 100%; box-sizing: border-box; height: 42px; padding: 0 14px; border: 1px solid #D9E0EC;
    border-radius: 10px; font-size: 14px; color: #1C2540; outline: none; font-family: inherit; background: #fff;
}
.vendor-autocomplete-display:focus, .unit-autocomplete-display:focus { border-color: #3B6EF6; box-shadow: 0 0 0 3px rgba(59,110,246,.12); }