.nav-badge {
  float: right;
  background: #e5484d;
  color: #fff;
  border-radius: 999px;
  padding: 1px 7px;
  font-size: 11px;
}

.dashboard-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 16px;
}

.metric-card {
  padding: 20px;
}

.metric-card span {
  display: block;
  color: #667085;
  font-size: 13px;
}

.metric-card strong {
  display: block;
  font-size: 27px;
  margin-top: 8px;
}

.dashboard-panel {
  margin-top: 18px;
}

.dashboard-panel h2 {
  margin-top: 0;
}

.dashboard-drill {
  width: 100%;
  text-align: left;
  color: #182230;
}

.dashboard-drill small {
  color: var(--muted);
}

@media print {
  .sidebar,
  .topbar,
  #dashboardView .toolbar button,
  .dashboard-drill small,
  .dashboard-drill::after {
    display: none !important;
  }

  body,
  .app-shell,
  main {
    background: #fff !important;
    color: #111 !important;
  }

  #dashboardView {
    display: block !important;
  }

  #businessView:not(.hidden) {
    display: block !important;
  }

  #businessView:not(.hidden) th:last-child,
  #businessView:not(.hidden) td:last-child {
    display: none !important;
  }

  .card,
  .dashboard-drill {
    break-inside: avoid;
    box-shadow: none !important;
    border: 1px solid #bbb !important;
  }
}

.notification-list {
  display: grid;
  gap: 12px;
}

.notification-item {
  padding: 18px;
  display: grid;
  grid-template-columns: 10px 1fr auto;
  gap: 14px;
  align-items: center;
}

.notification-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #f0a020;
}

.notification-item.critical .notification-dot {
  background: #d92d20;
}

.notification-item.read {
  opacity: .6;
}

.notification-item h3,
.notification-item p {
  margin: 0;
}

.notification-item p {
  color: #667085;
  margin-top: 5px;
}

.notification-meta {
  font-size: 12px;
  color: #667085;
}

.file-button {
  display: inline-block;
  border-radius: 9px;
  background: #eef2f7;
  color: #344054;
  padding: 10px 16px;
  font-weight: 650;
  cursor: pointer;
}

.data-actions {
  align-items: end;
}
.pda-panel{max-width:520px;margin:0 auto}.pda-panel input,.pda-panel select,.pda-panel button{min-height:52px;font-size:1.05rem}
@media(max-width:720px){.pda-panel{max-width:none}.pda-panel button{width:100%}}
