/* ==========================================================================
   Admin shell: fixed sidebar + topbar, regtech-dashboard-style layout
   (the Vanta/Drata/Secureframe pattern this was modeled on).
   ========================================================================== */
body.admin-body { background: var(--bg-app); }

.admin-shell { display: flex; min-height: 100vh; }

.admin-sidebar {
  width: var(--sidebar-width); flex-shrink: 0; background: var(--navy-900); color: var(--white);
  display: flex; flex-direction: column; padding: var(--space-6) var(--space-4);
  position: sticky; top: 0; height: 100vh;
}
.admin-sidebar .brand { color: var(--white); margin-bottom: var(--space-8); padding: 0 var(--space-2); }
.admin-sidebar .brand-name { color: var(--white); }
.admin-sidebar .brand-tag { color: rgba(255,255,255,0.55); }
.admin-sidebar .brand-mark { background: var(--accent); }

.admin-nav { display: flex; flex-direction: column; gap: 2px; flex: 1; }
.admin-nav-item {
  display: flex; align-items: center; gap: var(--space-3);
  padding: 10px var(--space-3); border-radius: var(--radius-sm);
  color: rgba(255,255,255,0.72); font-size: var(--text-sm); font-weight: 600;
  cursor: pointer; text-decoration: none; transition: background var(--duration-fast) var(--ease);
}
.admin-nav-item svg { width: 18px; height: 18px; flex-shrink: 0; }
.admin-nav-item:hover { background: rgba(255,255,255,0.06); color: var(--white); text-decoration: none; }
.admin-nav-item.active { background: rgba(20,184,166,0.16); color: var(--accent-400); }

.admin-sidebar-footer { padding-top: var(--space-5); border-top: 1px solid rgba(255,255,255,0.1); }
.admin-user { display: flex; align-items: center; gap: var(--space-3); padding: var(--space-2); }
.admin-user-avatar {
  width: 32px; height: 32px; border-radius: 50%; background: var(--accent); color: var(--navy-900);
  display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: var(--text-sm); flex-shrink: 0;
}
.admin-user-email { font-size: 12px; color: rgba(255,255,255,0.6); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.admin-logout {
  width: 100%; margin-top: var(--space-3); background: transparent; border: 1px solid rgba(255,255,255,0.16);
  color: rgba(255,255,255,0.8); padding: 8px; border-radius: var(--radius-sm); font-size: var(--text-xs); cursor: pointer;
}
.admin-logout:hover { background: rgba(255,255,255,0.08); }

.admin-main { flex: 1; min-width: 0; }
.admin-topbar {
  height: var(--topbar-height); background: var(--white); border-bottom: 1px solid var(--border);
  display: flex; align-items: center; justify-content: space-between; padding: 0 var(--space-8);
  position: sticky; top: 0; z-index: 20;
}
.admin-topbar h1 { font-size: 19px; }
.admin-content { max-width: 1240px; margin: 0 auto; padding: var(--space-7) var(--space-8) var(--space-12); }

/* Stat cards row */
.admin-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--space-4); margin-bottom: var(--space-7); }
@media (max-width: 900px) { .admin-stats { grid-template-columns: 1fr 1fr; } }
.admin-stat-card { background: var(--white); border: 1px solid var(--border); border-radius: var(--radius-md); padding: var(--space-5); }
.admin-stat-card .icon-badge {
  width: 34px; height: 34px; border-radius: 9px; background: var(--accent-100); color: var(--accent-900);
  display: flex; align-items: center; justify-content: center; margin-bottom: var(--space-3);
}
.admin-stat-card .icon-badge svg { width: 17px; height: 17px; }
.admin-stat-card .value { font-size: 26px; font-weight: 800; color: var(--navy-800); }
.admin-stat-card .label { font-size: var(--text-xs); color: var(--grey-500); margin-top: 2px; }

/* Filters row */
.admin-filters { display: flex; align-items: center; gap: var(--space-3); margin-bottom: var(--space-4); flex-wrap: wrap; }
.admin-search { position: relative; flex: 1; min-width: 220px; }
.admin-search svg { position: absolute; left: 14px; top: 50%; transform: translateY(-50%); width: 16px; height: 16px; color: var(--grey-400); }
.admin-search input { padding-left: 40px; }
.filter-chip {
  padding: 7px 14px; border-radius: var(--radius-full); border: 1.5px solid var(--grey-200); background: var(--white);
  font-size: var(--text-xs); font-weight: 600; color: var(--grey-600); cursor: pointer;
}
.filter-chip.active { border-color: var(--accent); background: var(--accent-100); color: var(--accent-900); }

/* Detail drawer/panel */
.detail-grid { display: grid; grid-template-columns: 1.4fr 1fr; gap: var(--space-6); align-items: start; }
@media (max-width: 980px) { .detail-grid { grid-template-columns: 1fr; } }
.kv-list { display: flex; flex-direction: column; }
.kv-row { display: flex; justify-content: space-between; gap: var(--space-4); padding: 10px 0; border-bottom: 1px solid var(--grey-100); font-size: var(--text-sm); }
.kv-row:last-child { border-bottom: none; }
.kv-row .k { color: var(--grey-500); }
.kv-row .v { color: var(--navy-800); font-weight: 600; text-align: right; }

.finding-row { border-bottom: 1px solid var(--grey-100); padding: var(--space-3) 0; }
.finding-row:last-child { border-bottom: none; }
.finding-top { display: flex; align-items: center; gap: var(--space-2); margin-bottom: 4px; flex-wrap: wrap; }
.finding-cat { font-weight: 700; font-size: var(--text-sm); color: var(--navy-800); }
.finding-desc { font-size: var(--text-sm); color: var(--grey-600); line-height: 1.5; }
.finding-cite { font-size: 11px; color: var(--grey-400); margin-top: 3px; font-style: italic; }
.finding-amount { font-weight: 700; color: var(--danger); font-size: var(--text-sm); margin-left: auto; }

/* Login page */
.login-shell { min-height: 100vh; display: flex; align-items: center; justify-content: center; background: var(--navy-900); padding: var(--space-6); }
.login-card { width: 100%; max-width: 400px; background: var(--white); border-radius: var(--radius-lg); padding: var(--space-8); box-shadow: var(--shadow-lg); }
.login-card .brand { margin-bottom: var(--space-6); justify-content: center; }
.login-card h1 { font-size: var(--text-lg); text-align: center; margin-bottom: var(--space-1); }
.login-card .lede { text-align: center; color: var(--grey-500); font-size: var(--text-sm); margin-bottom: var(--space-6); }

.breadcrumb-link { display: inline-flex; align-items: center; gap: 6px; font-size: var(--text-sm); color: var(--grey-600); margin-bottom: var(--space-4); cursor: pointer; }
.breadcrumb-link:hover { color: var(--navy-800); }
.breadcrumb-link svg { width: 14px; height: 14px; }