/* ==================================================
   OPMS UI THEME
   Professional • Fast • Hospital-grade
================================================== */

:root {
  --cadet-gray: #88a2aa;
  --orange-peel: #ff9f1c;
  --rich-black: #0f1a20;
  --apple-green: #72b01d;
  --office-green: #3f7d20;
  --surface-muted: #f6f8f7;
  --border-subtle: #dbe3df;
  --success: #277a4b;
  --warning: #9a6700;
  --danger: #b42318;
  --info: #175cd3;
  --text-muted: #667085;
  --surface-raised: #ffffff;

  --radius-lg: 1rem;
  --radius-xl: 1.5rem;
  --transition-fast: 0.15s ease;
}

/* ===============================
   Base
=============================== */
body {
  font-family: 'Inter', system-ui, sans-serif;
  background-color: #f9fafb;
  color: var(--rich-black);
  -webkit-font-smoothing: antialiased;
}

/* ===============================
   Login
=============================== */
.login-card {
  background: #ffffff;
  border-radius: var(--radius-xl);
  box-shadow: 0 6px 16px rgba(15, 26, 32, 0.08);
  padding: 2.25rem;
  max-width: 420px;
  animation: fadeInUp 0.4s ease forwards;
}

.login-card h1 {
  color: var(--office-green);
  letter-spacing: -0.5px;
}

/* ===============================
   Inputs
=============================== */
.input-field {
  width: 100%;
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-lg);
  padding: 0.6rem 1rem;
  font-size: 0.95rem;
  transition: border-color var(--transition-fast),
              box-shadow var(--transition-fast);
}

select.input-field {
  appearance: none;
  padding-right: 2.5rem;
  background-color: var(--surface-raised);
  background-image: linear-gradient(45deg, transparent 50%, var(--text-muted) 50%), linear-gradient(135deg, var(--text-muted) 50%, transparent 50%);
  background-position: calc(100% - 1.1rem) 1.1rem, calc(100% - 0.75rem) 1.1rem;
  background-size: 0.35rem 0.35rem, 0.35rem 0.35rem;
  background-repeat: no-repeat;
}

.form-control,
.form-select,
.form-textarea {
  width: 100%;
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-lg);
  padding: 0.65rem 0.9rem;
  min-height: 2.65rem;
  background: var(--surface-raised);
  color: var(--rich-black);
  font: inherit;
  font-size: 0.95rem;
  transition: border-color var(--transition-fast), box-shadow var(--transition-fast), background-color var(--transition-fast);
}

.form-textarea {
  min-height: 7rem;
  resize: vertical;
}

.form-select {
  appearance: none;
  padding-right: 2.5rem;
  background-image: linear-gradient(45deg, transparent 50%, var(--text-muted) 50%), linear-gradient(135deg, var(--text-muted) 50%, transparent 50%);
  background-position: calc(100% - 1.1rem) 1.1rem, calc(100% - 0.75rem) 1.1rem;
  background-size: 0.35rem 0.35rem, 0.35rem 0.35rem;
  background-repeat: no-repeat;
}

.form-control:focus,
.form-select:focus,
.form-textarea:focus,
.form-control:focus-visible,
.form-select:focus-visible,
.form-textarea:focus-visible {
  outline: none;
  border-color: var(--apple-green);
  box-shadow: 0 0 0 3px rgba(114, 176, 29, 0.18);
}

.form-control[aria-invalid="true"],
.form-select[aria-invalid="true"],
.form-textarea[aria-invalid="true"] {
  border-color: var(--danger);
  box-shadow: 0 0 0 3px rgba(180, 35, 24, 0.12);
}

.form-control:disabled,
.form-control[readonly],
.form-select:disabled,
.form-textarea:disabled {
  background: var(--surface-muted);
  color: var(--text-muted);
  cursor: not-allowed;
}

.input-field:focus {
  outline: none;
  border-color: var(--apple-green);
  box-shadow: 0 0 0 3px rgba(114, 176, 29, 0.18);
}

.input-field.field-error,
.input-field[aria-invalid="true"] {
  border-color: var(--danger);
  box-shadow: 0 0 0 3px rgba(180, 35, 24, 0.12);
}

.input-field:disabled,
.input-field[readonly] {
  background: var(--surface-muted);
  color: #667085;
  cursor: not-allowed;
}

.form-label {
  display: block;
  margin-bottom: 0.35rem;
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--rich-black);
}

/* ===============================
   Buttons
=============================== */
.btn,
.btn-primary,
.btn-secondary,
.btn-success,
.btn-warning,
.btn-danger {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  gap: 0.5rem;
  min-height: 2.5rem;
  padding: 0.6rem 1rem;
  border: 1px solid transparent;
  border-radius: 0.7rem;
  font-size: 0.875rem;
  font-weight: 600;
  line-height: 1.25rem;
  transition: background-color var(--transition-fast), border-color var(--transition-fast), color var(--transition-fast), transform var(--transition-fast), box-shadow var(--transition-fast);
}

.btn-ghost {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  min-height: 2.5rem;
  padding: 0.6rem 0.75rem;
  border: 1px solid transparent;
  border-radius: 0.7rem;
  color: var(--office-green);
  font-size: 0.875rem;
  font-weight: 600;
  transition: background-color var(--transition-fast), color var(--transition-fast);
}

.btn-ghost:hover { background: #eef7e9; color: #285913; }
.btn-ghost:focus-visible { outline: 3px solid rgba(63, 125, 32, 0.28); outline-offset: 2px; }

.btn:hover,
.btn-primary:hover,
.btn-secondary:hover,
.btn-success:hover,
.btn-warning:hover,
.btn-danger:hover {
  transform: translateY(-1px);
}

.btn:focus-visible,
.btn-primary:focus-visible,
.btn-secondary:focus-visible,
.btn-success:focus-visible,
.btn-warning:focus-visible,
.btn-danger:focus-visible,
.btn-icon:focus-visible,
.input-field:focus-visible {
  outline: 3px solid rgba(63, 125, 32, 0.28);
  outline-offset: 2px;
}

.btn:disabled,
.btn-primary:disabled,
.btn-secondary:disabled,
.btn-success:disabled,
.btn-warning:disabled,
.btn-danger:disabled {
  opacity: 0.55;
  cursor: not-allowed;
  transform: none;
}

.btn-primary {
  background-color: var(--orange-peel);
  color: var(--rich-black);
  border-color: #e89412;
}

.btn-primary:hover {
  background-color: var(--apple-green);
  color: #ffffff;
  border-color: var(--apple-green);
}

.btn-secondary {
  background: #ffffff;
  color: #344054;
  border-color: var(--border-subtle);
}

.btn-secondary:hover {
  background: var(--surface-muted);
  border-color: #b8c7bf;
}

.btn-success {
  background: #eaf6ef;
  color: var(--success);
  border-color: #b8e0c6;
}

.btn-warning {
  background: #fff7e6;
  color: var(--warning);
  border-color: #f1d28e;
}

.btn-danger {
  background: #fff1f0;
  color: var(--danger);
  border-color: #f2b8b5;
}

.btn-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.25rem;
  height: 2.25rem;
  border: 1px solid var(--border-subtle);
  border-radius: 0.65rem;
  color: #475467;
  background: #ffffff;
  transition: background-color var(--transition-fast), color var(--transition-fast), border-color var(--transition-fast);
}

.btn-icon:hover {
  background: var(--surface-muted);
  border-color: #b8c7bf;
  color: var(--office-green);
}

.status-badge {
  display: inline-flex;
  align-items: center;
  min-height: 1.6rem;
  padding: 0.2rem 0.6rem;
  border-radius: 999px;
  font-size: 0.75rem;
  font-weight: 700;
  white-space: nowrap;
}

.badge,
.badge-status {
  display: inline-flex;
  align-items: center;
  min-height: 1.6rem;
  padding: 0.2rem 0.6rem;
  border-radius: 999px;
  font-size: 0.75rem;
  font-weight: 700;
  line-height: 1.1;
  white-space: nowrap;
}

