/* Neubrutal Admin Theme CSS */
:root {
  --background: #F4F4F9;
  --border: #000000;
  --text: #000000;
  --text-secondary: #555555;
  --white: #FFFFFF;
  --shadow: #000000;
  
  /* Neubrutal Palettes */
  --primary: #FF5A5F;
  --primary-hover: #E04E52;
  --pastel-yellow: #FFF275;
  --pastel-blue: #A3CEF1;
  --pastel-green: #90BE6D;
  --pastel-peach: #F8AD9D;
  --pastel-purple: #C8B6FF;
  --danger: #E63946;
  --neutral: #E5E5EA;
}

* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  font-family: 'Inter', 'Outfit', sans-serif;
  letter-spacing: -0.3px;
}

body {
  background-color: var(--background);
  color: var(--text);
  overflow-x: hidden;
  padding-bottom: 40px;
}

/* Common Styles */
.hide {
  display: none !important;
}

.neo-card {
  background-color: var(--white);
  border: 3px solid var(--border);
  border-radius: 16px;
  box-shadow: 6px 6px 0px var(--shadow);
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.neo-card:hover {
  transform: translate(-2px, -2px);
  box-shadow: 8px 8px 0px var(--shadow);
}

.neo-btn {
  font-family: 'Outfit', sans-serif;
  font-weight: 900;
  font-size: 14px;
  padding: 12px 20px;
  border: 2px solid var(--border);
  border-radius: 10px;
  cursor: pointer;
  background-color: var(--white);
  box-shadow: 3px 3px 0px var(--shadow);
  transition: all 0.1s ease;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.neo-btn:active {
  transform: translate(2px, 2px);
  box-shadow: 1px 1px 0px var(--shadow);
}

.primary-btn {
  background-color: var(--pastel-yellow);
}

.primary-btn:hover {
  background-color: #FFE600;
}

.danger-btn {
  background-color: var(--pastel-peach);
  color: var(--text);
}

.danger-btn:hover {
  background-color: var(--danger);
  color: var(--white);
}

.neutral-btn {
  background-color: var(--neutral);
}

.neutral-btn:hover {
  background-color: #D1D1D6;
}

.sm-btn {
  padding: 6px 12px;
  font-size: 12px;
  border-radius: 8px;
  box-shadow: 2px 2px 0px var(--shadow);
}

.sm-btn:active {
  transform: translate(1px, 1px);
  box-shadow: 1px 1px 0px var(--shadow);
}

.btn-block {
  width: 100%;
  justify-content: center;
}

/* 1. Auth / Login CSS */
.auth-section {
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 100vh;
  padding: 20px;
}

.auth-card {
  width: 100%;
  max-width: 400px;
  padding: 32px 24px;
  background-color: var(--white);
}

.auth-header {
  text-align: center;
  margin-bottom: 28px;
}

.logo-icon {
  font-size: 44px;
  color: var(--primary);
  margin-bottom: 12px;
  transform: rotate(-5deg);
  display: inline-block;
  background: var(--pastel-yellow);
  padding: 12px;
  border: 2px solid var(--border);
  border-radius: 12px;
  box-shadow: 3px 3px 0px var(--shadow);
}

.auth-header h1 {
  font-family: 'Outfit', sans-serif;
  font-weight: 900;
  font-size: 28px;
  letter-spacing: 0.5px;
}

.auth-header p {
  color: var(--text-secondary);
  font-size: 13px;
  font-weight: 600;
  margin-top: 4px;
}

.input-group {
  margin-bottom: 20px;
}

.input-group label {
  display: block;
  font-weight: 900;
  font-size: 13px;
  margin-bottom: 8px;
}

.input-wrapper {
  position: relative;
  display: flex;
  align-items: center;
}

.input-wrapper i {
  position: absolute;
  left: 14px;
  color: var(--text-secondary);
  font-size: 15px;
}

.input-wrapper input, .input-group textarea {
  width: 100%;
  padding: 12px 14px 12px 42px;
  border: 2px solid var(--border);
  border-radius: 10px;
  font-size: 14px;
  font-weight: 600;
  outline: none;
  background-color: #F8F9FA;
  transition: border-color 0.15s ease;
}

.input-group textarea {
  padding: 12px;
}

.input-wrapper input:focus, .input-group textarea:focus {
  border-color: var(--primary);
  background-color: var(--white);
}

.error-msg {
  background-color: var(--pastel-peach);
  border: 2px solid var(--border);
  border-radius: 10px;
  color: var(--text);
  padding: 10px;
  font-size: 12px;
  font-weight: 900;
  margin-top: 16px;
  text-align: center;
}

/* 2. Dashboard Layout */
.neo-navbar {
  background-color: var(--white);
  border-bottom: 3px solid var(--border);
  padding: 16px 24px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: sticky;
  top: 0;
  z-index: 10;
}

.nav-brand {
  display: flex;
  align-items: center;
  gap: 10px;
}

.nav-brand i {
  background-color: var(--pastel-yellow);
  padding: 8px;
  border: 2px solid var(--border);
  border-radius: 8px;
  font-size: 16px;
}

.nav-brand span {
  font-family: 'Outfit', sans-serif;
  font-weight: 900;
  font-size: 18px;
}

.nav-user {
  display: flex;
  align-items: center;
  gap: 16px;
}

.nav-user span {
  font-size: 13px;
  font-weight: 800;
  color: var(--text-secondary);
}

.dashboard-content {
  max-width: 1200px;
  margin: 32px auto;
  padding: 0 20px;
}

/* Stats Cards Grid */
.stats-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 20px;
  margin-bottom: 32px;
}

.stat-card {
  padding: 24px;
  display: flex;
  align-items: center;
  gap: 20px;
}

.stat-card:hover {
  transform: none; /* No hover lift for stat cards to keep layout solid */
}

.stat-icon {
  width: 56px;
  height: 56px;
  border: 2px solid var(--border);
  border-radius: 12px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 24px;
  background-color: var(--white);
  box-shadow: 3px 3px 0px var(--shadow);
}

.stat-info h3 {
  font-size: 13px;
  color: var(--text-secondary);
  font-weight: 800;
}

.stat-info p {
  font-size: 32px;
  font-weight: 900;
  font-family: 'Outfit', sans-serif;
  margin-top: 4px;
}

/* Stats Color Themes */
.pastel-blue { background-color: var(--pastel-blue); }
.pastel-green { background-color: var(--pastel-green); }
.pastel-peach { background-color: var(--pastel-peach); }
.pastel-purple { background-color: var(--pastel-purple); }

/* Tab Navigation CSS */
.tab-container {
  background-color: var(--white);
  border: 3px solid var(--border);
  border-radius: 16px;
  box-shadow: 6px 6px 0px var(--shadow);
  padding: 24px;
  overflow: hidden;
}

.tab-menu {
  display: flex;
  gap: 12px;
  border-bottom: 2px solid var(--border);
  padding-bottom: 12px;
  margin-bottom: 20px;
  flex-wrap: wrap;
}

.tab-btn {
  background: none;
  border: none;
  font-family: 'Outfit', sans-serif;
  font-weight: 900;
  font-size: 15px;
  padding: 8px 16px;
  cursor: pointer;
  border-radius: 8px;
  color: var(--text-secondary);
  transition: all 0.15s ease;
  display: flex;
  align-items: center;
  gap: 8px;
}

.tab-btn:hover {
  color: var(--text);
  background-color: var(--background);
}

.tab-btn.active {
  color: var(--text);
  background-color: var(--pastel-yellow);
  border: 2px solid var(--border);
  box-shadow: 2px 2px 0px var(--shadow);
}

.badge {
  background-color: var(--primary);
  color: var(--white);
  font-size: 11px;
  font-weight: 900;
  padding: 2px 6px;
  border-radius: 20px;
  border: 1px solid var(--border);
}

.tab-content {
  display: none;
}

.tab-content.active {
  display: block;
}

/* Tables CSS */
.table-container {
  width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.neo-table {
  width: 100%;
  min-width: 1300px;
  border-collapse: collapse;
  text-align: left;
  border: 2.5px solid var(--border);
  background-color: var(--white);
  border-radius: 12px;
  overflow: hidden;
}

.neo-table th {
  background-color: #F8F9FA;
  border-bottom: 2px solid var(--border);
  font-weight: 900;
  font-size: 13px;
  padding: 12px 14px;
  color: var(--text-secondary);
  text-transform: uppercase;
  white-space: nowrap;
  vertical-align: middle;
}

.neo-table td {
  padding: 12px 14px;
  font-size: 13px;
  font-weight: 600;
  border-bottom: 1.5px solid #E5E5EA;
  vertical-align: middle;
}

.neo-table tbody tr:last-child td {
  border-bottom: none;
}

.neo-table tbody tr:hover {
  background-color: #FCFDFD;
}

.empty-row td {
  text-align: center;
  padding: 40px !important;
  color: var(--text-secondary);
  font-weight: 800;
  font-size: 15px;
}

/* User Info Styling inside table */
.user-info {
  display: flex;
  flex-direction: column;
  gap: 3px;
  min-width: 170px;
  max-width: 220px;
}

.user-info strong, .user-name {
  font-size: 13px;
  font-weight: 800;
  color: #111111;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.user-email {
  font-size: 12px;
  color: #444444;
  font-weight: 600;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.user-uid {
  font-size: 11px;
  font-family: monospace;
  color: #777777;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.date-cell {
  white-space: nowrap;
  font-size: 12px;
  line-height: 1.4;
  color: #222222;
}

.balance-cell {
  display: flex;
  flex-direction: column;
  gap: 2px;
  white-space: nowrap;
  font-size: 12px;
  font-weight: 800;
}

.phone-badge {
  font-family: 'Outfit', sans-serif;
  font-weight: 800;
  background-color: var(--neutral);
  padding: 5px 9px;
  border: 1.5px solid var(--border);
  border-radius: 6px;
  display: inline-flex;
  align-items: center;
  white-space: nowrap;
  font-size: 12px;
}

.item-badge {
  font-weight: 800;
  background-color: var(--pastel-purple);
  padding: 4px 8px;
  border: 1px solid var(--border);
  border-radius: 6px;
  display: inline-block;
  white-space: nowrap;
}

.status-badge {
  font-weight: 900;
  padding: 5px 9px;
  border: 1.5px solid var(--border);
  border-radius: 6px;
  display: inline-flex;
  align-items: center;
  font-size: 11px;
  white-space: nowrap;
}

.status-completed { background-color: var(--pastel-green); }
.status-rejected { background-color: var(--pastel-peach); }

.action-buttons {
  display: flex;
  gap: 6px;
  align-items: center;
  white-space: nowrap;
  flex-wrap: nowrap;
}

.action-buttons .neo-btn {
  white-space: nowrap;
  flex-shrink: 0;
}

/* Modal UI CSS */
.modal-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.6);
  z-index: 100;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 20px;
}

.modal-box {
  width: 100%;
  max-width: 440px;
  background-color: var(--white);
  padding: 28px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.modal-box h2 {
  font-family: 'Outfit', sans-serif;
  font-weight: 900;
  font-size: 20px;
}

.modal-box p {
  font-size: 13px;
  color: var(--text-secondary);
  font-weight: 600;
  line-height: 1.5;
}

.modal-buttons {
  display: flex;
  justify-content: flex-end;
  gap: 12px;
  margin-top: 8px;
}

.modal-buttons .neo-btn {
  flex: 1;
  justify-content: center;
}

/* Responsive Queries */
@media (max-width: 768px) {
  .neo-navbar {
    flex-direction: column;
    gap: 12px;
    padding: 16px;
  }
  
  .nav-user {
    width: 100%;
    justify-content: space-between;
  }
  
  .stats-grid {
    grid-template-columns: 1fr;
  }
  
  .action-buttons {
    flex-direction: column;
  }
  
  .neo-btn {
    width: 100%;
    justify-content: center;
  }
}

/* New badges and UI components for Inquiries & Reports */
.category-badge {
  font-weight: 800;
  background-color: var(--pastel-blue);
  padding: 4px 8px;
  border: 1px solid var(--border);
  border-radius: 6px;
  display: inline-block;
  font-size: 11px;
}

.reason-badge {
  font-weight: 800;
  background-color: var(--pastel-peach);
  padding: 4px 8px;
  border: 1px solid var(--border);
  border-radius: 6px;
  display: inline-block;
  font-size: 11px;
}

.msg-content {
  max-width: 400px;
  white-space: pre-wrap;
  word-break: break-all;
  background-color: #F8F9FA;
  border: 1.5px solid var(--border);
  border-radius: 8px;
  padding: 8px 12px;
  font-size: 12px;
  line-height: 1.4;
  color: var(--text);
}

.danger-badge {
  background-color: var(--primary) !important;
  color: var(--white) !important;
}

/* User Management Filter & Search Bar */
.users-control-bar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 16px;
  padding: 16px 20px;
  margin-bottom: 20px;
  background-color: var(--white);
}

.users-filter-group {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.filter-btn {
  background-color: #F0F0F5;
  color: #333333;
  opacity: 0.85;
}

.filter-btn.active {
  background-color: var(--pastel-yellow);
  color: var(--text);
  opacity: 1;
  border-width: 2.5px;
  box-shadow: 3px 3px 0px var(--shadow);
}

.filter-safe.active {
  background-color: var(--pastel-green) !important;
}

.filter-suspect.active {
  background-color: var(--pastel-peach) !important;
}

.users-search-wrapper {
  position: relative;
  display: flex;
  align-items: center;
  min-width: 280px;
}

.users-search-wrapper i {
  position: absolute;
  left: 12px;
  color: var(--text-secondary);
  font-size: 14px;
}

.users-search-wrapper input {
  width: 100%;
  padding: 10px 14px 10px 36px;
  border: 2px solid var(--border);
  border-radius: 10px;
  font-size: 13px;
  font-weight: 700;
  outline: none;
  background-color: #F8F9FA;
  box-shadow: 2px 2px 0px var(--shadow);
}

.users-search-wrapper input:focus {
  background-color: var(--white);
  border-color: var(--primary);
}

/* Trust Status Badges */
.badge-genuine {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background-color: #D8F3DC;
  color: #1B4332;
  font-weight: 900;
  font-size: 12px;
  padding: 5px 10px;
  border: 2px solid #2D6A4F;
  border-radius: 8px;
  box-shadow: 2px 2px 0px #2D6A4F;
  white-space: nowrap;
}

.badge-suspect {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background-color: #FFDDD2;
  color: #800F2F;
  font-weight: 900;
  font-size: 12px;
  padding: 5px 10px;
  border: 2px solid #A4161A;
  border-radius: 8px;
  box-shadow: 2px 2px 0px #A4161A;
  white-space: nowrap;
}

/* Signal Tags (Device, Photo, Instagram, Activity) */
.signals-wrap {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  max-width: 220px;
}

.signal-tag {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 11px;
  font-weight: 800;
  padding: 3px 6px;
  border: 1px solid var(--border);
  border-radius: 6px;
  background-color: #E9ECEF;
  color: #333333;
}

.signal-tag.tag-push {
  background-color: #E0AAFF;
  border-color: #5A189A;
  color: #3C096C;
}

.signal-tag.tag-photo {
  background-color: #FFD166;
  border-color: #E2711D;
  color: #7A3E00;
}

.signal-tag.tag-insta {
  background-color: #FFC6FF;
  border-color: #B5179E;
  color: #7209B7;
}

.signal-tag.tag-activity {
  background-color: #B9FBC0;
  border-color: #2D6A4F;
  color: #1B4332;
}

.signal-tag.tag-none {
  background-color: #F8F9FA;
  border: 1px dashed #999999;
  color: #888888;
}

/* Protected Delete Button */
.neo-btn.btn-locked {
  background-color: #E5E5EA;
  color: #8E8E93;
  cursor: not-allowed;
  opacity: 0.7;
  border-color: #AEAEB2;
  box-shadow: none;
}

.neo-btn.btn-danger-active {
  background-color: var(--danger);
  color: var(--white);
}

.neo-btn.btn-danger-active:hover {
  background-color: #B71C1C;
}

/* Delete User Modal */
.delete-modal-box {
  max-width: 480px;
}

.modal-header-danger {
  display: flex;
  align-items: center;
  gap: 12px;
}

.modal-danger-icon {
  font-size: 28px;
  color: var(--danger);
}

.delete-warning-text {
  font-size: 13px;
  line-height: 1.5;
  color: #555555;
}

.delete-user-details {
  background-color: #FFF9F9;
  border: 2px solid var(--border);
  border-radius: 12px;
  padding: 14px 16px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  box-shadow: 3px 3px 0px var(--shadow);
}

.detail-row {
  display: flex;
  font-size: 13px;
  line-height: 1.4;
  align-items: flex-start;
  gap: 8px;
}

.detail-row strong {
  min-width: 90px;
  color: #222222;
}

.mono-text {
  font-family: monospace;
  font-size: 12px;
  background-color: #EEEEEE;
  padding: 2px 6px;
  border-radius: 4px;
}

.protection-box {
  background-color: #FFF3CD;
  border: 2px solid #856404;
  border-radius: 10px;
  padding: 12px;
  margin-top: 4px;
}

.protection-checkbox-label {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: 12px;
  line-height: 1.4;
  color: #856404;
  cursor: pointer;
}

.protection-checkbox-label input {
  margin-top: 3px;
  transform: scale(1.2);
  cursor: pointer;
}

/* User Avatar Thumbnail */
.user-avatar-thumb {
  width: 46px;
  height: 46px;
  border-radius: 10px;
  object-fit: cover;
  border: 2px solid var(--border);
  box-shadow: 2px 2px 0px var(--shadow);
  cursor: pointer;
  background-color: #EEEEEE;
  transition: transform 0.15s ease, box-shadow 0.15s ease;
  display: block;
}

.user-avatar-thumb:hover {
  transform: scale(1.1);
  box-shadow: 3px 3px 0px var(--shadow);
}

.user-avatar-placeholder {
  width: 46px;
  height: 46px;
  border-radius: 10px;
  background-color: #F1F3F5;
  border: 2px dashed #ADB5BD;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #ADB5BD;
  font-size: 18px;
}

/* Instagram Pill Link */
.instagram-pill-link {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  background: linear-gradient(45deg, #F09433 0%, #E6683C 25%, #DC2743 50%, #CC2366 75%, #BC1888 100%);
  color: #FFFFFF !important;
  font-size: 11px;
  font-weight: 900;
  padding: 4px 8px;
  border-radius: 6px;
  border: 1.5px solid var(--border);
  text-decoration: none;
  box-shadow: 2px 2px 0px var(--shadow);
  transition: all 0.1s ease;
  white-space: nowrap;
}

.instagram-pill-link:hover {
  transform: translate(-1px, -1px);
  box-shadow: 3px 3px 0px var(--shadow);
  filter: brightness(1.08);
}

.no-instagram-pill {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  background-color: #F8F9FA;
  color: #868E96;
  font-size: 11px;
  font-weight: 700;
  padding: 3px 6px;
  border-radius: 6px;
  border: 1px dashed #CED4DA;
  white-space: nowrap;
}

/* Photo Preview Modal */
.photo-modal-box {
  max-width: 480px;
  padding: 20px;
}

.photo-modal-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 14px;
}

.photo-modal-header h2 {
  font-size: 18px;
  font-weight: 900;
  display: flex;
  align-items: center;
  gap: 8px;
}

.photo-modal-body {
  width: 100%;
  max-height: 480px;
  border-radius: 12px;
  border: 2.5px solid var(--border);
  box-shadow: 4px 4px 0px var(--shadow);
  background-color: #111111;
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden;
}

.photo-modal-body img {
  width: 100%;
  height: auto;
  max-height: 460px;
  object-fit: contain;
  display: block;
}

.photo-modal-footer {
  margin-top: 14px;
  display: flex;
  justify-content: center;
}

/* Broken Instagram (contains spaces) UI */
.ig-broken-wrap {
  display: flex;
  flex-direction: column;
  gap: 4px;
  align-items: flex-start;
}

.ig-pill-warn {
  border: 1.5px solid #FF85A1 !important;
}

.ig-actions-row {
  display: flex;
  align-items: center;
  gap: 4px;
}

.ig-search-link {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  background-color: #E7F5FF;
  color: #1971C2 !important;
  font-size: 10px;
  font-weight: 800;
  padding: 2px 6px;
  border-radius: 4px;
  border: 1px solid #74C0FC;
  text-decoration: none;
  transition: all 0.1s ease;
  white-space: nowrap;
}

.ig-search-link:hover {
  background-color: #D0EBFF;
}

.ig-warn-hint {
  font-size: 10px;
  font-weight: 700;
  color: #D9480F;
  background-color: #FFF4E6;
  padding: 1px 4px;
  border-radius: 4px;
  white-space: nowrap;
}

/* Compact User Table Styles */
.compact-user-table {
  min-width: 900px;
  width: 100%;
}

.compact-user-table th, 
.compact-user-table td {
  padding: 10px 12px;
}

/* User Profile Cell (Unified & Space-Efficient) */
.profile-cell {
  display: flex;
  align-items: flex-start;
  gap: 12px;
}

.profile-avatar-wrap {
  flex-shrink: 0;
}

.profile-meta-wrap {
  display: flex;
  flex-direction: column;
  gap: 3px;
  min-width: 0;
  flex: 1;
}

.profile-name-row {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}

.type-mini-badge {
  font-size: 10px;
  font-weight: 800;
  padding: 1px 6px;
  border-radius: 4px;
  border: 1px solid var(--border);
  white-space: nowrap;
}

.type-kmale {
  background-color: #E3F2FD;
  color: #0D47A1;
}

.type-foreign {
  background-color: #FCE4EC;
  color: #880E4F;
}

.profile-email-text {
  font-size: 12px;
  font-weight: 600;
  color: #333333;
  word-break: break-all;
}

.profile-uid-text {
  font-size: 10px;
  font-family: monospace;
  color: #888888;
  word-break: break-all;
}

.profile-ig-wrap {
  margin-top: 3px;
}

/* Stacked Date */
.date-stacked {
  white-space: nowrap;
  line-height: 1.35;
}

.date-d {
  font-weight: 800;
  color: #222222;
  font-size: 12px;
}

.date-t {
  font-size: 11px;
  color: #777777;
  font-weight: 600;
}

/* Trust & Signals Cell */
.trust-cell {
  display: flex;
  flex-direction: column;
  gap: 6px;
  align-items: flex-start;
}

/* Balance & Status Cell */
.balance-status-cell {
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-size: 11px;
}

.balance-line {
  white-space: nowrap;
  color: #222222;
  font-weight: 700;
}

/* Checkbox styling */
.user-select-checkbox,
#select-all-checkbox {
  width: 18px;
  height: 18px;
  cursor: pointer;
  accent-color: var(--danger);
  vertical-align: middle;
}

.user-select-checkbox:disabled {
  cursor: not-allowed;
  opacity: 0.35;
}

/* Batch Delete Button */
#batch-delete-btn {
  background-color: var(--danger);
  color: #FFFFFF;
  border-color: #5C0000;
  box-shadow: 2px 2px 0px #5C0000;
  transition: all 0.15s ease;
  font-weight: 900;
}

