/* ============================================
   ADMIN PANEL — Premium Responsive Design
   ============================================ */

/* --- Login Screen --- */
.admin-login {
  min-height:100vh; display:flex; align-items:center; justify-content:center;
  background: radial-gradient(ellipse 80% 60% at 50% 0%, rgba(0,100,220,0.18) 0%, transparent 70%), linear-gradient(135deg, #0a0f1e 0%, #0d1a35 40%, #091528 100%);
  padding:var(--space-4); position:relative; overflow:hidden;
}
.admin-login::before { content:''; position:absolute; width:600px; height:600px; background:radial-gradient(circle, rgba(37,99,235,0.12) 0%, transparent 70%); top:-200px; left:-100px; pointer-events:none; }
.admin-login::after { content:''; position:absolute; width:400px; height:400px; background:radial-gradient(circle, rgba(59,130,246,0.08) 0%, transparent 70%); bottom:-100px; right:-50px; pointer-events:none; }

.login-card {
  width:100%; max-width:440px; background:rgba(15,23,42,0.85); border:1px solid rgba(59,130,246,0.25);
  border-radius:20px; padding:48px 44px; text-align:center; backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px);
  box-shadow: 0 0 0 1px rgba(59,130,246,0.1), 0 25px 50px rgba(0,0,0,0.5), inset 0 1px 0 rgba(255,255,255,0.05);
  position:relative; z-index:1;
}
.login-card h2 { font-family:var(--font-primary); font-size:1.75rem; font-weight:700; margin-bottom:var(--space-2); color:#fff; }
.login-card p { font-size:var(--text-sm); color:rgba(148,163,184,0.85); margin-bottom:var(--space-8); }
.login-card .form-group { text-align:left; }
.login-card .form-group label { color:rgba(203,213,225,0.9); font-weight:500; margin-bottom:8px; display:block; }
.login-card input[type="text"], .login-card input[type="password"] {
  background:rgba(30,41,59,0.8); border:1px solid rgba(71,85,105,0.6); color:#f1f5f9;
  padding:12px 16px; border-radius:10px; width:100%; font-size:0.95rem; transition:border-color 0.2s, box-shadow 0.2s;
}
.login-card input:focus { outline:none; border-color:rgba(59,130,246,0.7); box-shadow:0 0 0 3px rgba(59,130,246,0.15); }
.login-card input::placeholder { color:rgba(100,116,139,0.7); }
.login-error { background:rgba(255,71,87,0.1); border:1px solid rgba(255,71,87,0.3); color:var(--color-danger); padding:var(--space-3) var(--space-4); border-radius:var(--radius-lg); font-size:var(--text-sm); margin-bottom:var(--space-4); }

/* --- Dashboard Layout --- */
.admin-dashboard { display:flex; min-height:100vh; background:var(--color-bg-primary); }

/* --- Sidebar --- */
.admin-sidebar {
  width:260px; background:var(--color-bg-secondary); border-right:1px solid var(--color-border);
  display:flex; flex-direction:column; flex-shrink:0; position:fixed; top:0; left:0; height:100vh; z-index:100;
  transition:transform 0.3s ease;
}
.sidebar-header { padding:var(--space-6); border-bottom:1px solid var(--color-border); display:flex; align-items:center; gap:var(--space-3); }
.sidebar-badge { padding:var(--space-1) var(--space-2); background:rgba(0,212,170,0.12); border:1px solid rgba(0,212,170,0.2); border-radius:var(--radius-sm); font-size:var(--text-xs); font-weight:600; color:var(--color-accent-primary); text-transform:uppercase; letter-spacing:1px; }
.sidebar-nav { flex:1; padding:var(--space-4); overflow-y:auto; }
.sidebar-link { display:flex; align-items:center; gap:var(--space-3); padding:var(--space-3) var(--space-4); border-radius:var(--radius-lg); font-size:var(--text-sm); font-weight:500; color:var(--color-text-secondary); transition:all var(--transition-base); margin-bottom:var(--space-1); }
.sidebar-link:hover { background:var(--color-bg-card); color:var(--color-text-primary); }
.sidebar-link.active { background:rgba(0,212,170,0.1); color:var(--color-accent-primary); border:1px solid rgba(0,212,170,0.15); }
.sidebar-footer { padding:var(--space-4) var(--space-6); border-top:1px solid var(--color-border); display:flex; align-items:center; justify-content:space-between; font-size:var(--text-sm); color:var(--color-text-tertiary); }

/* --- Main Content --- */
.admin-main { flex:1; display:flex; flex-direction:column; overflow-x:hidden; margin-left:260px; }
.admin-topbar { padding:var(--space-5) var(--space-8); border-bottom:none; display:flex; align-items:center; justify-content:space-between; background:#1E293B; color:#fff; position:sticky; top:0; z-index:10; box-shadow:0 4px 6px -1px rgba(0,0,0,0.1); gap:var(--space-4); }
.admin-topbar h1 { font-family:var(--font-primary); font-size:var(--text-xl); font-weight:700; color:#fff; white-space:nowrap; }
.admin-content { padding:var(--space-6) var(--space-8); flex:1; }

/* Hamburger */
.hamburger-btn { display:none; background:none; border:none; color:#fff; font-size:1.5rem; cursor:pointer; padding:var(--space-2); }
.sidebar-close { display:none; position:absolute; top:16px; right:16px; background:none; border:none; font-size:1.3rem; cursor:pointer; color:var(--color-text-secondary); }
.sidebar-backdrop { display:none; position:fixed; inset:0; background:rgba(0,0,0,0.5); z-index:99; }

/* --- Table --- */
.admin-table-wrapper { background:var(--color-bg-secondary); border:1px solid var(--color-border); border-radius:var(--radius-2xl); overflow:hidden; }
.admin-table { width:100%; border-collapse:collapse; }
.admin-table thead { background:var(--color-bg-tertiary); }
.admin-table th { padding:var(--space-3) var(--space-4); text-align:left; font-size:var(--text-xs); font-weight:700; color:var(--color-text-tertiary); text-transform:uppercase; letter-spacing:1px; border-bottom:1px solid var(--color-border); }
.admin-table td { padding:var(--space-3) var(--space-4); border-bottom:1px solid var(--color-border); font-size:var(--text-sm); color:var(--color-text-secondary); vertical-align:middle; }
.admin-table tr:hover td { background:rgba(255,255,255,0.02); }
.admin-table tr:last-child td { border-bottom:none; }
.table-car-img { width:80px; height:50px; object-fit:cover; border-radius:var(--radius-md); border:1px solid var(--color-border); }
.table-actions { display:flex; gap:var(--space-2); flex-wrap:wrap; }
.btn-icon { width:36px; height:36px; border:1px solid var(--color-border); border-radius:var(--radius-lg); background:var(--color-bg-card); display:flex; align-items:center; justify-content:center; font-size:var(--text-sm); cursor:pointer; transition:all var(--transition-base); }
.btn-icon.btn-edit:hover { border-color:var(--color-accent-primary); background:rgba(0,212,170,0.08); }
.btn-icon.btn-delete:hover { border-color:var(--color-danger); background:rgba(255,71,87,0.08); }
.featured-badge { padding:var(--space-1) var(--space-2); background:rgba(0,212,170,0.1); border-radius:var(--radius-sm); font-size:var(--text-xs); color:var(--color-accent-primary); font-weight:600; }

/* --- Admin Modal --- */
.admin-modal { max-width:700px !important; max-height:90vh; overflow-y:auto; }
.admin-modal::-webkit-scrollbar { width:6px; }
.admin-modal::-webkit-scrollbar-track { background:transparent; }
.admin-modal::-webkit-scrollbar-thumb { background:var(--color-border); border-radius:var(--radius-full); }

/* --- Image Upload --- */
.image-upload-area { border:2px dashed var(--color-border); border-radius:var(--radius-xl); padding:var(--space-6); text-align:center; transition:all var(--transition-base); }
.image-upload-area:hover { border-color:var(--color-accent-primary); background:rgba(0,212,170,0.03); }

/* --- Stat Cards --- */
.stat-card { background:var(--color-bg-secondary); border:1px solid var(--color-border); border-radius:var(--radius-xl); padding:var(--space-5); text-align:center; }
.stat-value { font-family:var(--font-primary); font-size:var(--text-3xl); font-weight:800; color:var(--color-accent-primary); }
.stat-label { font-size:var(--text-sm); color:var(--color-text-tertiary); margin-top:var(--space-1); }

/* --- Lead Status Badges --- */
.lead-status { display:inline-block; padding:var(--space-1) var(--space-2); border-radius:var(--radius-sm); font-size:var(--text-xs); font-weight:600; }
.status-new { background:rgba(245,158,11,0.15); color:#f59e0b; border:1px solid rgba(245,158,11,0.3); }
.status-contacted { background:rgba(59,130,246,0.15); color:#3b82f6; border:1px solid rgba(59,130,246,0.3); }
.status-done { background:rgba(34,197,94,0.15); color:#22c55e; border:1px solid rgba(34,197,94,0.3); }

/* --- Form Card (Settings) --- */
.form-card { background:var(--color-bg-secondary); padding:30px; border-radius:16px; border:1px solid var(--color-border); max-width:800px; margin:0 auto; }
.form-card h2 { margin-bottom:24px; color:var(--color-text-primary); border-bottom:2px solid var(--color-border); padding-bottom:15px; font-size:1.2rem; }
.form-card .form-group label { font-weight:600; color:var(--color-text-primary); }
.form-card input, .form-card textarea, .form-card select { border-radius:8px !important; border:1px solid var(--color-border) !important; padding:12px !important; width:100%; background:var(--color-bg-primary); color:var(--color-text-primary); }
.form-card input:focus, .form-card textarea:focus { border-color:var(--color-accent-primary) !important; outline:none; }

/* --- Gallery Grid --- */
.gallery-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(200px, 1fr)); gap:var(--space-4); }
.gallery-item { position:relative; border-radius:var(--radius-xl); overflow:hidden; border:1px solid var(--color-border); background:var(--color-bg-secondary); }
.gallery-item img { width:100%; height:160px; object-fit:cover; }
.gallery-item-info { padding:var(--space-3); }
.gallery-item-info p { font-size:var(--text-xs); color:var(--color-text-secondary); margin:2px 0; }
.gallery-item-actions { position:absolute; top:8px; right:8px; display:flex; gap:4px; }
.gallery-item-actions button { width:28px; height:28px; border-radius:50%; border:none; cursor:pointer; font-size:12px; display:flex; align-items:center; justify-content:center; }

/* --- Review Card Grid --- */
.review-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(300px, 1fr)); gap:var(--space-4); }
.review-card { background:var(--color-bg-secondary); border:1px solid var(--color-border); border-radius:var(--radius-xl); padding:var(--space-5); position:relative; }
.review-card-header { display:flex; align-items:center; gap:var(--space-3); margin-bottom:var(--space-3); }
.review-card-avatar { width:44px; height:44px; border-radius:50%; object-fit:cover; border:2px solid var(--color-border); }
.review-card-name { font-weight:700; color:var(--color-text-primary); font-size:var(--text-sm); }
.review-card-model { font-size:var(--text-xs); color:var(--color-text-tertiary); }
.review-card-stars { color:#f59e0b; font-size:14px; margin-bottom:var(--space-2); }
.review-card-content { font-size:var(--text-sm); color:var(--color-text-secondary); line-height:1.6; }
.review-card-actions { position:absolute; top:12px; right:12px; display:flex; gap:4px; }
.visibility-badge { font-size:var(--text-xs); padding:2px 8px; border-radius:var(--radius-sm); font-weight:600; }
.visibility-badge.visible { background:rgba(34,197,94,0.15); color:#22c55e; }
.visibility-badge.hidden { background:rgba(239,68,68,0.15); color:#ef4444; }

/* --- Avatar Upload --- */
.avatar-upload { display:flex; align-items:center; gap:var(--space-5); padding:var(--space-4) 0; }
.avatar-preview { width:80px; height:80px; border-radius:50%; object-fit:cover; border:3px solid var(--color-border); background:var(--color-bg-tertiary); }

/* Navbar logo */
.navbar-logo-img { height:36px; transition:transform var(--transition-spring); }
.navbar-logo-img:hover { transform:scale(1.05); }

/* --- RESPONSIVE --- */
@media (max-width: 768px) {
  .admin-sidebar { transform:translateX(-100%); width:280px; }
  .admin-sidebar.open { transform:translateX(0); }
  .sidebar-close { display:block; }
  .sidebar-backdrop.active { display:block; }
  .hamburger-btn { display:block; }
  .admin-main { margin-left:0; }
  .admin-topbar { padding:var(--space-3) var(--space-4); }
  .admin-topbar h1 { font-size:var(--text-base); }
  .admin-content { padding:var(--space-4); }
  .admin-modal { max-width:95% !important; padding:var(--space-5) !important; }
  .admin-modal form > div:first-child { grid-template-columns:1fr !important; }
  #leadsStats { grid-template-columns:repeat(2,1fr) !important; }
  .stat-value { font-size:var(--text-2xl); }
  .admin-table-wrapper { overflow-x:auto; -webkit-overflow-scrolling:touch; }
  .gallery-grid { grid-template-columns:repeat(auto-fill, minmax(140px, 1fr)); }
  .review-grid { grid-template-columns:1fr; }
  .form-card { padding:20px; }
  .avatar-upload { flex-direction:column; text-align:center; }
}