/* office-widgets.css: the Office Dashboard's widget styles, copied VERBATIM from public/office.html (and the
   brand variables from public/style.css) so other FieldHub sections (Inventory) look exactly the same.
   test/inventory-look.test.js fails if any rule here stops matching office.html / style.css. */
:root {
  --orange: #F47920;
  --orange-dark: #d4680f;
  --orange-light: #fde8d4;
  --black: #111111;
  --graphite: #2e3138;
  --dark: #1c1c1e;
  --gray-900: #1f1f1f;
  --gray-700: #3a3a3a;
  --gray-500: #6e6e6e;
  --gray-300: #c7c7cc;
  --gray-100: #f2f2f7;
  --gray-50: #f9f9fb;
  --white: #ffffff;
  --red: #d9342b;
  --green: #28a745;
  --radius: 10px;
  --radius-sm: 6px;
  --shadow: 0 2px 12px rgba(0,0,0,0.10);
  --shadow-lg: 0 8px 32px rgba(0,0,0,0.16);
  --font: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}
.home-card { background:#fff; border-radius:var(--radius); box-shadow:var(--shadow); padding:20px 22px; }
.home-card-title { font-size:13px; font-weight:800; text-transform:uppercase; letter-spacing:.07em; color:var(--orange); margin-bottom:14px; display:flex; align-items:center; gap:6px; }
.home-stat-row { display:flex; justify-content:space-between; align-items:center; padding:6px 0; border-bottom:1px solid var(--gray-100); font-size:13px; }
.home-stat-row:last-of-type { border-bottom:none; }
.home-stat-num { font-size:22px; font-weight:800; color:var(--dark); min-width:36px; text-align:right; }
.home-stat-num.orange { color:var(--orange); }
.home-card .view-link { display:block; margin-top:14px; font-size:12px; font-weight:700; color:var(--orange); text-decoration:none; letter-spacing:.03em; }
.home-card .view-link:hover { text-decoration:underline; }
.activity-feed { background:#fff; border-radius:var(--radius); box-shadow:var(--shadow); padding:20px 22px; }
.activity-feed h3 { font-size:14px; font-weight:800; margin-bottom:14px; }
.activity-item { display:flex; gap:12px; align-items:flex-start; padding:7px 0; border-bottom:1px solid var(--gray-100); font-size:13px; }
.activity-item:last-child { border-bottom:none; }
.po-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.po-table th { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: var(--gray-500); padding: 8px 12px; background: var(--gray-50); border-bottom: 1px solid var(--gray-100); text-align: left; white-space: nowrap; }
.po-table td { padding: 10px 12px; border-bottom: 1px solid var(--gray-100); vertical-align: middle; }
.po-table tr:last-child td { border-bottom: none; }
.po-status { display: inline-flex; align-items: center; padding: 2px 10px; border-radius: 20px; font-size: 11px; font-weight: 700; text-transform: uppercase; white-space: nowrap; }
.po-status.Open     { background: #fff3cd; color: #856404; }
.po-status.Entered  { background: #d4edda; color: #155724; }
.po-status.Archived { background: var(--gray-100); color: var(--gray-500); }
/* Purchase Orders page: filter bar, table wrapper, status pills and filter chips (office.html, verbatim) */
.po-table-wrap { overflow-x: auto; }
.po-filter-bar { background: white; border-radius: var(--radius); box-shadow: var(--shadow); padding: 14px 18px; margin-bottom: 16px; display: flex; flex-wrap: wrap; gap: 10px; align-items: flex-end; }
.po-filter-bar .form-group { flex: 1; min-width: 130px; margin: 0; }
.po-filter-bar .form-label { font-size: 11px; }
.po-filter-bar .form-control { padding: 7px 10px; font-size: 13px; }
.po-cb { width: 15px; height: 15px; accent-color: var(--orange); cursor: pointer; }
.stock-badge { display: inline-flex; align-items: center; padding: 1px 7px; background: var(--gray-900, #1c1c1e); color: white; border-radius: 10px; font-size: 10px; font-weight: 800; letter-spacing: .06em; }
.spill { display:inline-block; padding:2px 9px; border-radius:20px; font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.03em; white-space:nowrap; }
.spill-open     { background:#fde8e8; color:#9b1c1c; }
.spill-reviewed { background:#fef9c3; color:#92400e; }
.spill-po-entered { background:#dcfce7; color:#166534; }
.spill-archived { background:#f3f4f6; color:#4b5563; }
.clear-filter-btn { background:var(--orange-light); color:var(--orange-dark); border:none; border-radius:16px; padding:3px 12px; font-size:12px; font-weight:700; cursor:pointer; display:none; }
.clear-filter-btn.visible { display:inline-block; }