.status-active { background: #eaf6ef; color: var(--success); }
.status-defective { background: #fff7e6; color: var(--warning); }
.status-disposed { background: #eef1f3; color: #475467; }
.condition-good { background: #eaf6ef; color: var(--success); }
.condition-attention { background: #fff7e6; color: var(--warning); }
.condition-replaced { background: #eff8ff; color: #175cd3; }
.condition-neutral { background: #eef1f3; color: #475467; }
.condition-critical { background: #fff1f0; color: var(--danger); }

summary.btn-secondary::-webkit-details-marker { display: none; }

.alert {
  display: flex;
  align-items: flex-start;
  gap: 0.65rem;
  padding: 0.85rem 1rem;
  border: 1px solid;
  border-radius: 0.75rem;
  font-size: 0.875rem;
}

.alert-success { color: #17663c; background: #eef9f2; border-color: #b8e0c6; }
.alert-error { color: #912018; background: #fff4f2; border-color: #f2b8b5; }
.alert-info { color: #175cd3; background: #eff8ff; border-color: #b2ddff; }
.alert-warning { color: #7a4b00; background: #fff8eb; border-color: #f1d28e; }

.form-help {
  margin-top: 0.3rem;
  color: var(--text-muted);
  font-size: 0.75rem;
  line-height: 1.35;
}

.form-error {
  margin-top: 0.3rem;
  color: var(--danger);
  font-size: 0.75rem;
  line-height: 1.35;
}

.table-wrap { overflow-x: auto; border: 1px solid var(--border-subtle); border-radius: 0.8rem; }
.table-wrap.card.p-0 { padding: 0; }
.table-wrap.card:hover { transform: none; }
.table-wrap table { min-width: 760px; }
.table-wrap thead { background: var(--surface-muted); }

.table-wrap table,
.data-table { width: 100%; border-collapse: separate; border-spacing: 0; }
.table-wrap th,
.data-table th { color: var(--text-muted); font-size: 0.7rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; }
.table-wrap th,
.table-wrap td,
.data-table th,
.data-table td { padding: 0.8rem 0.9rem; vertical-align: top; }
.table-wrap tbody tr,
.data-table tbody tr { border-top: 1px solid #edf1ef; }
.table-wrap tbody tr:hover,
.data-table tbody tr:hover { background: #fbfdfb; }
.table-wrap td,
.data-table td { color: #344054; }

.page-header { display: flex; align-items: flex-end; justify-content: space-between; gap: 1rem; margin-bottom: 1.5rem; }
.page-title { margin: 0; color: var(--office-green); font-size: clamp(1.5rem, 2vw, 1.9rem); font-weight: 800; letter-spacing: -0.025em; }
.page-description { margin-top: 0.3rem; color: var(--text-muted); font-size: 0.875rem; }
.page-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 0.5rem; }

.card-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; margin: -0.15rem 0 1rem; }
.card-body { color: #344054; }
.card-subtitle { color: var(--text-muted); font-size: 0.8rem; }

.devices-page { width: 100%; max-width: 1600px; margin: 0 auto; }
.dashboard-page { width: 100%; max-width: 1600px; margin: 0 auto; }
.devices-page > .card:not(.table-wrap) { padding: 1.2rem; }
.devices-page .table-wrap { padding: 0; }
.devices-page .stat-card { padding: 0.9rem 1.05rem; }
.stat-card:hover { transform: none; }
.stat-value { margin-top: 0.4rem; font-size: 1.8rem; font-weight: 800; line-height: 1; }
.dashboard-page .stat-card { padding: 1.1rem 1.2rem; border-top: 3px solid var(--apple-green); }
.dashboard-page .chart-card { min-width: 0; }
.devices-page .filter-card { padding: 1rem 1.1rem; }
.device-list-card { border-color: #e5ebe7; box-shadow: 0 2px 8px rgba(15, 26, 32, 0.04); }
.devices-page .success-card { width: 100%; max-width: 34rem; padding: 1.25rem; }
.success-card:hover { transform: none; }

.devices-page-header { margin-bottom: 1.15rem; }
.devices-kicker {
  margin-bottom: 0.2rem;
  color: var(--office-green);
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.device-summary-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0.85rem; margin-bottom: 1rem; }
.device-summary-card {
  min-width: 0;
  padding: 0.95rem 1.05rem;
  border-top: 3px solid var(--office-green);
  box-shadow: 0 2px 8px rgba(15, 26, 32, 0.04);
}
.device-summary-card:hover { transform: none; }
.device-summary-card--active { border-top-color: #2f855a; }
.device-summary-card--defective { border-top-color: #c58b24; }
.device-summary-card--disposed { border-top-color: #64748b; }
.device-summary-heading { display: flex; align-items: center; justify-content: space-between; gap: 0.5rem; color: var(--text-muted); font-size: 0.68rem; font-weight: 800; letter-spacing: 0.07em; text-transform: uppercase; }
.device-summary-heading i { color: var(--office-green); font-size: 0.85rem; }
.device-summary-card--active .device-summary-heading i { color: #2f855a; }
.device-summary-card--defective .device-summary-heading i { color: #a56f0a; }
.device-summary-card--disposed .device-summary-heading i { color: #64748b; }
.device-summary-value { display: block; margin-top: 0.55rem; color: var(--rich-black); font-size: clamp(1.55rem, 3vw, 2rem); font-weight: 800; line-height: 1; }
.device-summary-note { display: block; margin-top: 0.4rem; color: var(--text-muted); font-size: 0.72rem; }
.device-filter-card { padding: 1.05rem 1.15rem; margin-bottom: 1rem; }
.device-filter-toggle { display: none; }
.device-filter-form { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1.05fr) minmax(8rem, 0.7fr) minmax(14rem, 1.6fr) auto; align-items: end; gap: 0.7rem; }
.device-filter-field { min-width: 0; }
.device-filter-field .form-label { margin-bottom: 0.3rem; }
.device-filter-actions { display: flex; gap: 0.45rem; }
.device-filter-actions > * { white-space: nowrap; }
.active-filter-list { display: flex; flex-wrap: wrap; gap: 0.45rem; margin-top: 0.8rem; padding-top: 0.8rem; border-top: 1px solid #edf1ef; }
.filter-chip { display: inline-flex; align-items: center; gap: 0.4rem; min-height: 1.8rem; padding: 0.25rem 0.55rem; border: 1px solid #dce8df; border-radius: 999px; background: #f5faf6; color: #315d2a; font-size: 0.72rem; font-weight: 700; }
.filter-chip:hover { border-color: #aac8ae; background: #eef7e9; color: var(--office-green); }
.filter-chip i { color: #66826b; font-size: 0.65rem; }
.device-list-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1rem 1.15rem 0.85rem; }
.device-list-title { color: var(--office-green); font-size: 0.98rem; font-weight: 800; }
.device-list-caption { margin-top: 0.2rem; color: var(--text-muted); font-size: 0.75rem; }
.device-table { min-width: 1080px; table-layout: fixed; }
.device-table th { padding: 0.65rem 0.9rem; background: var(--surface-muted); }
.device-table td { padding: 0.7rem 0.9rem; vertical-align: middle; }
.device-table th:nth-child(1) { width: 19%; }
.device-table th:nth-child(2) { width: 14%; }
.device-table th:nth-child(3) { width: 15%; }
.device-table th:nth-child(4) { width: 15%; }
.device-table th:nth-child(5) { width: 10%; }
.device-table th:nth-child(6) { width: 13%; }
.device-table th:nth-child(7) { width: 14%; }
.device-cell { display: grid; gap: 0.2rem; min-width: 0; }
.device-name { overflow-wrap: anywhere; color: #1f2937; font-size: 0.82rem; font-weight: 700; line-height: 1.3; }
.device-type { color: var(--text-muted); font-size: 0.7rem; }
.device-serial { color: #475467; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 0.76rem; overflow-wrap: anywhere; }
.device-wrapped-cell { display: block; max-width: 13rem; color: #344054; font-size: 0.78rem; overflow-wrap: anywhere; }
.device-pms-status { display: grid; justify-items: start; gap: 0.25rem; }
.device-pms-status time { color: var(--text-muted); font-size: 0.7rem; }
.device-no-pms { display: inline-flex; align-items: center; gap: 0.35rem; color: var(--text-muted); font-size: 0.72rem; }
.device-actions { display: flex; align-items: center; justify-content: flex-end; gap: 0.35rem; min-width: 11rem; }
.device-actions .btn-sm { min-height: 2.15rem; }
.device-more { position: relative; }
.device-more > summary { display: inline-flex; align-items: center; gap: 0.3rem; cursor: pointer; list-style: none; }
.device-more > summary::-webkit-details-marker { display: none; }
.device-more-menu { position: fixed; top: 0; left: 0; z-index: 100; width: 12rem; padding: 0.3rem; border: 1px solid #dce5df; border-radius: 0.7rem; background: #ffffff; box-shadow: 0 12px 28px rgba(15, 26, 32, 0.14); }
.device-more-menu form { margin: 0; }
.device-more-menu .menu-item { min-height: 2.2rem; padding: 0.5rem 0.6rem; }
.menu-item-warning { color: #8a5b00; }
.menu-item-warning:hover,
.menu-item-warning:focus-visible { background: #fff8eb; color: #7a4b00; }
.menu-separator { height: 1px; margin: 0.3rem 0; background: #edf1ef; }
.device-empty-state { display: grid; justify-items: center; gap: 0.45rem; min-height: 16rem; padding: 3rem 1.5rem; color: var(--text-muted); text-align: center; }
.device-empty-state strong { color: var(--rich-black); font-size: 0.9rem; }
.device-empty-state span:not(.empty-state-icon) { font-size: 0.78rem; }
.device-mobile-list { padding: 0.2rem 0.9rem 0.9rem; }
.device-mobile-card { display: grid; gap: 0.8rem; padding: 1rem 0; border-bottom: 1px solid #edf1ef; }
.device-mobile-card:last-child { border-bottom: 0; }
.device-mobile-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 0.7rem; }
.device-mobile-heading .device-name { font-size: 0.94rem; }
.device-mobile-serial { color: #475467; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 0.72rem; }
.device-mobile-details { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.7rem; padding-top: 0.75rem; border-top: 1px solid #edf1ef; }
.device-mobile-details > div { display: grid; gap: 0.18rem; min-width: 0; }
.device-mobile-details span,
.device-mobile-pms > span { color: var(--text-muted); font-size: 0.7rem; }
.device-mobile-details strong { color: #344054; font-size: 0.78rem; overflow-wrap: anywhere; }
.device-mobile-pms { display: grid; gap: 0.35rem; }
.device-mobile-pms > div { display: flex; align-items: center; flex-wrap: wrap; gap: 0.45rem; }
.device-mobile-pms time { color: var(--text-muted); font-size: 0.72rem; }
.device-mobile-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.5rem; padding-top: 0.1rem; }
.device-mobile-actions > * { justify-content: center; min-height: 2.5rem; }
.device-more--mobile { grid-column: 1 / -1; }
.device-more--mobile > summary { justify-content: center; width: 100%; }
.device-more--mobile .device-more-menu { position: static; width: 100%; margin-top: 0.4rem; }
.device-pagination { display: flex; align-items: center; justify-content: flex-end; gap: 1rem; padding: 0.85rem 1.15rem 1rem; border-top: 1px solid #edf1ef; }
.device-pagination-note { color: var(--text-muted); font-size: 0.72rem; }
.device-pagination nav { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 0.3rem; }
.device-pagination nav a { display: inline-flex; align-items: center; justify-content: center; min-width: 2rem; min-height: 2rem; padding: 0.35rem 0.55rem; border: 1px solid #dce5df; border-radius: 0.45rem; color: #475467; font-size: 0.75rem; }
.device-pagination nav a:hover { background: #f5faf6; border-color: #aac8ae; color: var(--office-green); }

.qr-modal { background: rgba(15, 26, 32, 0.58); }
.qr-modal-panel { position: relative; width: min(100%, 31rem); max-height: 92vh; overflow-y: auto; padding: 1.35rem; border: 1px solid #dce5df; border-radius: 0.9rem; background: #ffffff; box-shadow: 0 18px 44px rgba(15, 26, 32, 0.22); }
.qr-modal-close { position: absolute; top: 0.8rem; right: 0.8rem; }
.qr-modal-title { margin-bottom: 1rem; color: var(--office-green); font-size: 1rem; font-weight: 800; text-align: center; }
.qr-modal-identity { display: grid; grid-template-columns: 11rem minmax(0, 1fr); align-items: center; gap: 1rem; }
.qr-image-frame { display: grid; place-items: center; width: 11rem; height: 11rem; padding: 0.65rem; border: 1px solid #e1e9e3; border-radius: 0.75rem; background: #f7faf8; }
.qr-image-frame img { width: 100%; height: 100%; object-fit: contain; border-radius: 0.35rem; background: #ffffff; }
.qr-device-summary { display: grid; gap: 0.2rem; min-width: 0; }
.qr-device-summary > strong { color: #1f2937; font-size: 0.92rem; overflow-wrap: anywhere; }
.qr-device-summary > span { color: var(--office-green); font-size: 0.75rem; font-weight: 700; }
.qr-device-summary dl { display: grid; gap: 0.35rem; margin: 0.5rem 0 0; }
.qr-device-summary dl > div { display: grid; grid-template-columns: 4.5rem minmax(0, 1fr); gap: 0.35rem; }
.qr-device-summary dt { color: var(--text-muted); font-size: 0.68rem; }
.qr-device-summary dd { margin: 0; color: #344054; font-size: 0.72rem; overflow-wrap: anywhere; }
.qr-log-section { margin-top: 1.25rem; }
.qr-log-heading { display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; padding-bottom: 0.5rem; border-bottom: 1px solid #edf1ef; }
.qr-log-heading h3 { color: #344054; font-size: 0.82rem; font-weight: 800; }
.qr-log-heading span { color: var(--text-muted); font-size: 0.68rem; }
.qr-log-list { display: grid; gap: 0.45rem; margin-top: 0.55rem; max-height: 12rem; overflow-y: auto; }
.qr-log-item { display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; padding: 0.65rem 0.7rem; border: 1px solid #e8efea; border-radius: 0.6rem; background: #fbfdfb; }
.qr-log-item-details { display: grid; gap: 0.15rem; min-width: 0; }
.qr-log-item-details .time { color: #344054; font-size: 0.75rem; font-weight: 700; }
.qr-log-item-details .technician { color: var(--text-muted); font-size: 0.7rem; }
.qr-log-message { padding: 1rem; color: var(--text-muted); font-size: 0.75rem; text-align: center; }
.qr-log-message--error { color: var(--danger); }
.qr-modal-actions { display: flex; justify-content: flex-end; margin-top: 1rem; }

.menu-item {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  width: 100%;
  padding: 0.55rem 0.7rem;
  border-radius: 0.55rem;
  color: #344054;
  font-size: 0.8rem;
  text-align: left;
  transition: background-color var(--transition-fast), color var(--transition-fast);
}
.menu-item:hover,
.menu-item:focus-visible { background: var(--surface-muted); color: var(--office-green); outline: none; }
.menu-item-danger { color: var(--danger); }
.menu-item-danger:hover,
.menu-item-danger:focus-visible { background: #fff4f2; color: #912018; }

.empty-state {
  display: grid;
  justify-items: center;
  gap: 0.45rem;
  padding: 3rem 1.5rem;
  color: var(--text-muted);
  text-align: center;
}
.empty-state-icon { display: grid; place-items: center; width: 2.75rem; height: 2.75rem; border-radius: 0.85rem; background: #eef7e9; color: var(--office-green); }
.empty-state-title { color: var(--rich-black); font-weight: 700; }
.loading-state { padding: 1rem; color: var(--text-muted); font-size: 0.8rem; text-align: center; }

.report-table { min-width: 980px; }
.report-table td { max-width: 18rem; overflow-wrap: anywhere; }
.report-table .cell-primary { color: var(--office-green); font-weight: 700; }

/* Reports analytics workspace */
.reports-analytics-page { display: grid; gap: 1.25rem; }
.reports-analytics-header { display: flex; align-items: flex-end; justify-content: space-between; gap: 1.25rem; padding-bottom: 0.25rem; }
.reports-kicker, .reports-section-eyebrow { display: inline-flex; align-items: center; gap: 0.4rem; margin: 0 0 0.35rem; color: var(--office-green); font-size: 0.68rem; font-weight: 800; letter-spacing: 0.09em; text-transform: uppercase; }
.reports-period-summary { display: grid; gap: 0.15rem; min-width: 10.5rem; padding: 0.75rem 0.9rem; border-left: 3px solid var(--office-green); background: #f7faf7; }
.reports-period-label, .report-chart-note, .reports-section-note { color: var(--text-muted); font-size: 0.72rem; }
.reports-period-summary strong { color: var(--rich-black); font-size: 0.86rem; }
.reports-period-summary > span:last-child { color: var(--text-muted); font-size: 0.7rem; }
.reports-period-card { display: flex; align-items: flex-end; justify-content: space-between; gap: 1.5rem; padding: 1.15rem 1.25rem; border: 1px solid #dce7df; border-radius: var(--radius-lg); background: #f9fcfa; }
.reports-period-copy { max-width: 35rem; }
.reports-period-copy h2, .reports-section-heading h2, .report-chart-header h2 { margin: 0; color: var(--rich-black); font-size: 1rem; font-weight: 800; letter-spacing: -0.01em; }
.reports-period-copy p { margin: 0.35rem 0 0; color: var(--text-muted); font-size: 0.78rem; line-height: 1.5; }
.reports-period-form { display: flex; align-items: flex-end; gap: 0.65rem; flex-wrap: wrap; }
.reports-period-field { min-width: 9.5rem; }
.reports-period-field .form-label { margin-bottom: 0.3rem; font-size: 0.7rem; }
.reports-period-field .form-select, .reports-period-field .form-control { min-height: 2.45rem; padding: 0.5rem 0.7rem; font-size: 0.8rem; }
.reports-period-submit { min-height: 2.45rem; white-space: nowrap; }
.reports-library { display: grid; gap: 0.75rem; }
.reports-section-heading { display: flex; align-items: end; justify-content: space-between; gap: 1rem; }
.reports-library-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0.7rem; }
.report-library-card { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 0.7rem; min-width: 0; padding: 0.85rem; border: 1px solid #e0e9e2; border-radius: 0.75rem; background: #ffffff; color: inherit; text-decoration: none; transition: border-color var(--transition-fast), box-shadow var(--transition-fast), transform var(--transition-fast); }
.report-library-card:hover, .report-library-card:focus-visible { border-color: #a9c8ad; box-shadow: 0 6px 15px rgba(15, 26, 32, 0.08); transform: translateY(-1px); outline: none; }
.report-library-card > span:nth-child(2) { display: grid; gap: 0.18rem; min-width: 0; }
.report-library-card strong { color: #1f2937; font-size: 0.78rem; }
.report-library-card small { overflow: hidden; color: var(--text-muted); font-size: 0.68rem; text-overflow: ellipsis; white-space: nowrap; }
.report-library-icon, .report-kpi-icon { display: grid; place-items: center; flex: 0 0 auto; width: 2.1rem; height: 2.1rem; border-radius: 0.65rem; font-size: 0.85rem; }
.report-library-icon--green, .report-kpi-card--inventory .report-kpi-icon { background: #eef7e9; color: var(--office-green); }
.report-library-icon--blue, .report-kpi-card--activity .report-kpi-icon { background: #edf4ff; color: var(--info); }
.report-library-icon--amber, .report-kpi-card--attention .report-kpi-icon { background: #fff7e6; color: var(--warning); }
.report-library-icon--slate { background: #f0f3f4; color: #475467; }
.report-library-arrow { color: #98a2b3; font-size: 0.7rem; }
.reports-kpi-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0.75rem; }
.report-kpi-card { display: grid; gap: 0.35rem; min-width: 0; padding: 1rem 1.05rem; border: 1px solid #e1e9e3; border-radius: 0.8rem; background: #ffffff; }
.report-kpi-top { display: flex; align-items: center; justify-content: space-between; gap: 0.5rem; }
.report-kpi-context { color: var(--text-muted); font-size: 0.67rem; text-align: right; }
.report-kpi-card > strong { color: var(--rich-black); font-size: 1.65rem; line-height: 1.1; letter-spacing: -0.04em; }
.report-kpi-card > span:last-child { color: var(--text-muted); font-size: 0.72rem; line-height: 1.4; }
.report-kpi-card--coverage { border-color: #b9d5bb; background: #fbfefb; }
.report-kpi-card--coverage .report-kpi-icon { background: #eef7e9; color: var(--office-green); }
.report-kpi-card--attention { border-color: #ead7b0; background: #fffdf8; }
.report-chart-grid, .reports-bottom-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.9rem; }
.reports-chart-grid--primary { grid-template-columns: minmax(0, 1.55fr) minmax(19rem, 0.85fr); }
.report-chart-card, .report-attention-card { min-width: 0; padding: 1.1rem 1.15rem; border: 1px solid #e1e9e3; border-radius: 0.85rem; background: #ffffff; }
.report-chart-card--wide { min-width: 0; }
.report-chart-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 0.8rem; }
.report-chart-header h2 { font-size: 0.92rem; }
.report-chart-note { padding-top: 0.15rem; white-space: nowrap; }
.report-chart-stage { position: relative; height: 17rem; margin-top: 0.9rem; }
.report-chart-stage--trend { height: 19rem; }
.report-chart-stage--outcomes { height: 12.5rem; }
.report-chart-stage canvas { width: 100% !important; height: 100% !important; }
.report-chart-empty { display: grid; align-content: center; justify-items: center; gap: 0.4rem; height: 100%; padding: 1.25rem; color: var(--text-muted); text-align: center; }
.report-chart-empty > i { margin-bottom: 0.2rem; color: #a9c8ad; font-size: 1.35rem; }
.report-chart-empty strong { color: #344054; font-size: 0.8rem; }
.report-chart-empty span { max-width: 18rem; font-size: 0.72rem; line-height: 1.45; }
.report-status-stage { display: grid; grid-template-columns: minmax(10rem, 0.95fr) minmax(8rem, 1.05fr); align-items: center; gap: 1rem; min-height: 17rem; }
.report-doughnut-wrap { position: relative; width: min(100%, 13rem); aspect-ratio: 1; margin: 0 auto; }
.report-doughnut-wrap canvas { width: 100% !important; height: 100% !important; }
.report-doughnut-total { position: absolute; inset: 0; display: grid; place-content: center; justify-items: center; pointer-events: none; }
.report-doughnut-total strong { color: var(--rich-black); font-size: 1.5rem; letter-spacing: -0.04em; }
.report-doughnut-total small { color: var(--text-muted); font-size: 0.68rem; }
.report-status-legend { display: grid; gap: 0.8rem; }
.report-status-legend > div { display: flex; align-items: center; justify-content: space-between; gap: 0.6rem; padding-bottom: 0.55rem; border-bottom: 1px solid #edf1ef; }
.report-status-legend > div:last-child { padding-bottom: 0; border-bottom: 0; }
.report-status-label { display: inline-flex; align-items: center; gap: 0.4rem; color: #475467; font-size: 0.76rem; }
.report-status-legend strong { color: #1f2937; font-size: 0.77rem; }
.report-status-legend small { color: var(--text-muted); font-size: 0.68rem; font-weight: 500; }
.report-dot { display: inline-block; width: 0.48rem; height: 0.48rem; border-radius: 999px; }
.report-dot--good { background: var(--apple-green); }
.report-dot--danger { background: var(--danger); }
.report-dot--neutral { background: var(--text-muted); }
.report-attention-card { background: #fbfdfb; }
.report-attention-heading-icon { color: var(--office-green); font-size: 1.1rem; }
.report-attention-list { display: grid; gap: 0.75rem; margin-top: 1.25rem; }
.report-attention-list > div { display: flex; align-items: center; justify-content: space-between; gap: 0.8rem; padding: 0.7rem 0; border-bottom: 1px solid #e5eee7; }
.report-attention-list > div:last-child { border-bottom: 0; }
.report-attention-list span { display: inline-flex; align-items: center; gap: 0.55rem; color: #475467; font-size: 0.75rem; line-height: 1.35; }
.report-attention-list span i { width: 1rem; color: var(--office-green); text-align: center; }
.report-attention-list strong { color: var(--rich-black); font-size: 1.1rem; }
.report-attention-note { margin: 0.9rem 0 0; padding-top: 0.8rem; border-top: 1px solid #e5eee7; color: var(--text-muted); font-size: 0.7rem; line-height: 1.5; }

@media (max-width: 1100px) {
  .reports-library-grid, .reports-kpi-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .reports-period-card { align-items: stretch; flex-direction: column; }
}

@media (max-width: 760px) {
  .reports-analytics-header, .reports-section-heading { align-items: flex-start; flex-direction: column; }
  .reports-period-summary { width: 100%; }
  .reports-period-form, .reports-period-field { width: 100%; }
  .reports-period-submit { width: 100%; justify-content: center; }
  .reports-library-grid, .reports-kpi-grid, .reports-chart-grid, .reports-bottom-grid, .reports-chart-grid--primary { grid-template-columns: 1fr; }
  .report-chart-stage--trend { height: 15rem; }
  .report-status-stage { grid-template-columns: 1fr; gap: 0.5rem; padding: 0.75rem 0; }
  .report-doughnut-wrap { width: min(100%, 11rem); }
  .report-status-legend { width: min(100%, 18rem); margin: 0 auto; }
}

/* Device inventory report */
.report-detail-page { display: grid; gap: 1rem; }
.report-detail-kicker { display: inline-flex; align-items: center; gap: 0.4rem; margin: 0 0 0.3rem; color: var(--office-green); font-size: 0.67rem; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }
.report-detail-header { align-items: flex-end; margin-bottom: 0.1rem; }
.report-summary-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0.7rem; }
.report-summary-item { display: grid; gap: 0.25rem; min-width: 0; padding: 0.85rem 1rem; border: 1px solid #e1e9e3; border-radius: 0.75rem; background: #ffffff; }
.report-summary-label { color: var(--text-muted); font-size: 0.68rem; font-weight: 800; letter-spacing: 0.07em; text-transform: uppercase; }
.report-summary-value { color: var(--rich-black); font-size: 1.45rem; line-height: 1.1; letter-spacing: -0.03em; }
.report-summary-item small { color: var(--text-muted); font-size: 0.7rem; }
.report-summary-item--good { border-color: #c6ddc9; }
.report-summary-item--good .report-summary-value { color: var(--success); }
.report-summary-item--warning { border-color: #ead7b0; }
.report-summary-item--warning .report-summary-value { color: var(--warning); }
.report-summary-item--neutral .report-summary-value { color: #475467; }
.report-filter-card { padding: 1rem 1.1rem; }
.report-filter-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; margin-bottom: 0.9rem; }
.report-filter-heading h2 { margin: 0; color: var(--rich-black); font-size: 0.95rem; font-weight: 800; }
.report-filter-heading p { margin: 0.3rem 0 0; color: var(--text-muted); font-size: 0.74rem; }
.report-filter-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)) auto; align-items: end; gap: 0.75rem; }
.report-filter-form .form-label { margin-bottom: 0.3rem; font-size: 0.7rem; }
.report-filter-form .form-control { min-height: 2.45rem; padding: 0.5rem 0.7rem; font-size: 0.8rem; }
.report-filter-form .btn-primary { min-height: 2.45rem; white-space: nowrap; }
.report-filter-form--inventory { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.report-filter-form--inventory .report-filter-search { grid-column: 2 / span 2; }
.report-filter-form--inventory .report-filter-actions { grid-column: 4; display: flex; align-items: center; justify-content: flex-end; gap: 0.5rem; }
.report-filter-form--inventory .report-filter-actions .btn-primary, .report-filter-form--inventory .report-filter-actions .btn-secondary { min-height: 2.45rem; }
@media (max-width: 980px) {
  .report-filter-form--inventory { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .report-filter-form--inventory .report-filter-search, .report-filter-form--inventory .report-filter-actions { grid-column: span 2; }
}
@media (max-width: 760px) {
  .report-filter-form--inventory .report-filter-search, .report-filter-form--inventory .report-filter-actions { grid-column: auto; }
}

.report-records-card { padding: 0; overflow: hidden; }
.report-records-toolbar { display: flex; align-items: flex-end; justify-content: space-between; gap: 1rem; padding: 1.05rem 1.15rem 0.9rem; }
.report-records-toolbar h2 { margin: 0; color: var(--rich-black); font-size: 0.98rem; font-weight: 800; }
.report-records-toolbar p { margin: 0.3rem 0 0; color: var(--text-muted); font-size: 0.73rem; }
.report-records-toolbar p strong { color: #475467; font-weight: 700; }
.report-record-count { flex: 0 0 auto; padding: 0.35rem 0.6rem; border: 1px solid #dce7df; border-radius: 999px; background: #f7faf7; color: var(--office-green); font-size: 0.7rem; font-weight: 800; }
.report-pagination { display: flex; justify-content: flex-end; gap: 0.3rem; padding: 0.1rem 0 0.35rem; }
.report-pagination a { display: inline-flex; align-items: center; justify-content: center; min-width: 2rem; min-height: 2rem; padding: 0.35rem 0.55rem; border: 1px solid #dce5df; border-radius: 0.45rem; background: #ffffff; color: #475467; font-size: 0.75rem; text-decoration: none; }
.report-pagination a:hover, .report-pagination a:focus-visible { border-color: #aac8ae; background: #f5faf6; color: var(--office-green); outline: none; }
.report-pagination a.is-current { border-color: var(--office-green); background: var(--office-green); color: #ffffff; }
.report-inventory-table { min-width: 900px; table-layout: fixed; }
.report-inventory-table th:nth-child(1) { width: 12%; }
.report-inventory-table th:nth-child(2) { width: 24%; }
.report-inventory-table th:nth-child(3) { width: 17%; }
.report-inventory-table th:nth-child(4) { width: 18%; }
.report-inventory-table th:nth-child(5) { width: 18%; }
.report-inventory-table th:nth-child(6) { width: 11%; }
.report-inventory-table td { vertical-align: top; }
.report-date-cell { color: #475467; font-size: 0.76rem; font-weight: 600; white-space: nowrap; }
.report-device-cell { display: grid; gap: 0.18rem; min-width: 0; }
.report-device-name { overflow-wrap: anywhere; color: #1f2937; font-size: 0.8rem; }
.report-device-type { color: var(--text-muted); font-size: 0.7rem; }
.report-serial { color: #475467; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 0.73rem; overflow-wrap: anywhere; }
.report-wrapped-cell { display: block; max-width: 12rem; color: #475467; font-size: 0.75rem; overflow-wrap: anywhere; }
.print-report-letterhead { display: none; }
.print-report-brand { display: grid; gap: 0.15rem; }
.print-report-brand strong { color: var(--office-green); font-size: 1.05rem; }
.print-report-brand span { color: var(--text-muted); font-size: 0.72rem; }
.print-report-meta { display: grid; gap: 0.35rem; margin-left: auto; text-align: right; }
.print-report-meta div { display: grid; gap: 0.1rem; }
.print-report-meta span { color: var(--text-muted); font-size: 0.62rem; text-transform: uppercase; }
.print-report-meta strong { color: #344054; font-size: 0.72rem; }

@media print {
  .print-report-letterhead { display: grid !important; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 0.8rem; margin-bottom: 0.85rem; padding-bottom: 0.65rem; border-bottom: 2px solid var(--office-green); }
  .print-report-letterhead img { width: 3rem; height: 3rem; object-fit: contain; }
  .report-summary-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0.4rem; margin-bottom: 0.65rem; }
  .report-summary-item { padding: 0.45rem 0.55rem; border-radius: 0; box-shadow: none; }
  .report-summary-value { font-size: 1rem; }
  .report-records-card { overflow: visible; }
  .report-records-toolbar { padding: 0.35rem 0 0.55rem; }
  .report-inventory-table { min-width: 0 !important; width: 100%; table-layout: fixed; font-size: 8.5pt; }
  .report-inventory-table th, .report-inventory-table td { padding: 0.35rem 0.4rem; }
  .report-device-name { font-size: 8.5pt; }
  .report-device-type, .report-serial, .report-wrapped-cell, .report-date-cell { font-size: 8pt; }
}

@media (max-width: 760px) {
  .report-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .report-filter-heading, .report-records-toolbar { align-items: flex-start; flex-direction: column; }
  .report-filter-form { grid-template-columns: 1fr; }
  .report-filter-form .btn-primary { width: 100%; justify-content: center; }
}

/* Device PMS Logs */
.device-log-table { width: 100%; min-width: 1080px; table-layout: fixed; }
.device-log-table th:nth-child(1) { width: 115px; }
.device-log-table th:nth-child(2) { width: 220px; }
.device-log-table th:nth-child(3) { width: 150px; }
.device-log-table th:nth-child(4) { width: 150px; }
.device-log-table th:nth-child(5) { width: 135px; }
.device-log-table th:nth-child(6) { width: 230px; }
.device-log-table th:nth-child(7) { width: 190px; }
.device-log-table th:nth-child(8) { width: 175px; }
.device-log-table-single { min-width: 900px; }
.device-log-table-single th:nth-child(1) { width: 135px; }
.device-log-table-single th:nth-child(2) { width: 170px; }
.device-log-table-single th:nth-child(3) { width: 145px; }
.device-log-table-single th:nth-child(4) { width: 280px; }
.device-log-table-single th:nth-child(5) { width: 210px; }
.device-log-table-single th:nth-child(6) { width: 175px; }
.device-log-summary-row > td { vertical-align: top; }
.log-date-cell { white-space: nowrap; }
.log-date { color: #1f2937; font-weight: 600; }
.log-time { margin-top: 0.2rem; color: var(--text-muted); font-size: 0.75rem; }
.device-cell, .technician-cell { display: flex; flex-direction: column; gap: 0.2rem; }
.device-name, .technician-name { color: #1f2937; font-weight: 600; }
.device-meta, .cell-secondary, .text-muted { color: var(--text-muted); font-size: 0.75rem; }
.log-preview-cell { vertical-align: top; }
.log-preview { display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; line-height: 1.4; overflow-wrap: anywhere; }
.table-actions { display: flex; align-items: center; justify-content: flex-end; gap: 0.4rem; flex-wrap: wrap; }
.btn-sm { min-height: 2rem; padding: 0.4rem 0.65rem; font-size: 0.75rem; }
.device-log-details-row td { padding: 0 !important; border-top: 0; }
.device-log-details { padding: 1rem 1.25rem 1.25rem; background: #f8fafc; border-top: 1px dashed #dbe3ea; border-bottom: 1px solid #e5e7eb; }
.log-detail-group + .log-detail-group { margin-top: 1.25rem; }
.log-detail-heading { margin: 0 0 0.75rem; color: #475569; font-size: 0.8rem; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; }
.log-detail-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.9rem 1.25rem; margin: 0; }
.log-detail-grid > div { min-width: 0; }
.log-detail-grid dt { margin-bottom: 0.25rem; color: #64748b; font-size: 0.72rem; font-weight: 600; }
.log-detail-grid dd { margin: 0; color: #1f2937; font-size: 0.85rem; line-height: 1.45; overflow-wrap: anywhere; }
.log-assessment-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
.log-assessment-block { padding: 0.85rem; border: 1px solid #e2e8f0; border-radius: 0.6rem; background: #ffffff; }
.log-assessment-label { display: block; margin-bottom: 0.35rem; color: #64748b; font-size: 0.72rem; font-weight: 700; }
.log-assessment-block p { margin: 0; color: #334155; font-size: 0.82rem; line-height: 1.5; overflow-wrap: anywhere; }
.condition-info { background: #eff6ff; color: #1d4ed8; }

@media print {
  body { background: #ffffff !important; }
  .no-print,
  aside,
  header,
  footer { display: none !important; }
  #main { margin-left: 0 !important; }
  main { padding: 0 !important; }
  .card { box-shadow: none !important; border: 0 !important; }
  .table-wrap { overflow: visible; border: 0; }
  .table-wrap table { min-width: 0; }
  .report-table { font-size: 9px; }
  thead { display: table-header-group; }
  tr { break-inside: avoid; page-break-inside: avoid; }
  @page { size: A4; margin: 12mm; }
  .print-letterhead { display: flex !important; }
  .device-log-table { min-width: 0 !important; width: 100%; table-layout: auto; font-size: 9pt; }
  .device-log-details-row[hidden] { display: table-row !important; }
  .device-log-summary-row { break-inside: avoid; }
  .device-log-details { padding: 0.5rem 0.25rem 0.85rem; background: transparent; border-bottom: 1px solid #bbbbbb; }
  .log-detail-grid, .log-assessment-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .log-assessment-block { padding: 0; border: 0; }
}

.print-letterhead { display: none; align-items: center; gap: 0.75rem; margin-bottom: 1rem; padding-bottom: 0.7rem; border-bottom: 2px solid var(--office-green); }
.print-letterhead img { width: 3rem; height: 3rem; object-fit: contain; }
.print-letterhead-title { color: var(--office-green); font-size: 1.05rem; font-weight: 800; }
.print-letterhead-subtitle { color: var(--text-muted); font-size: 0.72rem; }

/* ===============================
   Errors & Alerts
=============================== */
.error-box {
  background: #fee2e2;
  color: #991b1b;
  padding: 0.75rem 1rem;
  border-radius: var(--radius-lg);
  font-size: 0.875rem;
  text-align: center;
  margin-bottom: 1rem;
  font-weight: 500;
}

/* ===============================
   Cards
=============================== */
.card {
  background: #ffffff;
  border-radius: var(--radius-lg);
  box-shadow: 0 4px 10px rgba(15, 26, 32, 0.06);
  padding: 1.5rem;
  transition: box-shadow var(--transition-fast),
              transform var(--transition-fast);
}

.card:hover {
  box-shadow: 0 8px 18px rgba(15, 26, 32, 0.1);
  transform: translateY(-2px);
}

.card-title {
  color: var(--office-green);
  font-weight: 700;
  margin-bottom: 0.25rem;
}

/* ===============================
   Sidebar
=============================== */
.sidebar {
  background: linear-gradient(180deg, #2f6418 0%, #285913 50%, #1f4810 100%);
  color: #ffffff;
  border-right: 1px solid rgba(255, 255, 255, 0.08);
}

.sidebar-brand {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.06), rgba(255, 255, 255, 0.01));
}

.sidebar-link {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  width: 100%;
  border: 0;
  background: transparent;
  padding: 0.72rem 0.8rem;
  border-radius: 0.75rem;
  font-size: 0.92rem;
  font-family: inherit;
  color: rgba(255, 255, 255, 0.9);
  cursor: pointer;
  transition: background-color var(--transition-fast), color var(--transition-fast), transform var(--transition-fast);
}

.sidebar-link:hover {
  background-color: rgba(255, 255, 255, 0.12);
  color: #ffffff;
  transform: translateX(2px);
}

.sidebar-link.active {
  background: linear-gradient(135deg, #ffb42f 0%, #ff9f1c 100%);
  color: #1b1f14;
  box-shadow: 0 6px 14px rgba(15, 26, 32, 0.25);
}

.sidebar-icon-wrap {
  width: 1.9rem;
  height: 1.9rem;
  border-radius: 0.55rem;
  background: rgba(255, 255, 255, 0.15);
  border: 1px solid rgba(255, 255, 255, 0.18);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  font-size: 0.9rem;
  transition: background-color var(--transition-fast), border-color var(--transition-fast), color var(--transition-fast);
}

.sidebar-link:hover .sidebar-icon-wrap {
  background: rgba(255, 255, 255, 0.23);
}

.sidebar-link.active .sidebar-icon-wrap {
  background: rgba(15, 26, 32, 0.18);
  border-color: rgba(15, 26, 32, 0.2);
  color: #1b1f14;
}

.sidebar-section-title { margin-top: 1.1rem; }

.sidebar-user {
  backdrop-filter: blur(3px);
}

.sidebar-logout {
  color: #fee2e2;
}

.sidebar-logout:hover {
  background-color: rgba(220, 38, 38, 0.2);
  color: #ffffff;
}

.sidebar::-webkit-scrollbar {
  width: 6px;
}

.sidebar::-webkit-scrollbar-thumb {
  background: rgba(255, 255, 255, 0.25);
  border-radius: 999px;
}

/* ===============================
   Header & Footer
=============================== */
.header {
  background-color: #ffffff;
  box-shadow: 0 2px 6px rgba(15, 26, 32, 0.08);
  padding: 0;
}

.footer {
  background-color: var(--rich-black);
  color: #ffffff;
  font-size: 0.8rem;
  text-align: center;
  padding: 0.75rem;
}

/* ===============================
   Dashboard
=============================== */
.dashboard-bg {
  background: #f6f9f7;
}

.dashboard-header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1.25rem;
}
.dashboard-kicker {
  margin-bottom: 0.2rem;
  color: var(--office-green);
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.dashboard-updated {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  flex: 0 0 auto;
  color: var(--text-muted);
  font-size: 0.75rem;
  white-space: nowrap;
}
.dashboard-live-dot {
  width: 0.45rem;
  height: 0.45rem;
  border-radius: 999px;
  background: #3f7d20;
  box-shadow: 0 0 0 3px #e3f1df;
}
.dashboard-kpi-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.85rem;
  margin-bottom: 1rem;
}
.dashboard-kpi {
  min-width: 0;
  padding: 1rem 1.05rem;
  border-top: 3px solid var(--office-green);
  box-shadow: 0 2px 8px rgba(15, 26, 32, 0.04);
  transition: box-shadow var(--transition-fast), border-color var(--transition-fast);
}
.dashboard-kpi:hover,
.dashboard-panel:hover { transform: none; }
.dashboard-kpi--blue { border-top-color: #2563a8; }
.dashboard-kpi--teal { border-top-color: #167b72; }
.dashboard-kpi--amber { border-top-color: #c58b24; }
.dashboard-kpi-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.6rem;
}
.dashboard-kpi-label {
  color: var(--text-muted);
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.07em;
  text-transform: uppercase;
}
.dashboard-kpi-icon {
  display: grid;
  place-items: center;
  width: 2rem;
  height: 2rem;
  flex: 0 0 auto;
  border-radius: 0.6rem;
  background: #eef7e9;
  color: var(--office-green);
  font-size: 0.85rem;
}
.dashboard-kpi--blue .dashboard-kpi-icon { background: #edf4fb; color: #2563a8; }
.dashboard-kpi--teal .dashboard-kpi-icon { background: #e9f7f4; color: #167b72; }
.dashboard-kpi--amber .dashboard-kpi-icon { background: #fff7e6; color: #a56f0a; }
.dashboard-kpi-value {
  margin-top: 0.6rem;
  color: var(--rich-black);
  font-size: clamp(1.65rem, 3vw, 2.2rem);
  font-weight: 800;
  line-height: 1;
}
.dashboard-kpi-note {
  margin-top: 0.4rem;
  color: var(--text-muted);
  font-size: 0.73rem;
}
.dashboard-grid {
  display: grid;
  gap: 1rem;
  margin-bottom: 1rem;
}
.dashboard-grid--wide { grid-template-columns: minmax(0, 2fr) minmax(18rem, 1fr); }
.dashboard-panel {
  min-width: 0;
  overflow: hidden;
  padding: 1.15rem;
  box-shadow: 0 2px 8px rgba(15, 26, 32, 0.04);
}
.dashboard-panel-title { color: var(--office-green); font-size: 1rem; font-weight: 800; }
.dashboard-panel-icon { color: var(--text-muted); font-size: 1rem; }
.dashboard-panel-icon--amber { color: #c58b24; }
.dashboard-chart {
  position: relative;
  width: 100%;
  min-height: 14rem;
}
.dashboard-chart--trend,
.dashboard-chart--department { height: 16rem; }
.dashboard-chart--outcomes { height: 14rem; }
.dashboard-doughnut {
  position: relative;
  width: min(100%, 15rem);
  height: 13rem;
  margin: 0 auto 0.5rem;
}
.dashboard-doughnut-center {
  position: absolute;
  inset: 0;
  display: grid;
  place-content: center;
  justify-items: center;
  pointer-events: none;
}
.dashboard-doughnut-center span { color: var(--text-muted); font-size: 0.7rem; }
.dashboard-doughnut-center strong { color: var(--rich-black); font-size: 1.55rem; line-height: 1.1; }
.dashboard-legend { display: grid; gap: 0.5rem; border-top: 1px solid #edf1ef; padding-top: 0.75rem; }
.dashboard-legend-item {
  display: grid;
  grid-template-columns: auto 1fr auto auto;
  align-items: center;
  gap: 0.45rem;
  color: #475467;
  font-size: 0.76rem;
}
.dashboard-legend-item strong { color: var(--rich-black); font-size: 0.8rem; }
.dashboard-legend-item small { min-width: 2.3rem; color: var(--text-muted); text-align: right; }
.dashboard-dot { width: 0.55rem; height: 0.55rem; border-radius: 999px; }
.dashboard-dot--active { background: #3f7d20; }
.dashboard-dot--defective { background: #c2413b; }
.dashboard-dot--disposed { background: #64748b; }
.dashboard-empty {
  display: grid;
  justify-items: center;
  gap: 0.35rem;
  min-height: 12rem;
  padding: 2.25rem 1rem;
  color: var(--text-muted);
  font-size: 0.78rem;
  text-align: center;
}
.dashboard-empty > i { margin-bottom: 0.2rem; color: #91a69a; font-size: 1.35rem; }
.dashboard-empty strong { color: var(--rich-black); font-size: 0.85rem; }
.dashboard-empty--compact { min-height: 0; padding: 0.5rem; }
.dashboard-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.55rem; }
.dashboard-actions > a { justify-content: center; min-width: 0; padding: 0.6rem 0.7rem; font-size: 0.75rem; text-align: center; }
.dashboard-actions > a i { margin-right: 0.25rem; }
.dashboard-attention-list { display: grid; gap: 0.7rem; }
.dashboard-attention-item {
  display: flex;
  align-items: center;
  gap: 0.7rem;
  min-width: 0;
  padding: 0.65rem 0;
  border-bottom: 1px solid #edf1ef;
}
.dashboard-attention-item:last-child { border-bottom: 0; }
.dashboard-attention-item > div { display: grid; gap: 0.15rem; min-width: 0; flex: 1; }
.dashboard-attention-item strong { color: var(--rich-black); font-size: 0.8rem; }
.dashboard-attention-item span:not(.dashboard-attention-icon) { color: var(--text-muted); font-size: 0.7rem; }
.dashboard-attention-icon,
.dashboard-device-icon {
  display: grid;
  place-items: center;
  width: 2rem;
  height: 2rem;
  flex: 0 0 auto;
  border-radius: 0.55rem;
  font-size: 0.8rem;
}
.dashboard-attention-icon--red { background: #fff0ee; color: #c2413b; }
.dashboard-attention-icon--blue { background: #edf4fb; color: #2563a8; }
.dashboard-activity-list,
.dashboard-device-list { display: grid; gap: 0; }
.dashboard-activity-item,
.dashboard-device-item {
  display: flex;
  align-items: center;
  gap: 0.7rem;
  min-width: 0;
  padding: 0.7rem 0;
  border-bottom: 1px solid #edf1ef;
}
.dashboard-activity-item:last-child,
.dashboard-device-item:last-child { border-bottom: 0; }
.dashboard-activity-marker { width: 0.55rem; height: 0.55rem; flex: 0 0 auto; border-radius: 999px; }
.dashboard-activity-content,
.dashboard-device-content { display: grid; gap: 0.15rem; min-width: 0; flex: 1; }
.dashboard-activity-content strong,
.dashboard-device-content strong { overflow: hidden; color: var(--rich-black); font-size: 0.79rem; text-overflow: ellipsis; white-space: nowrap; }
.dashboard-activity-content span,
.dashboard-device-content span,
.dashboard-activity-content time,
.dashboard-device-content time { overflow: hidden; color: var(--text-muted); font-size: 0.7rem; text-overflow: ellipsis; white-space: nowrap; }
.dashboard-device-icon { background: #eef7e9; color: var(--office-green); }

@media (max-width: 1100px) {
  .dashboard-kpi-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dashboard-grid--wide { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 640px) {
  .dashboard-header { align-items: flex-start; flex-direction: column; gap: 0.55rem; }
  .dashboard-updated { white-space: normal; }
  .dashboard-kpi-grid { gap: 0.65rem; }
  .dashboard-kpi { padding: 0.85rem; }
  .dashboard-kpi-label { font-size: 0.61rem; }
  .dashboard-kpi-value { font-size: 1.5rem; }
  .dashboard-kpi-note { font-size: 0.66rem; }
  .dashboard-panel { padding: 0.9rem; }
  .dashboard-panel-title { font-size: 0.92rem; }
  .dashboard-chart--trend,
  .dashboard-chart--department { height: 14rem; }
  .dashboard-chart--outcomes { height: 12rem; }
  .dashboard-actions { grid-template-columns: 1fr; }
  .dashboard-activity-item,
  .dashboard-device-item { align-items: flex-start; }
  .dashboard-activity-item .status-badge,
  .dashboard-device-item .status-badge { margin-left: auto; }
}

@media (max-width: 375px) {
  .dashboard-kpi-grid { grid-template-columns: 1fr; }
  .dashboard-kpi { display: grid; grid-template-columns: 1fr auto; align-items: center; column-gap: 0.75rem; }
  .dashboard-kpi-header { grid-column: 1 / -1; }
  .dashboard-kpi-value { margin-top: 0.45rem; }
  .dashboard-kpi-note { margin-top: 0; }
}

/* ===============================
   Animations (Minimal)
=============================== */
@keyframes fadeInUp {
  from { opacity: 0; transform: translateY(12px); }
  to { opacity: 1; transform: translateY(0); }
}

@media (max-width: 768px) {
  .page-header { align-items: stretch; flex-direction: column; }
  .page-actions { justify-content: flex-start; }
  .page-actions > .btn,
  .page-actions > .btn-primary,
  .page-actions > .btn-secondary,
  .page-actions > .btn-success,
  .page-actions > .btn-danger { flex: 1 1 auto; }
  .card { padding: 1.1rem; }
  .filter-card { padding: 1rem; }
  .log-detail-grid,
  .log-assessment-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .table-wrap th,
  .table-wrap td,
  .data-table th,
  .data-table td { padding: 0.7rem; }

  .device-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .device-filter-toggle { display: flex; align-items: center; justify-content: space-between; width: 100%; min-height: 2.6rem; padding: 0.6rem 0.75rem; border: 1px solid var(--border-subtle); border-radius: 0.6rem; background: #ffffff; color: #344054; font-size: 0.78rem; font-weight: 700; }
  .device-filter-toggle > span:first-child { display: inline-flex; align-items: center; gap: 0.45rem; }
  .device-filter-count { margin-left: auto; margin-right: 0.5rem; padding: 0.2rem 0.45rem; border-radius: 999px; background: #eef7e9; color: var(--office-green); font-size: 0.68rem; }
  .device-filter-chevron { color: var(--text-muted); transition: transform var(--transition-fast); }
  .device-filter-toggle[aria-expanded="true"] .device-filter-chevron { transform: rotate(180deg); }
  .device-filter-form { display: none; grid-template-columns: 1fr; gap: 0.7rem; margin-top: 0.8rem; }
  .device-filter-form.is-open { display: grid; }
  .device-filter-actions { flex-wrap: wrap; }
  .device-filter-actions > * { flex: 1 1 9rem; justify-content: center; }
  .device-list-toolbar { padding: 0.9rem; }
  .device-pagination { align-items: flex-start; flex-direction: column; gap: 0.65rem; padding: 0.85rem 0.9rem 0.95rem; }
  .device-pagination nav { width: 100%; justify-content: flex-start; }
  .qr-modal-panel { padding: 1.1rem; }
}

@media (max-width: 640px) {
  .devices-page-header .page-actions { width: 100%; }
  .devices-page-header .page-actions > * { flex: 1 1 0; justify-content: center; }
  .device-mobile-card { padding: 0.9rem 0; }
  .qr-modal-identity { grid-template-columns: 1fr; }
  .qr-image-frame { width: 10rem; height: 10rem; margin: 0 auto; }
  .log-detail-grid,
  .log-assessment-grid { grid-template-columns: 1fr; }
}

@media (max-width: 375px) {
  .device-summary-grid { grid-template-columns: 1fr; }
  .device-summary-card { display: grid; grid-template-columns: 1fr auto; align-items: center; column-gap: 0.75rem; }
  .device-summary-heading { grid-column: 1 / -1; }
  .device-summary-value { margin-top: 0.45rem; }
  .device-summary-note { margin-top: 0; }
  .devices-page-header .page-actions { display: grid; grid-template-columns: 1fr; }
  .devices-page-header .page-actions > * { width: 100%; }
  .device-mobile-details { grid-template-columns: 1fr; }
  .page-actions { display: grid; grid-template-columns: 1fr; }
  .page-actions > * { width: 100%; }
  .btn,
  .btn-primary,
  .btn-secondary,
  .btn-success,
  .btn-warning,
  .btn-danger { padding-left: 0.75rem; padding-right: 0.75rem; }
}


/* Condemned equipment lifecycle report */
.condemned-page { display: grid; gap: 1rem; }
.condemned-header { align-items: flex-end; }
.condemned-summary-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0.7rem; }
.condemned-summary-card { display: flex; align-items: flex-start; gap: 0.75rem; min-width: 0; padding: 0.9rem 1rem; border: 1px solid #dfe8e1; border-radius: 0.75rem; background: #ffffff; }
.condemned-summary-card > div:last-child { display: grid; gap: 0.2rem; min-width: 0; }
.condemned-summary-card strong { color: var(--rich-black); font-size: 1.5rem; line-height: 1.1; letter-spacing: -0.04em; }
.condemned-summary-card small { color: var(--text-muted); font-size: 0.68rem; line-height: 1.35; }
.condemned-summary-card--amber { border-color: #ead7b0; background: #fffdf8; }
.condemned-summary-card--green { border-color: #c6ddc9; background: #fbfefb; }
.condemned-summary-card--blue { border-color: #cbdcf0; background: #fbfdff; }
.condemned-summary-icon { display: grid; place-items: center; width: 2rem; height: 2rem; flex: 0 0 auto; border-radius: 0.6rem; font-size: 0.8rem; }
.condemned-summary-icon--slate { background: #f0f3f4; color: #475467; }
.condemned-summary-icon--amber { background: #fff3d5; color: #a66a00; }
.condemned-summary-icon--green { background: #eef7e9; color: var(--office-green); }
.condemned-summary-icon--blue { background: #edf4ff; color: #2563a8; }
.condemned-summary-label { color: var(--text-muted); font-size: 0.66rem; font-weight: 800; letter-spacing: 0.07em; text-transform: uppercase; }
.condemned-filter-bar { padding: 1rem 1.1rem; }
.condemned-filter-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; margin-bottom: 0.9rem; }
.condemned-filter-heading h2 { margin: 0; color: var(--rich-black); font-size: 0.95rem; font-weight: 800; }
.condemned-filter-heading p:last-child { margin: 0.3rem 0 0; color: var(--text-muted); font-size: 0.74rem; }
.condemned-filter-form { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); align-items: end; gap: 0.75rem; }
.condemned-filter-form .form-label { margin-bottom: 0.3rem; font-size: 0.7rem; }
.condemned-filter-form .form-control, .condemned-filter-form .form-select { min-height: 2.45rem; padding: 0.5rem 0.7rem; font-size: 0.8rem; }
.condemned-filter-search { grid-column: span 3; }
.condemned-filter-submit { min-height: 2.45rem; white-space: nowrap; }
.condemned-filter-chips { display: flex; align-items: center; flex-wrap: wrap; gap: 0.4rem; margin-top: 0.9rem; padding-top: 0.8rem; border-top: 1px solid #edf1ef; }
.condemned-filter-chip { display: inline-flex; align-items: center; gap: 0.35rem; padding: 0.3rem 0.55rem; border: 1px solid #dce7df; border-radius: 999px; background: #f7faf7; color: #475467; font-size: 0.69rem; }
.condemned-filter-chip:first-child { border-color: #c6ddc9; color: var(--office-green); font-weight: 700; }
.condemned-records-card { padding: 0; overflow: hidden; }
.condemned-table-wrap { overflow-x: auto; }
.condemned-table { min-width: 1240px; table-layout: fixed; }
.condemned-table th:nth-child(1) { width: 10%; }
.condemned-table th:nth-child(2) { width: 20%; }
.condemned-table th:nth-child(3) { width: 12%; }
.condemned-table th:nth-child(4) { width: 13%; }
.condemned-table th:nth-child(5) { width: 14%; }
.condemned-table th:nth-child(6) { width: 18%; }
.condemned-table th:nth-child(7) { width: 13%; }
.condemned-table td { vertical-align: top; }
.condemned-date-cell { color: #475467; font-size: 0.76rem; font-weight: 700; white-space: nowrap; }
.condemned-equipment-cell, .condemned-reason-cell { display: grid; gap: 0.25rem; min-width: 0; }
.condemned-equipment-name { overflow-wrap: anywhere; color: #1f2937; font-size: 0.8rem; }
.condemned-equipment-type { color: var(--text-muted); font-size: 0.7rem; }
.condemned-serial { color: #475467; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 0.72rem; overflow-wrap: anywhere; }
.condemned-accountability { display: inline-flex; align-items: flex-start; gap: 0.35rem; color: #475467; font-size: 0.75rem; overflow-wrap: anywhere; }
.condemned-accountability i { margin-top: 0.15rem; color: var(--office-green); font-size: 0.7rem; }
.condemned-reason-preview { display: -webkit-box; overflow: hidden; color: #475467; font-size: 0.75rem; line-height: 1.4; overflow-wrap: anywhere; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; }
.lifecycle-badge { display: inline-flex; align-items: center; gap: 0.3rem; width: fit-content; padding: 0.18rem 0.4rem; border-radius: 999px; font-size: 0.62rem; font-weight: 700; white-space: nowrap; }
.lifecycle-badge--parts { background: #eef7e9; color: var(--office-green); }
.lifecycle-badge--none { background: #f0f3f4; color: #667085; }
.condemned-actions { display: flex; align-items: center; justify-content: flex-start; gap: 0.35rem; flex-wrap: nowrap; white-space: nowrap; }
.condemned-actions form { display: flex; flex: 0 0 auto; }
.condemned-actions .btn-sm { min-height: 2rem; padding: 0.4rem 0.55rem; white-space: nowrap; }
.condemned-actions .btn-danger { min-width: 2rem; padding-left: 0.45rem; padding-right: 0.45rem; }
.condemned-pagination { display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; padding: 0.85rem 1.15rem 1rem; color: var(--text-muted); font-size: 0.72rem; }
.condemned-pagination nav { display: flex; align-items: center; gap: 0.3rem; }
.condemned-pagination a, .condemned-pagination-gap { display: inline-flex; align-items: center; justify-content: center; min-width: 2rem; min-height: 2rem; padding: 0.35rem 0.5rem; border: 1px solid #dce5df; border-radius: 0.45rem; background: #ffffff; color: #475467; font-size: 0.73rem; text-decoration: none; }
.condemned-pagination a:hover, .condemned-pagination a:focus-visible { border-color: #aac8ae; background: #f5faf6; color: var(--office-green); outline: none; }
.condemned-pagination a.is-current { border-color: var(--office-green); background: var(--office-green); color: #ffffff; }
.condemned-pagination a.is-disabled { pointer-events: none; opacity: 0.45; }
.condemned-modal-panel { padding: 0 1.25rem 1.25rem; }
.condemned-modal-panel:focus { outline: none; }
.condemned-modal-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; padding: 1.25rem 0 1rem; border-bottom: 1px solid #edf1ef; }
.condemned-modal-header h2 { margin: 0; color: var(--office-green); font-size: 1.15rem; font-weight: 800; }
.condemned-modal-header p:last-child { margin: 0.25rem 0 0; color: var(--text-muted); font-size: 0.74rem; }
.condemned-view-panel { display: grid; gap: 0.9rem; padding-top: 1rem; }
.condemned-detail-section { padding: 0.95rem 1rem; border: 1px solid #e1e9e3; border-radius: 0.7rem; background: #fbfdfb; }
.condemned-detail-section h3 { margin: 0 0 0.8rem; color: #475467; font-size: 0.72rem; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }
.condemned-detail-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.85rem 1rem; margin: 0; }
.condemned-detail-grid > div { min-width: 0; }
.condemned-detail-grid dt { margin-bottom: 0.25rem; color: var(--text-muted); font-size: 0.68rem; font-weight: 700; }
.condemned-detail-grid dd { margin: 0; color: #1f2937; font-size: 0.8rem; line-height: 1.5; overflow-wrap: anywhere; white-space: pre-wrap; }
.condemned-detail-grid--stacked { grid-template-columns: 1fr; }
.condemned-edit-form { display: grid; gap: 1rem; padding-top: 1rem; }
.condemned-edit-form fieldset { min-width: 0; margin: 0; padding: 0.95rem 1rem 1rem; border: 1px solid #e1e9e3; border-radius: 0.7rem; }
.condemned-edit-form legend { padding: 0 0.35rem; color: #475467; font-size: 0.72rem; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }
.condemned-edit-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.8rem; }
.condemned-edit-grid--wide { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.condemned-edit-full { grid-column: 1 / -1; }
.condemned-edit-note { display: flex; align-items: flex-start; gap: 0.5rem; padding: 0.65rem 0.75rem; border: 1px solid #dce7df; border-radius: 0.55rem; background: #f7faf7; color: #475467; font-size: 0.72rem; line-height: 1.45; }
.condemned-edit-note i { margin-top: 0.15rem; color: var(--office-green); }
.condemned-modal-footer { display: flex; justify-content: flex-end; gap: 0.5rem; padding-top: 1rem; margin-top: 1rem; border-top: 1px solid #edf1ef; }

@media print {
  .condemned-filter-bar, .condemned-modal, .condemned-pagination, .condemned-header, .condemned-actions { display: none !important; }
  .condemned-summary-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0.4rem; }
  .condemned-summary-card { padding: 0.45rem 0.55rem; border-radius: 0; box-shadow: none; }
  .condemned-summary-icon { display: none; }
  .condemned-summary-card strong { font-size: 1rem; }
  .condemned-records-card { overflow: visible; }
  .condemned-table { min-width: 0 !important; width: 100%; table-layout: fixed; font-size: 8.5pt; }
  .condemned-table th, .condemned-table td { padding: 0.35rem 0.4rem; }
  .condemned-table th:nth-child(1) { width: 13%; }
  .condemned-table th:nth-child(2) { width: 22%; }
  .condemned-table th:nth-child(3) { width: 12%; }
  .condemned-table th:nth-child(4) { width: 17%; }
  .condemned-table th:nth-child(5) { width: 16%; }
  .condemned-table th:nth-child(6) { width: 18%; }
  .condemned-table th:nth-child(7) { display: none; }
  .condemned-table td:last-child { display: none; }
  .condemned-reason-preview { display: block; font-size: 8pt; }
  .lifecycle-badge { display: none; }
  .condemned-equipment-name, .condemned-date-cell, .condemned-serial, .condemned-accountability, .condemned-reason-preview { font-size: 8pt; }
}

@media (max-width: 1100px) {
  .condemned-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .condemned-filter-form { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .condemned-filter-search { grid-column: span 2; }
}

@media (max-width: 760px) {
  .condemned-filter-heading, .condemned-pagination { align-items: flex-start; flex-direction: column; }
  .condemned-filter-heading .btn-ghost { width: 100%; justify-content: center; }
  .condemned-filter-form { grid-template-columns: 1fr; }
  .condemned-filter-search { grid-column: auto; }
  .condemned-filter-submit { width: 100%; justify-content: center; }
  .condemned-pagination nav { width: 100%; justify-content: flex-start; overflow-x: auto; }
  .condemned-modal-panel { padding: 0 1rem 1rem; }
  .condemned-detail-grid, .condemned-edit-grid, .condemned-edit-grid--wide { grid-template-columns: 1fr; }
  .condemned-edit-full { grid-column: auto; }
  .condemned-modal-footer { flex-direction: column-reverse; }
  .condemned-modal-footer > * { width: 100%; justify-content: center; }
}

@media (max-width: 375px) {
  .condemned-summary-grid { grid-template-columns: 1fr; }
}

/* ICTD Server PMS operational report */
.server-pms-page { display: grid; gap: 1rem; }
.server-pms-header { align-items: flex-end; }
.server-pms-summary-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0.7rem; }
.server-pms-summary-card { display: flex; align-items: flex-start; gap: 0.75rem; min-width: 0; padding: 0.9rem 1rem; border: 1px solid #dfe8e1; border-radius: 0.75rem; background: #ffffff; }
.server-pms-summary-card > div:last-child { display: grid; gap: 0.2rem; min-width: 0; }
.server-pms-summary-card strong { color: var(--rich-black); font-size: 1.5rem; line-height: 1.1; letter-spacing: -0.04em; }
.server-pms-summary-card small { color: var(--text-muted); font-size: 0.68rem; line-height: 1.35; }
.server-pms-summary-card--green { border-color: #c6ddc9; background: #fbfefb; }
.server-pms-summary-card--amber { border-color: #ead7b0; background: #fffdf8; }
.server-pms-summary-card--red { border-color: #efd0cc; background: #fffafa; }
.server-pms-summary-icon { display: grid; place-items: center; width: 2rem; height: 2rem; flex: 0 0 auto; border-radius: 0.6rem; font-size: 0.8rem; }
.server-pms-summary-icon--slate { background: #f0f3f4; color: #475467; }
.server-pms-summary-icon--green { background: #eef7e9; color: var(--office-green); }
.server-pms-summary-icon--amber { background: #fff3d5; color: #a66a00; }
.server-pms-summary-icon--red { background: #fff0ee; color: #b42318; }
.server-pms-summary-label { color: var(--text-muted); font-size: 0.66rem; font-weight: 800; letter-spacing: 0.07em; text-transform: uppercase; }
.server-pms-filter-bar { padding: 1rem 1.1rem; }
.server-pms-filter-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; margin-bottom: 0.9rem; }
.server-pms-filter-heading h2 { margin: 0; color: var(--rich-black); font-size: 0.95rem; font-weight: 800; }
.server-pms-filter-heading p:last-child { margin: 0.3rem 0 0; color: var(--text-muted); font-size: 0.74rem; }
.server-pms-filter-form { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); align-items: end; gap: 0.75rem; }
.server-pms-filter-form .form-label { margin-bottom: 0.3rem; font-size: 0.7rem; }
.server-pms-filter-form .form-control, .server-pms-filter-form .form-select { min-height: 2.45rem; padding: 0.5rem 0.7rem; font-size: 0.8rem; }
.server-pms-filter-search { grid-column: span 3; }
.server-pms-filter-submit { min-height: 2.45rem; white-space: nowrap; }
.server-pms-filter-chips { display: flex; align-items: center; flex-wrap: wrap; gap: 0.4rem; margin-top: 0.9rem; padding-top: 0.8rem; border-top: 1px solid #edf1ef; }
.server-pms-filter-chip { display: inline-flex; align-items: center; gap: 0.35rem; padding: 0.3rem 0.55rem; border: 1px solid #dce7df; border-radius: 999px; background: #f7faf7; color: #475467; font-size: 0.69rem; }
.server-pms-filter-chip:first-child { border-color: #c6ddc9; color: var(--office-green); font-weight: 700; }
.server-pms-records-card { padding: 0; overflow: hidden; }
.server-pms-table-wrap { overflow-x: auto; }
.server-pms-table { min-width: 1180px; table-layout: fixed; }
.server-pms-table th:nth-child(1) { width: 10%; }
.server-pms-table th:nth-child(2) { width: 20%; }
.server-pms-table th:nth-child(3) { width: 15%; }
.server-pms-table th:nth-child(4) { width: 11%; }
.server-pms-table th:nth-child(5) { width: 13%; }
.server-pms-table th:nth-child(6) { width: 13%; }
.server-pms-table th:nth-child(7) { width: 9%; }
.server-pms-table th:nth-child(8) { width: 9%; }
.server-pms-table td { vertical-align: top; }
.server-pms-date-cell, .server-pms-next-date { color: #475467; font-size: 0.76rem; font-weight: 700; white-space: nowrap; }
.server-identity, .server-location { display: grid; gap: 0.22rem; min-width: 0; }
.server-name { overflow-wrap: anywhere; color: #1f2937; font-size: 0.8rem; }
.server-meta, .server-serial { color: var(--text-muted); font-size: 0.7rem; overflow-wrap: anywhere; }
.server-serial { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 0.68rem; }
.server-location strong { color: #475467; font-size: 0.76rem; font-weight: 600; overflow-wrap: anywhere; }
.server-ip { color: #475467; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 0.7rem; overflow-wrap: anywhere; }
.maintenance-badge { display: inline-flex; width: fit-content; padding: 0.25rem 0.45rem; border: 1px solid #dce7df; border-radius: 999px; background: #f7faf7; color: #475467; font-size: 0.68rem; font-weight: 700; white-space: nowrap; }
.server-pms-by { display: inline-flex; align-items: flex-start; gap: 0.35rem; color: #475467; font-size: 0.74rem; overflow-wrap: anywhere; }
.server-pms-by i { margin-top: 0.15rem; color: var(--office-green); font-size: 0.68rem; }
.server-pms-actions { display: flex; align-items: center; justify-content: flex-start; gap: 0.35rem; flex-wrap: nowrap; white-space: nowrap; }
.server-pms-actions form { display: flex; flex: 0 0 auto; }
.server-pms-actions .btn-sm { min-height: 2rem; padding: 0.4rem 0.55rem; white-space: nowrap; }
.server-pms-actions .btn-danger { min-width: 2rem; padding-left: 0.45rem; padding-right: 0.45rem; }
.server-issues-indicator { display: grid; place-items: center; width: 2rem; height: 2rem; flex: 0 0 auto; border: 1px solid #ead7b0; border-radius: 0.45rem; background: #fffdf8; color: #a66a00; }
.server-pms-pagination { display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; padding: 0.85rem 1.15rem 1rem; color: var(--text-muted); font-size: 0.72rem; }
.server-pms-pagination nav { display: flex; align-items: center; gap: 0.3rem; }
.server-pms-pagination a, .server-pms-pagination-gap { display: inline-flex; align-items: center; justify-content: center; min-width: 2rem; min-height: 2rem; padding: 0.35rem 0.5rem; border: 1px solid #dce5df; border-radius: 0.45rem; background: #ffffff; color: #475467; font-size: 0.73rem; text-decoration: none; }
.server-pms-pagination a:hover, .server-pms-pagination a:focus-visible { border-color: #aac8ae; background: #f5faf6; color: var(--office-green); outline: none; }
.server-pms-pagination a.is-current { border-color: var(--office-green); background: var(--office-green); color: #ffffff; }
.server-pms-pagination a.is-disabled { pointer-events: none; opacity: 0.45; }
.server-pms-modal-panel { padding: 0 1.25rem 1.25rem; }
.server-pms-modal-panel:focus { outline: none; }
.server-pms-modal-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; padding: 1.25rem 0 1rem; border-bottom: 1px solid #edf1ef; }
.server-pms-modal-header h2 { margin: 0; color: var(--office-green); font-size: 1.15rem; font-weight: 800; }
.server-pms-modal-header p:last-child { margin: 0.25rem 0 0; color: var(--text-muted); font-size: 0.74rem; }
.server-pms-view-panel, .server-pms-edit-form { display: grid; gap: 0.9rem; padding-top: 1rem; }
.server-pms-detail-section, .server-pms-edit-form fieldset { min-width: 0; padding: 0.95rem 1rem; border: 1px solid #e1e9e3; border-radius: 0.7rem; background: #fbfdfb; }
.server-pms-detail-section h3, .server-pms-edit-form legend { margin: 0 0 0.8rem; color: #475467; font-size: 0.72rem; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }
.server-pms-edit-form fieldset { margin: 0; background: #ffffff; }
.server-pms-edit-form legend { padding: 0 0.35rem; margin-bottom: 0; }
.server-pms-detail-grid, .server-pms-assessment-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0.85rem 1rem; margin: 0; }
.server-pms-detail-grid > div, .server-pms-assessment-grid > div { min-width: 0; }
.server-pms-detail-grid dt, .server-pms-assessment-grid dt { margin-bottom: 0.25rem; color: var(--text-muted); font-size: 0.68rem; font-weight: 700; }
.server-pms-detail-grid dd, .server-pms-assessment-grid dd { margin: 0; color: #1f2937; font-size: 0.8rem; line-height: 1.5; overflow-wrap: anywhere; white-space: pre-wrap; }
.server-pms-assessment-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.server-pms-assessment-grid dd { min-height: 2rem; }
.server-pms-health-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; }
.server-pms-health-heading h3 { margin-bottom: 0.2rem; }
.server-pms-health-heading p { margin: 0 0 0.8rem; color: var(--text-muted); font-size: 0.7rem; }
.health-summary-counts { padding: 0.35rem 0.55rem; border: 1px solid #dce7df; border-radius: 999px; background: #f7faf7; color: #475467; font-size: 0.68rem; white-space: nowrap; }
.server-health-groups { display: grid; gap: 0.8rem; }
.server-health-group h4 { margin: 0 0 0.5rem; color: #667085; font-size: 0.68rem; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }
.server-health-check-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.45rem; }
.health-check-item { display: flex; align-items: center; justify-content: space-between; gap: 0.5rem; min-width: 0; padding: 0.55rem 0.65rem; border: 1px solid #e5eee7; border-radius: 0.5rem; background: #ffffff; }
.health-check-label { color: #475467; font-size: 0.72rem; line-height: 1.35; }
.health-status-badge { display: inline-flex; align-items: center; justify-content: center; width: fit-content; padding: 0.25rem 0.45rem; border-radius: 999px; font-size: 0.64rem; font-weight: 800; line-height: 1.2; white-space: nowrap; }
.health-status-badge.condition-good { background: #eef7e9; color: var(--office-green); }
.health-status-badge.condition-attention { background: #fff3d5; color: #946200; }
.health-status-badge.condition-critical { background: #fff0ee; color: #b42318; }
.health-status-badge.condition-neutral { background: #f0f3f4; color: #667085; }
.server-pms-edit-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.8rem; padding-top: 0.2rem; }
.server-pms-edit-grid--three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.server-pms-edit-full { grid-column: 1 / -1; }
.server-pms-edit-note { display: flex; align-items: flex-start; gap: 0.5rem; padding: 0.65rem 0.75rem; border: 1px solid #dce7df; border-radius: 0.55rem; background: #f7faf7; color: #475467; font-size: 0.72rem; line-height: 1.45; }
.server-pms-edit-note i { margin-top: 0.15rem; color: var(--office-green); }
.server-pms-modal-footer { display: flex; justify-content: flex-end; gap: 0.5rem; padding-top: 1rem; margin-top: 1rem; border-top: 1px solid #edf1ef; }

@media print {
  .server-pms-filter-bar, .server-pms-modal, .server-pms-pagination, .server-pms-header, .server-pms-actions, .server-issues-indicator { display: none !important; }
  .server-pms-summary-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0.4rem; }
  .server-pms-summary-card { padding: 0.45rem 0.55rem; border-radius: 0; box-shadow: none; }
  .server-pms-summary-icon { display: none; }
  .server-pms-summary-card strong { font-size: 1rem; }
  .server-pms-records-card { overflow: visible; }
  .server-pms-table { min-width: 0 !important; width: 100%; table-layout: fixed; font-size: 8.5pt; }
  .server-pms-table th, .server-pms-table td { padding: 0.35rem 0.4rem; }
  .server-pms-table th:nth-child(1) { width: 13%; }
  .server-pms-table th:nth-child(2) { width: 22%; }
  .server-pms-table th:nth-child(3) { width: 18%; }
  .server-pms-table th:nth-child(4) { width: 13%; }
  .server-pms-table th:nth-child(5) { width: 14%; }
  .server-pms-table th:nth-child(6) { width: 12%; }
  .server-pms-table th:nth-child(7) { width: 8%; }
  .server-pms-table th:nth-child(8) { display: none; }
  .server-pms-table td:last-child { display: none; }
  .server-name, .server-meta, .server-serial, .server-location strong, .server-ip, .server-pms-by, .server-pms-date-cell, .server-pms-next-date { font-size: 8pt; }
}

@media (max-width: 1100px) {
  .server-pms-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .server-pms-filter-form { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .server-pms-filter-search { grid-column: span 2; }
  .server-health-check-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 760px) {
  .server-pms-filter-heading, .server-pms-pagination { align-items: flex-start; flex-direction: column; }
  .server-pms-filter-heading .btn-ghost { width: 100%; justify-content: center; }
  .server-pms-filter-form { grid-template-columns: 1fr; }
  .server-pms-filter-search { grid-column: auto; }
  .server-pms-filter-submit { width: 100%; justify-content: center; }
  .server-pms-pagination nav { width: 100%; justify-content: flex-start; overflow-x: auto; }
  .server-pms-modal-panel { padding: 0 1rem 1rem; }
  .server-pms-detail-grid, .server-pms-assessment-grid, .server-pms-edit-grid, .server-pms-edit-grid--three, .server-health-check-grid { grid-template-columns: 1fr; }
  .server-pms-edit-full { grid-column: auto; }
  .server-pms-health-heading { align-items: flex-start; flex-direction: column; gap: 0; }
  .server-pms-modal-footer { flex-direction: column-reverse; }
  .server-pms-modal-footer > * { width: 100%; justify-content: center; }
}

@media (max-width: 375px) {
  .server-pms-summary-grid { grid-template-columns: 1fr; }
}

/* Server PMS create form */
.server-pms-create-page { display: grid; gap: 1rem; }
.server-pms-create-header { align-items: flex-end; }
.server-pms-create-card { max-width: 78rem; padding: 1.15rem; }
.server-pms-create-form { display: grid; gap: 1rem; }
.server-pms-create-form fieldset { min-width: 0; margin: 0; padding: 1rem 1.05rem 1.1rem; border: 1px solid #e1e9e3; border-radius: 0.75rem; background: #fbfdfb; }
.server-pms-create-form legend { padding: 0 0.4rem; color: #475467; font-size: 0.75rem; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }
.server-pms-form-help { margin: -0.2rem 0 0.85rem; color: var(--text-muted); font-size: 0.74rem; line-height: 1.45; }
.server-pms-create-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.85rem; }
.server-pms-create-grid--three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.server-pms-create-full { grid-column: 1 / -1; }
.required-mark { color: #b42318; }
.server-pms-readonly { background: #f5f7f6; }
.server-pms-field-note { margin: 0.25rem 0 0; color: var(--text-muted); font-size: 0.68rem; line-height: 1.35; }
.server-pms-create-actions { display: flex; justify-content: flex-end; gap: 0.55rem; padding-top: 0.15rem; }
.server-pms-create-error { display: flex; align-items: flex-start; gap: 0.55rem; max-width: 78rem; }
.server-pms-create-error ul { display: grid; gap: 0.2rem; margin: 0.35rem 0 0; padding-left: 1rem; }

@media (max-width: 1100px) {
  .server-pms-create-grid--three { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 760px) {
  .server-pms-create-header { align-items: flex-start; }
  .server-pms-create-header > a { width: 100%; justify-content: center; }
  .server-pms-create-card { padding: 0.9rem; }
  .server-pms-create-grid, .server-pms-create-grid--three { grid-template-columns: 1fr; }
  .server-pms-create-full { grid-column: auto; }
  .server-pms-create-actions { flex-direction: column; }
  .server-pms-create-actions > * { width: 100%; justify-content: center; }
}

/* Audit log page */
.audit-page { display: grid; gap: 1rem; }
.audit-header { align-items: flex-end; }
.audit-kicker { margin: 0 0 0.3rem; color: var(--office-green); font-size: 0.68rem; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase; }
.audit-header .page-description { max-width: 50rem; }
.audit-summary-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0.8rem; }
.audit-summary-card { display: flex; align-items: flex-start; gap: 0.75rem; min-width: 0; padding: 0.95rem 1rem; border: 1px solid #dce7df; border-radius: 0.85rem; background: #fff; box-shadow: 0 8px 22px rgba(25, 65, 42, 0.05); }
.audit-summary-card--red { border-color: #f0d5d3; }
.audit-summary-card--blue { border-color: #d3e0f1; }
.audit-summary-card--amber { border-color: #efdfbd; }
.audit-summary-icon { display: grid; flex: 0 0 2.15rem; width: 2.15rem; height: 2.15rem; place-items: center; border-radius: 0.65rem; color: #385268; background: #edf2f4; }
.audit-summary-icon--red { color: #b42318; background: #fff0ef; }
.audit-summary-icon--blue { color: #175cd3; background: #eef4ff; }
.audit-summary-icon--amber { color: #9a6700; background: #fff7e5; }
.audit-summary-card > div:last-child { display: grid; min-width: 0; gap: 0.1rem; }
.audit-summary-label { color: #526273; font-size: 0.7rem; font-weight: 800; letter-spacing: 0.05em; text-transform: uppercase; }
.audit-summary-card strong { color: #172b1e; font-size: 1.45rem; line-height: 1.1; }
.audit-summary-card small { color: var(--text-muted); font-size: 0.7rem; }
.audit-filter-bar { display: grid; gap: 0.85rem; padding: 1.1rem; }
.audit-filter-heading, .audit-records-toolbar { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; }
.audit-filter-heading h2, .audit-records-toolbar h2 { margin: 0; color: #172b1e; font-size: 1rem; }
.audit-filter-heading p:not(.audit-kicker), .audit-records-toolbar p:not(.audit-kicker) { margin: 0.25rem 0 0; color: var(--text-muted); font-size: 0.76rem; }
.audit-filter-form { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 0.75rem; align-items: end; }
.audit-filter-form > div, .audit-filter-search { min-width: 0; }
.audit-filter-search { grid-column: span 3; }
.audit-filter-submit { min-height: 2.55rem; white-space: nowrap; }
.audit-filter-chips { display: flex; flex-wrap: wrap; gap: 0.4rem; }
.audit-filter-chip { display: inline-flex; align-items: center; gap: 0.35rem; max-width: 100%; padding: 0.35rem 0.6rem; overflow: hidden; border: 1px solid #d8e5db; border-radius: 999px; color: #315740; background: #f5faf6; font-size: 0.7rem; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.audit-records-card { min-width: 0; overflow: hidden; padding: 1.1rem 0 0; }
.audit-records-toolbar { padding: 0 1.1rem 0.9rem; }
.audit-readonly-badge { display: inline-flex; align-items: center; gap: 0.35rem; flex: 0 0 auto; padding: 0.4rem 0.65rem; border: 1px solid #d8e5db; border-radius: 999px; color: #315740; background: #f5faf6; font-size: 0.7rem; font-weight: 800; white-space: nowrap; }
.audit-table-wrap { overflow-x: auto; border-top: 1px solid #e0e9e2; }
.audit-table { min-width: 1000px; width: 100%; }
.audit-table th, .audit-table td { vertical-align: middle; }
.audit-table th { white-space: nowrap; }
.audit-date { display: grid; gap: 0.12rem; color: #253b2c; font-size: 0.75rem; font-weight: 750; white-space: nowrap; }
.audit-date time { color: var(--text-muted); font-size: 0.68rem; font-weight: 600; }
.audit-user, .audit-ip { display: inline-flex; align-items: center; gap: 0.35rem; color: #344054; font-size: 0.75rem; }
.audit-user i { color: var(--office-green); font-size: 0.65rem; }
.audit-ip { color: #667085; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 0.7rem; }
.audit-entity { display: grid; gap: 0.12rem; }
.audit-entity strong { color: #253b2c; font-size: 0.75rem; }
.audit-entity span { color: var(--text-muted); font-size: 0.68rem; }
.audit-description { display: block; max-width: 24rem; overflow: hidden; color: #475467; font-size: 0.75rem; text-overflow: ellipsis; white-space: nowrap; }
.audit-action { display: inline-flex; align-items: center; gap: 0.38rem; padding: 0.34rem 0.55rem; border: 1px solid transparent; border-radius: 999px; font-size: 0.68rem; font-weight: 800; line-height: 1; white-space: nowrap; }
.audit-action-dot { width: 0.38rem; height: 0.38rem; border-radius: 50%; background: currentColor; }
.audit-action-create, .audit-action-login { color: #177245; background: #eaf8ef; border-color: #c8ead4; }
.audit-action-update, .audit-action-export { color: #175cd3; background: #eef4ff; border-color: #cbdcff; }
.audit-action-delete, .audit-action-failed { color: #b42318; background: #fff0ef; border-color: #f3c8c4; }
.audit-action-logout, .audit-action-neutral { color: #526273; background: #f2f4f5; border-color: #dce2e5; }
.audit-action-status { color: #9a6700; background: #fff7e5; border-color: #efdfbd; }
.audit-no-details { color: #98a2b3; font-size: 0.8rem; }
.audit-pagination { display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; padding: 0.9rem 1.1rem 1.05rem; color: var(--text-muted); font-size: 0.72rem; }
.audit-pagination nav { display: flex; align-items: center; gap: 0.25rem; }
.audit-pagination a, .audit-pagination-gap { display: grid; min-width: 2rem; height: 2rem; place-items: center; border: 1px solid #dce7df; border-radius: 0.45rem; color: #344054; background: #fff; font-size: 0.72rem; text-decoration: none; }
.audit-pagination a:hover { border-color: #98c7a5; color: var(--office-green); background: #f5faf6; }
.audit-pagination a.is-current { border-color: var(--office-green); color: #fff; background: var(--office-green); }
.audit-pagination a.is-disabled { pointer-events: none; color: #b8c2bb; background: #f7f9f7; }
.audit-pagination-gap { border-color: transparent; color: #98a2b3; background: transparent; }
.audit-detail-modal { backdrop-filter: blur(2px); }
.audit-detail-panel { border: 1px solid #dce7df; }
.audit-detail-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; padding: 1.2rem 1.25rem 1rem; border-bottom: 1px solid #e6eee8; background: #fbfdfb; }
.audit-detail-header h2 { margin: 0; color: #172b1e; font-size: 1.15rem; }
.audit-detail-header p:last-child { margin: 0.25rem 0 0; color: var(--text-muted); font-size: 0.76rem; }
.audit-detail-content { display: grid; gap: 1rem; padding: 1.25rem; }
.audit-event-meta { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0.7rem; }
.audit-event-meta > div { display: grid; min-width: 0; gap: 0.25rem; padding: 0.7rem; border: 1px solid #e2ebe4; border-radius: 0.65rem; background: #fff; }
.audit-event-meta-wide { grid-column: span 2; }
.audit-event-meta span { color: #667085; font-size: 0.66rem; font-weight: 800; letter-spacing: 0.05em; text-transform: uppercase; }
.audit-event-meta strong { overflow-wrap: anywhere; color: #253b2c; font-size: 0.78rem; font-weight: 700; }
.audit-changes-section { display: grid; gap: 0.65rem; }
.audit-changes-heading { display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; }
.audit-changes-heading h3 { margin: 0; color: #172b1e; font-size: 0.95rem; }
.audit-changes-heading p { margin: 0.2rem 0 0; color: var(--text-muted); font-size: 0.72rem; }
.audit-diff-wrap { overflow-x: auto; border: 1px solid #e0e9e2; border-radius: 0.65rem; }
.audit-diff-table { width: 100%; min-width: 620px; border-collapse: collapse; }
.audit-diff-table th, .audit-diff-table td { padding: 0.65rem 0.75rem; border-bottom: 1px solid #e7eee9; text-align: left; vertical-align: top; }
.audit-diff-table tr:last-child td { border-bottom: 0; }
.audit-diff-table th { color: #526273; background: #f7faf8; font-size: 0.66rem; letter-spacing: 0.06em; text-transform: uppercase; }
.audit-diff-table td { color: #475467; font-size: 0.75rem; white-space: pre-wrap; overflow-wrap: anywhere; }
.audit-diff-field { width: 22%; color: #253b2c !important; font-weight: 800; }
.audit-before { background: #fff8f7; }
.audit-after { background: #f5fbf6; }
.audit-no-changes, .audit-modal-message { color: var(--text-muted) !important; text-align: center !important; }
.audit-payload-notice { margin: 0; padding: 0.65rem 0.75rem; border: 1px solid #efdfbd; border-radius: 0.55rem; color: #7a4b00; background: #fffaf0; font-size: 0.73rem; }
.audit-modal-message { display: flex; align-items: center; justify-content: center; gap: 0.5rem; padding: 2rem 1.25rem; }
.audit-modal-message--error { color: #b42318 !important; }
.audit-detail-footer { display: flex; justify-content: flex-end; padding: 0 1.25rem 1.15rem; }

@media (max-width: 1100px) {
  .audit-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .audit-filter-form { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .audit-filter-search { grid-column: span 2; }
}

@media (max-width: 760px) {
  .audit-header { align-items: flex-start; }
  .audit-summary-grid, .audit-filter-form { grid-template-columns: 1fr; }
  .audit-filter-search { grid-column: auto; }
  .audit-filter-heading, .audit-records-toolbar, .audit-pagination { align-items: flex-start; flex-direction: column; }
  .audit-filter-heading .btn-ghost, .audit-filter-submit { width: 100%; justify-content: center; }
  .audit-records-card { border-radius: 0.75rem; }
  .audit-event-meta { grid-template-columns: 1fr; }
  .audit-event-meta-wide { grid-column: auto; }
  .audit-changes-heading { align-items: flex-start; flex-direction: column; }
  .audit-pagination nav { width: 100%; justify-content: flex-start; overflow-x: auto; padding-bottom: 0.1rem; }
}

@media print {
  .audit-filter-bar, .audit-pagination, .audit-detail-modal, .audit-readonly-badge, .audit-table th:last-child, .audit-table td:last-child { display: none !important; }
  .audit-page, .audit-records-card { display: block; box-shadow: none; }
  .audit-records-card { padding-top: 0; }
  .audit-table-wrap { overflow: visible; border-top: 1px solid #222; }
  .audit-table { min-width: 0; font-size: 9pt; }
  .audit-table thead { display: table-header-group; }
  .audit-table tr { break-inside: avoid; }
}

/* Device registration form */
.device-form-page { display: grid; gap: 1rem; width: 100%; max-width: 66rem; margin: 0 auto; }
.device-form-header { align-items: flex-end; }
.device-form-kicker { display: flex; align-items: center; gap: 0.4rem; margin: 0 0 0.3rem; color: var(--office-green); font-size: 0.68rem; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase; }
.device-form-card { padding: 0; overflow: hidden; }
.device-form { display: grid; gap: 0; }
.device-form-required-note { margin: 0; padding: 0.8rem 1.35rem; border-bottom: 1px solid #edf1ef; color: var(--text-muted); font-size: 0.74rem; }
.form-required { color: #b42318; font-weight: 800; }
.device-form-error-summary { display: flex; align-items: flex-start; gap: 0.75rem; padding: 0.9rem 1rem; border: 1px solid #f2b8b5; border-radius: 0.75rem; color: #912018; background: #fff4f2; }
.device-form-error-icon { display: grid; flex: 0 0 1.8rem; width: 1.8rem; height: 1.8rem; place-items: center; }
.device-form-error-summary h2 { margin: 0; font-size: 0.88rem; font-weight: 800; }
.device-form-error-summary p { margin: 0.2rem 0 0; font-size: 0.77rem; }
.device-form-error-summary ul { display: grid; gap: 0.2rem; margin: 0.45rem 0 0; padding-left: 1rem; font-size: 0.75rem; }
.device-form-error-summary a { color: #7a271a; font-weight: 800; text-decoration: underline; text-underline-offset: 2px; }
.form-section { padding: 1.25rem 1.35rem 1.35rem; border-bottom: 1px solid #e6eee8; }
.form-section:last-of-type { border-bottom: 0; }
.form-section-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; margin-bottom: 1rem; }
.form-section-eyebrow { margin: 0 0 0.25rem; color: var(--office-green); font-size: 0.66rem; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase; }
.form-section-title { margin: 0; color: #172b1e; font-size: 1rem; font-weight: 800; }
.form-section-description { margin: 0.25rem 0 0; color: var(--text-muted); font-size: 0.76rem; line-height: 1.45; }
.form-section-icon { color: #79a181; font-size: 1rem; }
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.9rem 1rem; }
.form-field { min-width: 0; }
.form-field .form-control, .form-field .form-select { min-height: 2.55rem; }
.form-field .form-error { display: block; }
.form-control.field-error, .form-select.field-error { border-color: var(--danger); box-shadow: 0 0 0 3px rgba(180, 35, 24, 0.12); }
.cpu-spec-section { background: #fbfdfb; }
.cpu-spec-group + .cpu-spec-group { margin-top: 1.15rem; padding-top: 1.1rem; border-top: 1px solid #e5eee7; }
.cpu-spec-group-title { margin: 0 0 0.7rem; color: #526273; font-size: 0.7rem; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }
.form-field--status { max-width: 31rem; }
.form-actions { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1rem 1.35rem 1.25rem; border-top: 1px solid #e6eee8; background: #fbfdfb; }
.form-actions-note { display: flex; align-items: center; gap: 0.45rem; margin: 0; color: var(--text-muted); font-size: 0.73rem; }
.form-actions-note i { color: var(--office-green); }
.form-actions-controls { display: flex; align-items: center; justify-content: flex-end; gap: 0.55rem; }
.form-actions-controls .btn-primary, .form-actions-controls .btn-secondary { min-width: 8.75rem; }
.form-actions-controls .btn-secondary { order: 0; }
.form-actions-controls .btn-primary { order: 1; }

@media (max-width: 760px) {
  .device-form-page { gap: 0.8rem; }
  .device-form-header { align-items: flex-start; }
  .device-form-header > a { width: 100%; justify-content: center; }
  .device-form-card { border-radius: 0.75rem; }
  .form-section { padding: 1rem; }
  .device-form-required-note { padding: 0.75rem 1rem; }
  .form-grid { grid-template-columns: 1fr; gap: 0.8rem; }
  .form-actions { align-items: stretch; flex-direction: column; padding: 0.95rem 1rem 1rem; }
  .form-actions-note { align-items: flex-start; }
  .form-actions-controls { flex-direction: column-reverse; align-items: stretch; }
  .form-actions-controls .btn-primary, .form-actions-controls .btn-secondary { width: 100%; }
}

@media print {
  .device-form-header > a, .device-form-error-summary, .form-actions { display: none !important; }
  .device-form-page { max-width: none; }
  .device-form-card { border: 1px solid #bbb; box-shadow: none; }
  .form-section { break-inside: avoid; }
}

/* PMS create/edit workflow */
.pms-form-page { display: grid; gap: 1rem; width: 100%; max-width: 74rem; margin: 0 auto; }
.pms-form-header { align-items: flex-end; }
.pms-form-kicker, .pms-form-eyebrow { margin: 0 0 0.3rem; color: var(--office-green); font-size: 0.68rem; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase; }
.pms-form-kicker { display: flex; align-items: center; gap: 0.4rem; }
.pms-form-error-summary { display: flex; align-items: flex-start; gap: 0.75rem; padding: 0.9rem 1rem; border: 1px solid #f2b8b5; border-radius: 0.75rem; color: #912018; background: #fff4f2; }
.pms-form-error-icon { display: grid; flex: 0 0 1.8rem; width: 1.8rem; height: 1.8rem; place-items: center; }
.pms-form-error-summary h2 { margin: 0; font-size: 0.88rem; font-weight: 800; }
.pms-form-error-summary p { margin: 0.2rem 0 0; font-size: 0.77rem; }
.pms-form-error-summary ul { display: grid; gap: 0.2rem; margin: 0.45rem 0 0; padding-left: 1rem; font-size: 0.75rem; }
.pms-form-error-summary a { color: #7a271a; font-weight: 800; text-decoration: underline; text-underline-offset: 2px; }
.device-context { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 2fr); gap: 1rem; padding: 1rem 1.1rem; }
.device-context-primary { min-width: 0; padding-right: 1rem; border-right: 1px solid #e6eee8; }
.device-context-primary h2 { margin: 0; overflow-wrap: anywhere; color: #172b1e; font-size: 1.08rem; font-weight: 800; }
.device-context-primary > span { display: inline-block; margin-top: 0.25rem; color: var(--text-muted); font-size: 0.75rem; }
.device-context-meta { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.65rem 1rem; margin: 0; }
.device-context-meta > div { min-width: 0; }
.device-context-meta dt { margin-bottom: 0.18rem; color: var(--text-muted); font-size: 0.66rem; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; }
.device-context-meta dd { margin: 0; overflow-wrap: anywhere; color: #344054; font-size: 0.78rem; font-weight: 700; }
.pms-history { padding: 1.05rem 1.1rem; }
.pms-history-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; margin-bottom: 0.85rem; }
.pms-history-header h2 { margin: 0; color: #172b1e; font-size: 1rem; font-weight: 800; }
.pms-history-header p:last-child { margin: 0.25rem 0 0; color: var(--text-muted); font-size: 0.74rem; }
.pms-history-empty { display: flex; align-items: center; gap: 0.5rem; padding: 0.8rem; border: 1px dashed #cbd8cf; border-radius: 0.6rem; color: var(--text-muted); background: #fbfdfb; font-size: 0.75rem; }
.pms-history-list { display: grid; gap: 0.55rem; }
.pms-history-item { display: grid; grid-template-columns: 7.5rem minmax(0, 1.25fr) minmax(0, 1fr); gap: 0.9rem; padding: 0.75rem 0; border-top: 1px solid #edf1ef; }
.pms-history-item:first-child { border-top: 0; padding-top: 0.1rem; }
.pms-history-date { display: grid; align-content: start; gap: 0.15rem; color: #344054; font-size: 0.73rem; }
.pms-history-date time { color: var(--text-muted); font-size: 0.68rem; }
.pms-history-main, .pms-history-followup { min-width: 0; }
.pms-history-meta { display: flex; align-items: center; flex-wrap: wrap; gap: 0.4rem; color: var(--text-muted); font-size: 0.68rem; }
.pms-history-main p { display: -webkit-box; margin: 0.35rem 0 0; overflow: hidden; color: #475467; font-size: 0.74rem; line-height: 1.45; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.pms-history-followup { display: grid; align-content: start; gap: 0.3rem; color: #667085; font-size: 0.7rem; line-height: 1.4; }
.pms-history-followup span { overflow-wrap: anywhere; }
.pms-history-followup strong { color: #475467; }
.pms-form-card { padding: 0; overflow: hidden; }
.pms-form { display: grid; gap: 0; }
.pms-required-note { margin: 0; padding: 0.8rem 1.35rem; border-bottom: 1px solid #edf1ef; color: var(--text-muted); font-size: 0.74rem; }
.pms-form-section { padding: 1.25rem 1.35rem 1.35rem; border-bottom: 1px solid #e6eee8; }
.pms-form-section:last-of-type { border-bottom: 0; }
.pms-section-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; margin-bottom: 1rem; }
.pms-section-title { margin: 0; color: #172b1e; font-size: 1rem; font-weight: 800; }
.pms-section-description { margin: 0.25rem 0 0; color: var(--text-muted); font-size: 0.76rem; line-height: 1.45; }
.pms-section-icon { color: #79a181; font-size: 1rem; }
.pms-health-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.9rem 1rem; }
.pms-readonly-field { background: var(--surface-muted); color: #475467; }
.pms-parts-grid { display: grid; grid-template-columns: minmax(0, 1.7fr) minmax(14rem, 1fr); gap: 0.9rem 1rem; align-items: start; }
.pms-assessment-fields { display: grid; gap: 0.9rem; }
.pms-form-section .form-control, .pms-form-section .form-select, .pms-form-section .form-textarea { min-height: 2.55rem; }
.pms-form-section .form-textarea { min-height: 5.7rem; }
.pms-form-section .form-control.field-error, .pms-form-section .form-select.field-error, .pms-form-section .form-textarea.field-error { border-color: var(--danger); box-shadow: 0 0 0 3px rgba(180, 35, 24, 0.12); }
.signature-section { background: #fbfdfb; }
.signature-section.has-error { border-top: 2px solid var(--danger); }
.signature-canvas-wrap { padding: 0.65rem; border: 1px solid #cfdcd2; border-radius: 0.7rem; background: #ffffff; }
.signature-canvas-wrap canvas { display: block; width: 100%; height: 12rem; border: 1px dashed #b7c9ba; border-radius: 0.45rem; background: #ffffff; cursor: crosshair; touch-action: none; }
.signature-canvas-wrap canvas:focus-visible { outline: 3px solid rgba(63, 125, 32, 0.28); outline-offset: 2px; }
.signature-help { margin: 0.55rem 0 0; color: var(--text-muted); font-size: 0.72rem; }
.signature-actions { display: flex; align-items: center; gap: 0.8rem; margin-top: 0.7rem; color: var(--text-muted); font-size: 0.72rem; }
.signature-actions > span { margin-left: auto; }
.signature-error { margin: 0.55rem 0 0; color: var(--danger); font-size: 0.75rem; font-weight: 700; }
.signature-edit-note { display: flex; align-items: flex-start; gap: 0.4rem; margin-top: 0.65rem; }
.signature-edit-note i { margin-top: 0.15rem; color: #9a6700; }
.pms-form-actions { display: flex; justify-content: flex-end; gap: 0.55rem; padding: 1rem 1.35rem 1.25rem; border-top: 1px solid #e6eee8; background: #fbfdfb; }
.pms-form-actions .btn-primary, .pms-form-actions .btn-secondary { min-width: 9.5rem; }

@media (max-width: 900px) {
  .device-context { grid-template-columns: 1fr; }
  .device-context-primary { padding-right: 0; padding-bottom: 0.8rem; border-right: 0; border-bottom: 1px solid #e6eee8; }
  .pms-history-item { grid-template-columns: 7rem minmax(0, 1fr); }
  .pms-history-followup { grid-column: 2; }
}

@media (max-width: 760px) {
  .pms-form-page { gap: 0.8rem; }
  .pms-form-header { align-items: flex-start; }
  .pms-form-header > a { width: 100%; justify-content: center; }
  .pms-form-error-summary { padding: 0.8rem; }
  .device-context, .pms-history { padding: 0.9rem; }
  .device-context-meta { grid-template-columns: 1fr; }
  .pms-history-header, .signature-actions { align-items: flex-start; flex-direction: column; }
  .pms-history-item { grid-template-columns: 1fr; gap: 0.45rem; }
  .pms-history-followup { grid-column: auto; padding-top: 0.2rem; }
  .pms-form-section { padding: 1rem; }
  .pms-required-note { padding: 0.75rem 1rem; }
  .pms-health-grid, .pms-parts-grid { grid-template-columns: 1fr; gap: 0.8rem; }
  .signature-canvas-wrap canvas { height: 10rem; }
  .signature-actions > span { margin-left: 0; }
  .pms-form-actions { flex-direction: column-reverse; align-items: stretch; padding: 0.95rem 1rem 1rem; }
  .pms-form-actions .btn-primary, .pms-form-actions .btn-secondary { width: 100%; }
}

@media print {
  .pms-form-header > a, .pms-form-error-summary, .pms-form-actions, .signature-section { display: none !important; }
  .pms-form-page { max-width: none; }
  .pms-history, .pms-form-card, .device-context { box-shadow: none; }
  .pms-history-item { break-inside: avoid; }
}

/* PMS history page */
.pms-history-page { display: grid; gap: 1rem; width: 100%; max-width: 84rem; margin: 0 auto; }
.pms-history-page-header { align-items: flex-end; }
.pms-history-header-actions { display: flex; align-items: center; gap: 0.55rem; }
.pms-history-records { padding: 0; overflow: hidden; }
.pms-records-toolbar { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; padding: 1.1rem 1.15rem 0.9rem; }
.pms-records-toolbar h2 { margin: 0; color: #172b1e; font-size: 1rem; font-weight: 800; }
.pms-records-toolbar p:last-child { margin: 0.25rem 0 0; color: var(--text-muted); font-size: 0.74rem; }
.pms-readonly-badge { display: inline-flex; align-items: center; gap: 0.35rem; flex: 0 0 auto; padding: 0.4rem 0.65rem; border: 1px solid #d8e5db; border-radius: 999px; color: #315740; background: #f5faf6; font-size: 0.7rem; font-weight: 800; white-space: nowrap; }
.pms-records-table-wrap { border: 0; border-top: 1px solid #e0e9e2; border-radius: 0; }
.pms-records-table { min-width: 900px; }
.pms-records-table th, .pms-records-table td { vertical-align: middle; }
.pms-records-table th { white-space: nowrap; }
.pms-record-detail-text { margin: 0; color: #334155; font-size: 0.82rem; line-height: 1.5; white-space: pre-wrap; overflow-wrap: anywhere; }

@media (max-width: 760px) {
  .pms-history-page-header { align-items: flex-start; }
  .pms-history-header-actions { width: 100%; flex-direction: column; align-items: stretch; }
  .pms-history-header-actions > * { width: 100%; justify-content: center; }
  .pms-records-toolbar { align-items: flex-start; flex-direction: column; padding: 0.9rem; }
  .pms-records-table-wrap { overflow-x: auto; }
}

@media print {
  .pms-history-page-header, .pms-readonly-badge, .pms-records-table th:last-child, .pms-records-table td:last-child { display: none !important; }
  .pms-history-page { max-width: none; }
  .pms-records-toolbar { padding: 0.35rem 0 0.55rem; }
  .pms-records-table { min-width: 0 !important; width: 100%; table-layout: fixed; font-size: 8.5pt; }
  .pms-records-table th, .pms-records-table td { padding: 0.35rem 0.4rem; }
}


/* Account management */
.accounts-page, .account-form-page { display: grid; gap: 1rem; width: 100%; max-width: 92rem; margin: 0 auto; }
.accounts-header, .account-form-header { margin-bottom: 0; }
.eyebrow-label { display: flex; align-items: center; gap: 0.4rem; margin: 0 0 0.35rem; color: var(--office-green); font-size: 0.68rem; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase; }
.accounts-summary { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0.8rem; }
.account-stat { display: flex; align-items: flex-start; gap: 0.7rem; min-width: 0; padding: 0.95rem; border: 1px solid #dce8df; border-radius: 0.85rem; background: #fff; box-shadow: 0 4px 16px rgba(24, 54, 34, 0.04); }
.account-stat-icon { display: grid; flex: 0 0 auto; width: 2.25rem; height: 2.25rem; place-items: center; border-radius: 0.65rem; font-size: 0.9rem; }
.account-stat-total .account-stat-icon { color: #315b80; background: #edf5fc; }
.account-stat-active .account-stat-icon { color: #26723e; background: #edf8ef; }
.account-stat-inactive .account-stat-icon { color: #8a5b11; background: #fff7e8; }
.account-stat-admin .account-stat-icon { color: #6c4b93; background: #f4effa; }
.account-stat > div { min-width: 0; }
.account-stat-label, .account-stat-note { display: block; }
.account-stat-label { color: #536477; font-size: 0.68rem; font-weight: 800; letter-spacing: 0.05em; text-transform: uppercase; }
.account-stat strong { display: block; margin: 0.08rem 0 0.1rem; color: #172b1e; font-size: 1.4rem; line-height: 1.1; }
.account-stat-note { color: var(--text-muted); font-size: 0.7rem; }
.accounts-filter-card, .accounts-list-card { padding: 1.15rem; }
.accounts-filter-card .card-header { margin: 0 0 1rem; }
.accounts-filter-form { display: grid; grid-template-columns: minmax(16rem, 1.8fr) minmax(10rem, 1fr) minmax(10rem, 1fr) auto; align-items: end; gap: 0.75rem; }
.account-filter-field { min-width: 0; }
.input-with-icon { position: relative; }
.input-with-icon > i { position: absolute; top: 50%; left: 0.85rem; z-index: 1; color: #82918a; transform: translateY(-50%); pointer-events: none; }
.input-with-icon .form-control { padding-left: 2.35rem; }
.accounts-filter-submit { min-height: 2.55rem; white-space: nowrap; }
.btn-quiet { display: inline-flex; align-items: center; justify-content: center; gap: 0.4rem; min-height: 2.3rem; padding: 0.45rem 0.7rem; border: 1px solid #d7e4da; border-radius: 0.55rem; color: #315740; background: #f8fbf8; font-size: 0.75rem; font-weight: 800; text-decoration: none; }
.btn-quiet:hover { background: #eef6ef; }
.account-filter-chips { display: flex; flex-wrap: wrap; gap: 0.45rem; margin-top: 0.9rem; padding-top: 0.8rem; border-top: 1px solid #edf2ee; }
.account-filter-chip { display: inline-flex; align-items: center; gap: 0.3rem; padding: 0.35rem 0.55rem; border: 1px solid #dbe8df; border-radius: 999px; color: #52675a; background: #f8fbf8; font-size: 0.7rem; }
.account-filter-chip strong { color: #1e4f2b; }
.accounts-list-card { overflow: hidden; padding: 0; }
.accounts-list-header { margin: 0; padding: 1.15rem 1.15rem 0.9rem; }
.account-audit-note { display: inline-flex; align-items: center; gap: 0.35rem; flex: 0 0 auto; padding: 0.4rem 0.6rem; border: 1px solid #d8e5db; border-radius: 999px; color: #315740; background: #f5faf6; font-size: 0.7rem; font-weight: 800; white-space: nowrap; }
.account-desktop-table { border-top: 1px solid #e3ece5; border-radius: 0; }
.account-desktop-table .data-table { min-width: 760px; }
.account-desktop-table .data-table th, .account-desktop-table .data-table td { vertical-align: middle; }
.account-desktop-table .data-table th { padding-top: 0.7rem; padding-bottom: 0.7rem; }
.account-identity { display: flex; align-items: center; gap: 0.65rem; min-width: 0; }
.account-avatar { display: grid; flex: 0 0 auto; width: 2.15rem; height: 2.15rem; place-items: center; border: 1px solid #cfe1d2; border-radius: 0.65rem; color: #21622e; background: #eff8f0; font-size: 0.78rem; font-weight: 900; }
.account-username { display: inline-block; color: #1b3424; font-size: 0.84rem; font-weight: 800; overflow-wrap: anywhere; }
.account-you-badge { display: inline-flex; align-items: center; margin-left: 0.35rem; padding: 0.2rem 0.38rem; border-radius: 999px; color: #315740; background: #edf5ef; font-size: 0.62rem; font-weight: 800; vertical-align: middle; }
.account-role-badge { display: inline-flex; align-items: center; padding: 0.32rem 0.55rem; border: 1px solid #d9e4dc; border-radius: 999px; color: #385444; background: #f7faf7; font-size: 0.7rem; font-weight: 800; white-space: nowrap; }
.account-status-badge { display: inline-flex; align-items: center; gap: 0.35rem; font-size: 0.75rem; font-weight: 800; white-space: nowrap; }
.account-status-badge > span { width: 0.42rem; height: 0.42rem; border-radius: 999px; background: currentColor; }
.account-status-badge.is-active { color: #23723b; }
.account-status-badge.is-inactive { color: #9a6700; }
.account-date { color: #586b60 !important; font-size: 0.76rem; white-space: nowrap; }
.account-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 0.45rem; }
.btn-compact { min-height: 2.2rem; padding: 0.45rem 0.65rem; font-size: 0.72rem; }
.btn-quiet-danger, .btn-quiet-success { display: inline-flex; align-items: center; justify-content: center; gap: 0.35rem; min-height: 2.2rem; padding: 0.45rem 0.65rem; border: 1px solid; border-radius: 0.55rem; background: #fff; font-size: 0.72rem; font-weight: 800; cursor: pointer; }
.btn-quiet-danger { border-color: #f2c7c3; color: #a33d35; }
.btn-quiet-danger:hover { background: #fff5f4; }
.btn-quiet-success { border-color: #cbe4d0; color: #28733b; }
.btn-quiet-success:hover { background: #f3fbf4; }
.account-self-note { color: #75847b; font-size: 0.7rem; font-weight: 700; }
.account-mobile-list { display: none; }
.account-empty-state { margin: 1.5rem; padding: 2rem 1rem; }
.account-pagination { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 0.9rem 1.15rem; border-top: 1px solid #e3ece5; color: #64756a; font-size: 0.72rem; }
.account-pagination nav { display: flex; }
.accounts-role-guide { display: grid; grid-template-columns: minmax(13rem, 0.7fr) minmax(0, 2fr); gap: 1rem; padding: 1.15rem; border: 1px solid #dce8df; border-radius: 0.85rem; background: #f8fbf8; }
.role-guide-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.65rem; }
.role-guide-item { padding: 0.75rem; border: 1px solid #e0eae2; border-radius: 0.7rem; background: #fff; }
.role-guide-item p { margin: 0.55rem 0 0; color: #62736a; font-size: 0.73rem; line-height: 1.45; }
.account-form { display: grid; gap: 1rem; max-width: 58rem; }
.account-form-section { padding: 1.2rem; }
.account-section-heading { display: flex; align-items: flex-start; gap: 0.7rem; padding-bottom: 1rem; border-bottom: 1px solid #e6eee8; }
.account-section-heading .eyebrow-label { margin-bottom: 0.25rem; }
.account-section-icon { display: grid; flex: 0 0 auto; width: 2.35rem; height: 2.35rem; place-items: center; border-radius: 0.7rem; color: #2a6a35; background: #edf8ef; }
.account-section-icon-security { color: #7b5c11; background: #fff7e7; }
.account-section-icon-access { color: #315b80; background: #edf5fc; }
.account-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; padding-top: 1rem; }
.required-mark { color: #b42318; }
.account-role-description { min-height: 2.25rem; margin: 0.45rem 0 0; padding: 0.55rem 0.65rem; border-left: 3px solid #a8cdae; border-radius: 0 0.45rem 0.45rem 0; color: #4f6557; background: #f5faf6; font-size: 0.72rem; line-height: 1.4; }
.account-security-note, .account-warning-note { display: flex; align-items: flex-start; gap: 0.5rem; margin-top: 1rem; padding: 0.7rem 0.8rem; border-radius: 0.6rem; font-size: 0.73rem; line-height: 1.45; }
.account-security-note { color: #5b531f; background: #fffaf0; }
.account-security-note i { margin-top: 0.1rem; color: #a27616; }
.account-warning-note { color: #7b4c12; background: #fff8eb; border: 1px solid #f0dfb5; }
.account-warning-note i { margin-top: 0.1rem; color: #b27b16; }
.password-input-wrap { position: relative; }
.password-input-wrap .form-control { padding-right: 4.5rem; }
.password-toggle { position: absolute; top: 50%; right: 0.45rem; display: inline-flex; align-items: center; gap: 0.28rem; min-height: 1.85rem; padding: 0.25rem 0.4rem; border: 0; border-radius: 0.35rem; color: #536b5b; background: transparent; font-size: 0.7rem; font-weight: 800; transform: translateY(-50%); cursor: pointer; }
.password-toggle:hover, .password-toggle:focus-visible { color: #1d672d; background: #eef7ef; }
.account-access-control { display: flex; align-items: center; gap: 0.7rem; margin-top: 1rem; padding: 0.8rem; border: 1px solid #d9e7dc; border-radius: 0.7rem; background: #fbfdfb; cursor: pointer; }
.account-access-control.is-locked { background: #f5f8f5; cursor: not-allowed; }
.account-access-control > span:last-child { display: grid; gap: 0.15rem; }
.account-access-control strong { color: #233c2b; font-size: 0.82rem; }
.account-access-control small { color: #687a6e; font-size: 0.72rem; }
.account-toggle { position: relative; display: inline-flex; flex: 0 0 auto; width: 2.55rem; height: 1.45rem; }
.account-toggle input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.account-toggle-track { width: 100%; height: 100%; border-radius: 999px; background: #c6d4ca; transition: background-color 0.15s ease; }
.account-toggle-track::after { display: block; width: 1.05rem; height: 1.05rem; margin: 0.2rem; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(20, 40, 24, 0.2); content: ''; transition: transform 0.15s ease; }
.account-toggle input:checked + .account-toggle-track { background: #398145; }
.account-toggle input:checked + .account-toggle-track::after { transform: translateX(1.1rem); }
.account-toggle input:focus-visible + .account-toggle-track { outline: 3px solid rgba(63, 125, 32, 0.25); outline-offset: 2px; }
.account-form-actions { display: flex; justify-content: flex-end; gap: 0.55rem; padding: 0.1rem 0 0.2rem; }
.account-form-summary { display: flex; align-items: flex-start; gap: 0.65rem; }
.account-form-summary > i { margin-top: 0.15rem; }
.account-form-summary ul { margin: 0.45rem 0 0; padding-left: 1.1rem; font-size: 0.75rem; }
.account-form-summary li + li { margin-top: 0.2rem; }

@media (max-width: 1000px) {
  .accounts-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .accounts-filter-form { grid-template-columns: minmax(0, 1.5fr) repeat(2, minmax(9rem, 1fr)); }
  .accounts-filter-submit { grid-column: 1 / -1; }
  .accounts-role-guide { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
  .accounts-page, .account-form-page { gap: 0.8rem; }
  .accounts-header, .account-form-header { align-items: flex-start; }
  .accounts-header .page-actions, .account-form-header .page-actions { width: 100%; }
  .accounts-header .page-actions > *, .account-form-header .page-actions > * { width: 100%; justify-content: center; }
  .accounts-summary { gap: 0.6rem; }
  .account-stat { padding: 0.75rem; }
  .account-stat-icon { width: 2rem; height: 2rem; }
  .account-stat strong { font-size: 1.2rem; }
  .accounts-filter-card { padding: 0.9rem; }
  .accounts-filter-form { grid-template-columns: 1fr; }
  .accounts-filter-submit { grid-column: auto; width: 100%; }
  .account-audit-note { display: none; }
  .account-desktop-table { display: none; }
  .account-mobile-list { display: grid; gap: 0.65rem; padding: 0.9rem; border-top: 1px solid #e3ece5; }
  .account-mobile-card { display: grid; gap: 0.85rem; padding: 0.85rem; border: 1px solid #e0eae2; border-radius: 0.7rem; background: #fbfdfb; }
  .account-mobile-heading { display: flex; align-items: center; justify-content: space-between; gap: 0.6rem; }
  .account-mobile-details { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.6rem; margin: 0; }
  .account-mobile-details > div { display: grid; gap: 0.2rem; }
  .account-mobile-details dt { color: #718076; font-size: 0.65rem; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; }
  .account-mobile-details dd { margin: 0; color: #32483a; font-size: 0.75rem; }
  .account-mobile-card .account-actions > * { flex: 1 1 auto; }
  .account-pagination { align-items: flex-start; flex-direction: column; padding: 0.85rem 0.9rem; }
  .account-pagination nav { width: 100%; flex-wrap: wrap; }
  .accounts-role-guide { padding: 0.9rem; }
  .role-guide-grid { grid-template-columns: 1fr; }
  .account-form-section { padding: 1rem; }
  .account-form-grid { grid-template-columns: 1fr; gap: 0.8rem; }
  .account-form-actions { flex-direction: column-reverse; }
  .account-form-actions > * { width: 100%; justify-content: center; text-align: center; }
}


.signature-party-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.signature-party { padding: 1rem; border: 1px solid #dce8df; border-radius: 0.8rem; background: #ffffff; }
.signature-party.has-error { border-color: var(--danger); box-shadow: 0 0 0 3px rgba(180, 35, 24, 0.1); }
.signature-party-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 0.75rem; margin-bottom: 0.8rem; }
.signature-party-header h3 { margin: 0; color: var(--text); font-size: 0.95rem; }
.signature-party-header p { margin: 0.25rem 0 0; color: var(--text-muted); font-size: 0.75rem; }
.signature-party-badge { flex: 0 0 auto; padding: 0.25rem 0.5rem; border-radius: 999px; background: #edf6eb; color: var(--office-green); font-size: 0.68rem; font-weight: 800; text-transform: uppercase; letter-spacing: 0.04em; }
.signature-party-badge.owner { background: #fff4dc; color: #8a5a00; }
@media (max-width: 900px) {
  .signature-party-grid { grid-template-columns: 1fr; }
}
.signature-evidence-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.85rem; }
.signature-evidence { margin: 0; padding: 0.75rem; border: 1px solid #dce8df; border-radius: 0.65rem; background: #ffffff; }
.signature-evidence figcaption { margin-bottom: 0.5rem; color: var(--text-muted); font-size: 0.72rem; font-weight: 800; text-transform: uppercase; letter-spacing: 0.04em; }
.signature-evidence img { display: block; width: 100%; height: 6rem; object-fit: contain; border: 1px solid #e5ece7; border-radius: 0.4rem; background: #ffffff; }
@media (max-width: 700px) {
  .signature-evidence-grid { grid-template-columns: 1fr; }
}