#batch-delete-btn:hover {
  background-color: #B71C1C;
  transform: translate(-1px, -1px);
  box-shadow: 3px 3px 0px #5C0000;
}

/* Row Highlights */
.row-suspect {
  background-color: #FFFDFD;
}

.row-suspect:hover {
  background-color: #FFF2F2 !important;
}

.row-genuine {
  background-color: #FFFFFF;
}

.row-genuine:hover {
  background-color: #F4FAF5 !important;
}

.compact-actions {
  display: flex;
  align-items: center;
  gap: 4px;
  flex-wrap: nowrap;
}

/* Approval Status Badges */
.filter-pending.active {
  background-color: #FFE66D !important;
}

.badge-approval-pending {
  background-color: #FFF3CD;
  color: #856404;
  border: 1.5px solid #856404;
  font-size: 11px;
  font-weight: 900;
  padding: 3px 8px;
  border-radius: 6px;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  box-shadow: 1.5px 1.5px 0px #856404;
  white-space: nowrap;
}

.badge-approval-approved {
  background-color: #D8F3DC;
  color: #1B4332;
  border: 1.5px solid #2D6A4F;
  font-size: 11px;
  font-weight: 900;
  padding: 3px 8px;
  border-radius: 6px;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  box-shadow: 1.5px 1.5px 0px #2D6A4F;
  white-space: nowrap;
}

.badge-approval-rejected {
  background-color: #FFDDD2;
  color: #800F2F;
  border: 1.5px solid #A4161A;
  font-size: 11px;
  font-weight: 900;
  padding: 3px 8px;
  border-radius: 6px;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  box-shadow: 1.5px 1.5px 0px #A4161A;
  white-space: nowrap;
}

/* Approval Action Buttons */
.btn-approve {
  background-color: #52B788 !important;
  color: #FFFFFF !important;
  border-color: #1B4332 !important;
  box-shadow: 2px 2px 0px #1B4332 !important;
  font-weight: 900 !important;
}

.btn-approve:hover {
  background-color: #40916C !important;
  transform: translate(-1px, -1px);
}

.btn-reject {
  background-color: #E63946 !important;
  color: #FFFFFF !important;
  border-color: #5C0000 !important;
  box-shadow: 2px 2px 0px #5C0000 !important;
  font-weight: 900 !important;
}

.btn-reject:hover {
  background-color: #C1121F !important;
  transform: translate(-1px, -1px);
}