/* Admin Layout */
#adminShell {
  display: flex; min-height: 100vh;
}

.sidebar {
  width: 240px; background: var(--color-dark-blue); color: var(--color-white);
  display: flex; flex-direction: column; position: fixed; top: 0; left: 0; bottom: 0;
  z-index: 50;
}
.sidebar-logo {
  font-family: 'Montserrat', sans-serif; font-size: 24px; font-weight: 700;
  padding: 24px; border-bottom: 1px solid rgba(255,255,255,0.1);
}
.sidebar-logo span { color: var(--color-teal); }
.sidebar-nav { flex: 1; padding: 16px 0; }
.sidebar-nav .nav-item {
  display: block; padding: 12px 24px; color: rgba(255,255,255,0.7);
  font-size: 14px; font-weight: 500; transition: all 0.2s; text-decoration: none;
}
.sidebar-nav .nav-item:hover { color: var(--color-white); background: rgba(255,255,255,0.05); text-decoration: none; }
.sidebar-nav .nav-item.active {
  color: var(--color-white); background: rgba(122,184,184,0.15);
  border-left: 3px solid var(--color-teal);
}
.sidebar-footer { padding: 16px 24px; border-top: 1px solid rgba(255,255,255,0.1); }

.admin-main {
  flex: 1; margin-left: 240px; background: var(--color-bg-cream); min-height: 100vh;
}
.admin-topbar {
  background: var(--color-white); padding: 20px 32px;
  border-bottom: 1px solid var(--color-border); position: sticky; top: 0; z-index: 40;
}
.admin-content { padding: 32px; }

/* Stat cards */
.stat-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 20px; margin-bottom: 32px; }
.stat-card {
  background: var(--color-white); border-radius: 8px; padding: 20px;
  box-shadow: var(--shadow); border-left: 4px solid var(--color-teal);
}
.stat-card.navy { border-left-color: var(--color-navy); }
.stat-card.success { border-left-color: var(--color-success); }
.stat-card.warning { border-left-color: var(--color-warning); }
.stat-card.danger { border-left-color: var(--color-danger); }
.stat-card .stat-value { font-family: 'Montserrat', sans-serif; font-size: 32px; font-weight: 700; color: var(--color-navy); }
.stat-card .stat-label { font-size: 13px; color: var(--color-text-secondary); margin-top: 4px; }

/* Data tables */
.data-table { width: 100%; border-collapse: collapse; background: var(--color-white); border-radius: 8px; overflow: hidden; box-shadow: var(--shadow); }
.data-table th {
  background: var(--color-bg-light-blue); padding: 12px 16px; text-align: left;
  font-size: 13px; font-weight: 600; color: var(--color-dark-blue); border-bottom: 1px solid var(--color-border);
}
.data-table td { padding: 12px 16px; font-size: 14px; border-bottom: 1px solid #f0f0f0; }
.data-table tr:hover td { background: var(--color-bg-beige); }
.data-table .actions { white-space: nowrap; }
.data-table .actions button { margin-right: 4px; }

/* Toolbar */
.toolbar {
  display: flex; justify-content: space-between; align-items: center; gap: 16px;
  margin-bottom: 20px; flex-wrap: wrap;
}
.toolbar .search-box {
  display: flex; gap: 8px; flex: 1; max-width: 400px;
}
.toolbar .search-box input {
  flex: 1; padding: 10px 16px; border: 1px solid var(--color-border);
  border-radius: var(--radius); font-size: 14px;
}
.toolbar .filters { display: flex; gap: 8px; }
.toolbar .filters select {
  padding: 10px 12px; border: 1px solid var(--color-border);
  border-radius: var(--radius); font-size: 14px; background: var(--color-white);
}

/* Pagination */
.pagination {
  display: flex; justify-content: center; align-items: center; gap: 8px; margin-top: 24px;
}
.pagination button {
  padding: 8px 16px; border: 1px solid var(--color-border); border-radius: var(--radius);
  background: var(--color-white); cursor: pointer; font-size: 14px;
}
.pagination button.active { background: var(--color-navy); color: var(--color-white); border-color: var(--color-navy); }
.pagination button:disabled { opacity: 0.5; cursor: not-allowed; }
.pagination .page-info { font-size: 14px; color: var(--color-text-secondary); }

/* Modal */
.modal { position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 200; display: flex; align-items: center; justify-content: center; }
.modal-backdrop { position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0,0,0,0.5); }
.modal-content {
  position: relative; background: var(--color-white); border-radius: 8px;
  padding: 32px; width: 90%; max-width: 600px; max-height: 80vh; overflow-y: auto;
  box-shadow: 0 20px 60px rgba(0,0,0,0.2);
}

/* Detail view */
.detail-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-bottom: 24px; }
.detail-item { padding: 12px; background: var(--color-bg-beige); border-radius: var(--radius); }
.detail-item .label { font-size: 12px; color: var(--color-text-secondary); margin-bottom: 4px; }
.detail-item .value { font-size: 15px; font-weight: 500; }

/* Notes */
.notes-list { margin-top: 24px; }
.note-item {
  padding: 16px; border-left: 3px solid var(--color-teal);
  background: var(--color-bg-light-blue); border-radius: 0 var(--radius) var(--radius) 0; margin-bottom: 12px;
}
.note-item .note-meta { font-size: 12px; color: var(--color-text-secondary); margin-bottom: 6px; }
.note-item .note-text { font-size: 14px; }

/* Invite form */
.invite-form { background: var(--color-white); padding: 24px; border-radius: 8px; box-shadow: var(--shadow); margin-bottom: 24px; }

@media (max-width: 768px) {
  .sidebar { width: 60px; }
  .sidebar-logo, .sidebar-nav .nav-item span, .sidebar-footer { display: none; }
  .admin-main { margin-left: 60px; }
  .stat-grid { grid-template-columns: 1fr 1fr; }
  .detail-grid { grid-template-columns: 1fr; }
}