/* ── ADMIN PANEL STYLES ── */
:root {
  --bg:#06060f; --bg2:#0a0a1a; --bg3:#0f0f24; --bg4:#14142b;
  --purple:#7c3aed; --purple-dim:rgba(124,58,237,0.15); --purple-glow:rgba(124,58,237,0.3);
  --text:#f0f0ff; --text2:rgba(240,240,255,0.65); --text3:rgba(240,240,255,0.35);
  --border:rgba(124,58,237,0.18); --danger:#f87171; --success:#34d399;
  --font:'Space Grotesk',sans-serif; --display:'Outfit',sans-serif;
}
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box;}
body{font-family:var(--font);background:var(--bg);color:var(--text);min-height:100vh;}
.accent{background:linear-gradient(135deg,#7c3aed,#4f46e5,#22d3ee);-webkit-background-clip:text;-webkit-text-fill-color:transparent;}

/* Login */
.admin-login{min-height:100vh;display:flex;align-items:center;justify-content:center;background:radial-gradient(ellipse at center,var(--bg3),var(--bg));padding:20px;}
.admin-login-card{width:380px;max-width:100%;padding:48px 40px;background:var(--bg2);border:1px solid var(--border);border-radius:20px;text-align:center;}
.admin-logo{margin-bottom:32px;}
.logo-diamond{width:48px;height:48px;margin:0 auto 16px;background:linear-gradient(135deg,#7c3aed,#4f46e5);clip-path:polygon(50% 0%,100% 50%,50% 100%,0% 50%);animation:spin 8s linear infinite;}
.logo-diamond.small{width:28px;height:28px;margin:0;}
@keyframes spin{to{transform:rotate(360deg);}}
.admin-logo h1{font-family:var(--display);font-size:1.5rem;letter-spacing:3px;font-weight:700;}
.admin-logo p{color:var(--text3);font-size:.85rem;margin-top:4px;}

/* Forms */
.form-group{margin-bottom:16px;text-align:left;}
.form-group label{display:block;font-size:.8rem;color:var(--text2);margin-bottom:6px;font-weight:500;}
.form-group input,.form-group textarea,.form-group select{
  width:100%;padding:10px 14px;background:var(--bg3);border:1px solid var(--border);
  border-radius:8px;color:var(--text);font-family:var(--font);font-size:.9rem;outline:none;transition:.2s;
}
.form-group input:focus,.form-group textarea:focus,.form-group select:focus{border-color:var(--purple);box-shadow:0 0 0 3px var(--purple-dim);}
.form-group textarea{resize:vertical;}
.form-group select{cursor:pointer;}
.form-group input[type="file"]{padding:8px;font-size:.82rem;}
.form-row{display:flex;gap:16px;margin-bottom:16px;}
.form-row .form-group{flex:1;margin-bottom:0;}
.checkbox-label{display:flex;align-items:center;gap:8px;font-size:.9rem;cursor:pointer;color:var(--text2);}
.checkbox-label input{width:auto;accent-color:var(--purple);}
.form-actions{display:flex;gap:12px;margin-top:20px;}
.error-msg{margin-top:12px;padding:10px;border-radius:8px;background:rgba(239,68,68,0.1);border:1px solid rgba(239,68,68,0.2);color:var(--danger);font-size:.82rem;display:none;}
.error-msg.visible{display:block;}

/* Buttons */
.btn-primary{
  padding:10px 24px;background:linear-gradient(135deg,#7c3aed,#4f46e5);
  color:#fff;border:none;border-radius:8px;font-family:var(--font);
  font-size:.85rem;font-weight:600;cursor:pointer;transition:.2s;
}
.btn-primary:hover{transform:translateY(-1px);box-shadow:0 0 20px var(--purple-glow);}
.btn-secondary{
  padding:10px 24px;background:var(--bg3);border:1px solid var(--border);
  border-radius:8px;color:var(--text2);font-family:var(--font);font-size:.85rem;cursor:pointer;transition:.2s;
}
.btn-secondary:hover{border-color:var(--purple);color:var(--text);}
.btn-sm{padding:6px 14px;font-size:.78rem;}
.btn-icon{background:none;border:1px solid var(--border);border-radius:6px;color:var(--text2);padding:6px 10px;cursor:pointer;transition:.2s;font-size:.8rem;}
.btn-icon:hover{border-color:var(--purple);color:var(--text);background:var(--purple-dim);}
.btn-icon.danger:hover{border-color:var(--danger);color:var(--danger);background:rgba(239,68,68,0.1);}
.btn-logout{
  margin-top:auto;padding:10px;width:100%;background:none;
  border:1px solid rgba(239,68,68,0.2);border-radius:8px;
  color:var(--danger);font-family:var(--font);font-size:.82rem;cursor:pointer;transition:.2s;
}
.btn-logout:hover{background:rgba(239,68,68,0.08);}

/* Dashboard layout */
.admin-dashboard{display:flex;min-height:100vh;}
.sidebar{width:240px;background:var(--bg2);border-right:1px solid var(--border);padding:24px 16px;display:flex;flex-direction:column;gap:8px;position:relative;z-index:100;}
.sidebar-brand{display:flex;align-items:center;gap:10px;font-family:var(--display);font-weight:700;font-size:.95rem;letter-spacing:2px;margin-bottom:32px;padding:0 8px;}
.sidebar-nav{display:flex;flex-direction:column;gap:4px;}
.sidebar-link{
  display:flex;align-items:center;gap:10px;padding:10px 14px;border-radius:8px;text-decoration:none;
  color:var(--text2);font-size:.85rem;transition:.2s;
}
.sidebar-link:hover{background:var(--purple-dim);color:var(--text);}
.sidebar-link.active{background:var(--purple-dim);color:var(--text);font-weight:500;}
.sidebar-icon{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:2;flex-shrink:0;}
.sidebar-text{white-space:nowrap;}

/* Main area */
.admin-main{flex:1;padding:0;display:flex;flex-direction:column;overflow:hidden;min-width:0;}
.admin-header{
  display:flex;align-items:center;justify-content:space-between;
  padding:20px 32px;border-bottom:1px solid var(--border);
}
.admin-header h2{font-family:var(--display);font-size:1.3rem;font-weight:600;}
.admin-user-info{display:flex;align-items:center;gap:10px;}
.admin-avatar{width:32px;height:32px;border-radius:50%;background:linear-gradient(135deg,#7c3aed,#4f46e5);display:flex;align-items:center;justify-content:center;font-size:.8rem;font-weight:700;}

/* Sections */
.admin-section{display:none;padding:28px 32px;overflow-y:auto;flex:1;}
.admin-section.active{display:block;}
.section-toolbar{display:flex;align-items:center;justify-content:space-between;margin-bottom:24px;gap:16px;flex-wrap:wrap;}
.search-box input{padding:8px 16px;background:var(--bg3);border:1px solid var(--border);border-radius:8px;color:var(--text);font-family:var(--font);font-size:.85rem;width:240px;outline:none;transition:.2s;}
.search-box input:focus{border-color:var(--purple);}

/* Table */
.table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;}
.data-table{width:100%;border-collapse:collapse;min-width:600px;}
.data-table th{text-align:left;padding:12px 16px;font-size:.75rem;color:var(--text3);text-transform:uppercase;letter-spacing:1px;border-bottom:1px solid var(--border);font-weight:500;white-space:nowrap;}
.data-table td{padding:12px 16px;border-bottom:1px solid rgba(124,58,237,0.08);font-size:.88rem;vertical-align:middle;}
.data-table tr:hover td{background:rgba(124,58,237,0.04);}
.table-logo{width:36px;height:36px;border-radius:8px;background:var(--purple-dim);display:flex;align-items:center;justify-content:center;font-weight:600;color:var(--purple);overflow:hidden;font-size:.9rem;}
.table-logo img{width:100%;height:100%;object-fit:cover;}
.badge{padding:3px 10px;border-radius:12px;font-size:.72rem;font-weight:500;white-space:nowrap;}
.badge-featured{background:var(--purple-dim);color:#b388ff;}
.badge-active{background:rgba(52,211,153,0.1);color:var(--success);}
.badge-inactive{background:rgba(239,68,68,0.1);color:var(--danger);}
.actions-cell{display:flex;gap:6px;flex-wrap:nowrap;align-items:center;}

/* Role select in table */
.role-select{
  padding:4px 8px;background:var(--bg3);border:1px solid var(--border);
  border-radius:6px;color:var(--text);font-family:var(--font);font-size:.78rem;
  cursor:pointer;outline:none;transition:.2s;
}
.role-select:focus{border-color:var(--purple);}
.role-select:disabled{opacity:.4;cursor:not-allowed;}

/* Toast animation */
@keyframes toastIn{from{opacity:0;transform:translateX(20px);}to{opacity:1;transform:translateX(0);}}

/* Modal */
.modal-overlay{position:fixed;inset:0;z-index:500;background:rgba(6,6,15,0.8);backdrop-filter:blur(6px);display:flex;align-items:center;justify-content:center;padding:16px;}
.modal-card{width:520px;max-width:100%;max-height:90vh;overflow-y:auto;background:var(--bg2);border:1px solid var(--border);border-radius:16px;padding:32px;}
.modal-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:24px;}
.modal-header h3{font-family:var(--display);font-size:1.15rem;}
.modal-close{background:none;border:none;color:var(--text2);font-size:1.5rem;cursor:pointer;transition:.2s;}
.modal-close:hover{color:var(--text);}

/* Settings */
.settings-card{background:var(--bg2);border:1px solid var(--border);border-radius:16px;padding:32px;max-width:500px;}
.settings-card h3{font-family:var(--display);margin-bottom:8px;}
.settings-card p{color:var(--text2);font-size:.88rem;line-height:1.6;}
.settings-card code{background:var(--bg3);padding:2px 8px;border-radius:4px;font-size:.82rem;color:var(--purple);}

/* Stats Grid */
.stats-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:16px;}
.stat-card{background:var(--bg2);border:1px solid var(--border);border-radius:16px;padding:24px;text-align:center;transition:.3s;}
.stat-card:hover{border-color:var(--purple);box-shadow:0 0 20px var(--purple-dim);}
.stat-card-icon{font-size:1.4rem;margin-bottom:10px;color:var(--purple);display:flex;justify-content:center;}
.stat-card-val{font-family:var(--display);font-size:2rem;font-weight:800;background:linear-gradient(135deg,#7c3aed,#4f46e5,#22d3ee);-webkit-background-clip:text;-webkit-text-fill-color:transparent;margin-bottom:4px;}
.stat-card-lbl{font-size:.72rem;color:var(--text3);text-transform:uppercase;letter-spacing:1px;}

/* Messages */
.messages-list{display:flex;flex-direction:column;gap:12px;}
.msg-card{background:var(--bg2);border:1px solid var(--border);border-radius:12px;padding:20px;}
.msg-header{display:flex;justify-content:space-between;margin-bottom:8px;flex-wrap:wrap;gap:8px;}
.msg-from{font-weight:600;font-size:.9rem;}
.msg-date{font-size:.72rem;color:var(--text3);}
.msg-subject{font-size:.85rem;color:var(--purple);margin-bottom:6px;}
.msg-body{font-size:.84rem;color:var(--text2);line-height:1.5;}
.msg-email{font-size:.72rem;color:var(--text3);margin-top:6px;}

/* Overview Actions */
.overview-actions{margin-top:24px;display:flex;gap:12px;flex-wrap:wrap;}

/* Mobile admin header — hidden on desktop */
.mobile-admin-header{display:none;}
.sidebar-overlay{display:none;}

/* ── RESPONSIVE ── */
@media(max-width:768px){
  /* Mobile top header */
  .mobile-admin-header{
    display:flex;align-items:center;justify-content:space-between;
    padding:12px 16px;
    background:var(--bg2);border-bottom:1px solid var(--border);
    position:sticky;top:0;z-index:90;
  }
  .mobile-menu-btn{
    background:none;border:1px solid var(--border);border-radius:8px;
    padding:8px;color:var(--text);cursor:pointer;transition:.2s;
    display:flex;align-items:center;justify-content:center;
  }
  .mobile-menu-btn:hover{border-color:var(--purple);background:var(--purple-dim);}
  .mobile-admin-brand{
    font-family:var(--display);font-weight:700;font-size:.9rem;letter-spacing:2px;
  }
  .mobile-avatar{width:28px;height:28px;font-size:.7rem;}

  /* Dashboard becomes vertical */
  .admin-dashboard{flex-direction:column;}

  /* Sidebar: off-screen slide in */
  .sidebar{
    position:fixed;left:-280px;top:0;bottom:0;width:260px;
    z-index:200;transition:left .3s ease;
    box-shadow:none;padding:24px 16px;
  }
  .sidebar.open{left:0;box-shadow:8px 0 32px rgba(0,0,0,.5);}

  /* Sidebar overlay */
  .sidebar-overlay{
    display:none;position:fixed;inset:0;z-index:150;
    background:rgba(0,0,0,.5);backdrop-filter:blur(4px);
  }
  .sidebar-overlay.open{display:block;}

  /* Show sidebar text always on mobile when open */
  .sidebar-text{font-size:.85rem;}

  /* Desktop header hide, use mobile */
  .admin-header{display:none;}

  /* Sections */
  .admin-section{padding:16px;}

  /* Stats grid */
  .stats-grid{grid-template-columns:repeat(2,1fr);gap:10px;}
  .stat-card{padding:16px;}
  .stat-card-val{font-size:1.5rem;}
  .stat-card-lbl{font-size:.65rem;}

  /* Section toolbar */
  .section-toolbar{flex-direction:column;gap:10px;align-items:stretch;}
  .search-box input{width:100%;}

  /* Form rows */
  .form-row{flex-direction:column;gap:12px;}

  /* Modal */
  .modal-card{padding:20px;border-radius:12px;}
  .modal-header h3{font-size:1rem;}

  /* Table improvements */
  .data-table{font-size:.78rem;}
  .data-table th{padding:8px 10px;font-size:.68rem;}
  .data-table td{padding:8px 10px;font-size:.78rem;}
  .actions-cell{gap:4px;}
  .btn-icon{padding:5px 8px;font-size:.72rem;}

  /* Overview actions */
  .overview-actions{flex-direction:column;}
  .overview-actions .btn-primary,
  .overview-actions .btn-secondary{width:100%;text-align:center;}

  /* Settings card */
  .settings-card{padding:20px;max-width:100%;}

  /* Messages */
  .msg-card{padding:14px;}
}

@media(max-width:400px){
  .stats-grid{grid-template-columns:1fr;}
  .admin-login-card{padding:32px 24px;}
}