/* ============================================================
   BigaTech Solutions - Admin Panel CSS
   Dark Professional Dashboard
   ============================================================ */

:root {
  --a-bg:       #070714;
  --a-sidebar:  #0c0c1e;
  --a-card:     rgba(255,255,255,0.04);
  --a-border:   rgba(255,255,255,0.07);
  --a-primary:  #6c63ff;
  --a-secondary:#00d4ff;
  --a-accent:   #ff6b9d;
  --a-success:  #00ff88;
  --a-warning:  #ffd700;
  --a-danger:   #ff4757;
  --a-text:     #e0e0f0;
  --a-muted:    #606080;
  --a-radius:   10px;
  --a-trans:    0.25s ease;
  --a-sidebar-w:260px;
  --a-gradient: linear-gradient(135deg,#6c63ff,#00d4ff);
}

*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
html,body { height:100%; }
body {
  font-family:'Cairo','Segoe UI',sans-serif;
  background:var(--a-bg);
  color:var(--a-text);
  font-size:14px;
  line-height:1.6;
  overflow-x:hidden;
  scrollbar-gutter:stable;
}
a { text-decoration:none; color:inherit; transition:var(--a-trans); }
::-webkit-scrollbar { width:5px; }
::-webkit-scrollbar-track { background:var(--a-bg); }
::-webkit-scrollbar-thumb { background:var(--a-primary); border-radius:3px; }

/* ---- Layout ---- */
.admin-layout { display:flex; min-height:100vh; }

/* ---- Sidebar Collapsed ---- */
.admin-layout.sidebar-collapsed .sidebar {
  width:64px;
}
.admin-layout.sidebar-collapsed .sidebar-logo-text,
.admin-layout.sidebar-collapsed .sidebar-section-label,
.admin-layout.sidebar-collapsed .sidebar-nav a span,
.admin-layout.sidebar-collapsed .sidebar-nav a .badge-count,
.admin-layout.sidebar-collapsed .sidebar-user-info,
.admin-layout.sidebar-collapsed .sidebar-footer a span {
  opacity:0;
  pointer-events:none;
  width:0;
  overflow:hidden;
  white-space:nowrap;
}
.admin-layout.sidebar-collapsed .sidebar-nav a {
  justify-content:center;
  padding:10px 0;
  margin:0 8px;
}
.admin-layout.sidebar-collapsed .sidebar-nav a i { width:auto; font-size:1rem; }
.admin-layout.sidebar-collapsed .sidebar-logo {
  justify-content:center;
  padding:20px 0;
}
.admin-layout.sidebar-collapsed .sidebar-logo-icon { margin:0 auto; }
.admin-layout.sidebar-collapsed .sidebar-user {
  justify-content:center;
  padding:8px 0;
}
.admin-layout.sidebar-collapsed .sidebar-footer a {
  justify-content:center;
  padding:8px 0;
  margin:0 8px;
}
.admin-layout.sidebar-collapsed .admin-main {
  margin-inline-start:64px;
}
/* Prevent content jump during transition */
.admin-main {
  margin-inline-start:var(--a-sidebar-w);
  flex:1;
  display:flex;
  flex-direction:column;
  min-height:100vh;
  transition:margin-inline-start 0.3s ease;
  min-width:0;
}
/* Tooltip on hover when collapsed */
.admin-layout.sidebar-collapsed .sidebar-nav a {
  position:relative;
}
.admin-layout.sidebar-collapsed .sidebar-nav a:hover::after {
  content: attr(title);
  position:absolute;
  inset-inline-start:calc(100% + 10px);
  top:50%;
  transform:translateY(-50%);
  background:var(--a-card);
  border:1px solid var(--a-border);
  color:var(--a-text);
  padding:5px 12px;
  border-radius:6px;
  font-size:0.8rem;
  white-space:nowrap;
  z-index:200;
  box-shadow:0 4px 15px rgba(0,0,0,0.3);
}

/* ---- Sidebar ---- */
.sidebar {
  width:var(--a-sidebar-w);
  background:var(--a-sidebar);
  border-inline-end:1px solid var(--a-border);
  display:flex;
  flex-direction:column;
  position:fixed;
  top:0;left:0;bottom:0;
  z-index:100;
  transition:transform 0.3s ease, width 0.3s ease;
  overflow-y:auto;
  overflow-x:clip;
}
.sidebar-logo {
  padding:24px 20px;
  border-bottom:1px solid var(--a-border);
  display:flex;
  align-items:center;
  gap:12px;
}
.sidebar-logo-icon {
  width:40px;height:40px;
  background:var(--a-gradient);
  border-radius:10px;
  display:flex;align-items:center;justify-content:center;
  font-size:1.2rem;color:#fff;font-weight:900;
  font-family:'Orbitron',sans-serif;
  flex-shrink:0;
}
.sidebar-logo-text { font-weight:700; font-size:1rem; color:var(--a-text); line-height:1.2; }
.sidebar-logo-text small { font-size:0.7rem; color:var(--a-muted); font-weight:400; }

.sidebar-section { padding:16px 12px 4px; }
.sidebar-section-label {
  font-size:0.65rem;
  font-weight:700;
  color:var(--a-muted);
  text-transform:uppercase;
  letter-spacing:1.5px;
  padding:0 8px;
  margin-bottom:6px;
}
.sidebar-nav { list-style:none; }
.sidebar-nav li { margin-bottom:2px; }
.sidebar-nav a {
  display:flex;
  align-items:center;
  gap:12px;
  padding:10px 12px;
  border-radius:8px;
  color:#8080a0;
  font-size:0.88rem;
  font-weight:500;
  transition:var(--a-trans);
  position:relative;
}
.sidebar-nav a i { width:18px; text-align:center; font-size:0.95rem; }
.sidebar-nav a:hover { background:rgba(108,99,255,0.1); color:var(--a-text); }
.sidebar-nav a.active {
  background:rgba(108,99,255,0.15);
  color:var(--a-primary);
  border-inline-start:3px solid var(--a-primary);
}
.sidebar-nav a .badge-count {
  margin-inline-start:auto;
  background:var(--a-accent);
  color:#fff;
  border-radius:50px;
  padding:1px 8px;
  font-size:0.7rem;
  font-weight:700;
}

.sidebar-footer {
  margin-top:auto;
  padding:16px 12px;
  border-top:1px solid var(--a-border);
}
.sidebar-user {
  display:flex;
  align-items:center;
  gap:10px;
  padding:8px;
  border-radius:8px;
  cursor:pointer;
  transition:var(--a-trans);
}
.sidebar-user:hover { background:rgba(255,255,255,0.04); }
.sidebar-user-avatar {
  width:36px;height:36px;
  background:var(--a-gradient);
  border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-weight:700;color:#fff;font-size:0.9rem;
  flex-shrink:0;
}
.sidebar-user-info { flex:1; min-width:0; }
.sidebar-user-name { font-weight:600; font-size:0.85rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.sidebar-user-role { font-size:0.7rem; color:var(--a-muted); }

/* ---- Main Content ---- */
.admin-layout { overflow-x:hidden; }



/* ---- Top Header ---- */
.admin-header {
  padding:16px 28px;
  background:var(--a-sidebar);
  border-bottom:1px solid var(--a-border);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  position:sticky;top:0;z-index:50;
}
.admin-header-left { display:flex; align-items:center; gap:16px; }
.admin-header-title { font-size:1.1rem; font-weight:700; }
.admin-header-breadcrumb { font-size:0.8rem; color:var(--a-muted); }
.admin-header-right { display:flex; align-items:center; gap:12px; }
.header-btn {
  width:38px;height:38px;
  background:var(--a-card);
  border:1px solid var(--a-border);
  border-radius:8px;
  display:flex;align-items:center;justify-content:center;
  color:var(--a-muted);
  cursor:pointer;
  font-size:0.9rem;
  transition:var(--a-trans);
  text-decoration:none;
  position:relative;
}
.header-btn:hover { background:rgba(108,99,255,0.15); color:var(--a-primary); border-color:var(--a-primary); }
.header-btn .notif-dot {
  position:absolute;
  top:6px;right:6px;
  width:8px;height:8px;
  background:var(--a-accent);
  border-radius:50%;
  border:2px solid var(--a-sidebar);
}
.sidebar-toggle {
  display:flex;
  align-items:center;
  justify-content:center;
  width:36px;
  height:36px;
  cursor:pointer;
  background:var(--a-card);
  border:1px solid var(--a-border);
  border-radius:8px;
  color:var(--a-muted);
  font-size:0.95rem;
  transition:var(--a-trans);
  flex-shrink:0;
}
.sidebar-toggle:hover {
  background:rgba(108,99,255,0.15);
  color:var(--a-primary);
  border-color:var(--a-primary);
}

/* ---- Admin Content Area ---- */
.admin-content { padding:28px; flex:1; }

/* ---- Stats Cards ---- */
.stats-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:20px; margin-bottom:32px; }
.stat-card {
  background:var(--a-card);
  border:1px solid var(--a-border);
  border-radius:var(--a-radius);
  padding:24px;
  display:flex;
  align-items:center;
  gap:16px;
  transition:var(--a-trans);
  position:relative;
  overflow:hidden;
}
.stat-card::before {
  content:'';
  position:absolute;
  top:0;left:0;right:0;
  height:2px;
}
.stat-card.c1::before { background:linear-gradient(90deg,var(--a-primary),transparent); }
.stat-card.c2::before { background:linear-gradient(90deg,var(--a-secondary),transparent); }
.stat-card.c3::before { background:linear-gradient(90deg,var(--a-accent),transparent); }
.stat-card.c4::before { background:linear-gradient(90deg,var(--a-warning),transparent); }
.stat-card.c5::before { background:linear-gradient(90deg,var(--a-success),transparent); }
.stat-card:hover { background:rgba(255,255,255,0.06); transform:translateY(-2px); }
.stat-icon {
  width:50px;height:50px;
  border-radius:12px;
  display:flex;align-items:center;justify-content:center;
  font-size:1.3rem;
  flex-shrink:0;
}
.stat-card.c1 .stat-icon { background:rgba(108,99,255,0.15); color:var(--a-primary); }
.stat-card.c2 .stat-icon { background:rgba(0,212,255,0.15); color:var(--a-secondary); }
.stat-card.c3 .stat-icon { background:rgba(255,107,157,0.15); color:var(--a-accent); }
.stat-card.c4 .stat-icon { background:rgba(255,215,0,0.15); color:var(--a-warning); }
.stat-card.c5 .stat-icon { background:rgba(0,255,136,0.15); color:var(--a-success); }
.stat-info { flex:1; }
.stat-value { font-size:1.8rem; font-weight:700; line-height:1; margin-bottom:4px; }
.stat-label { font-size:0.8rem; color:var(--a-muted); }

/* ---- Admin Cards ---- */
.admin-card {
  background:var(--a-card);
  border:1px solid var(--a-border);
  border-radius:var(--a-radius);
  overflow:hidden;
  margin-bottom:24px;
}
.admin-card-header {
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:18px 24px;
  border-bottom:1px solid var(--a-border);
}
.admin-card-title { font-size:0.95rem; font-weight:700; display:flex; align-items:center; gap:8px; }
.admin-card-title i { color:var(--a-primary); }
.admin-card-body { padding:24px; }

/* ---- Tables ---- */
.admin-table-wrap { overflow-x:auto; }
.admin-table { width:100%; border-collapse:collapse; min-width:700px; }
.admin-table th {
  text-align:start;
  padding:10px 16px;
  background:rgba(255,255,255,0.03);
  font-size:0.75rem;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:1px;
  color:var(--a-muted);
  border-bottom:1px solid var(--a-border);
  white-space:nowrap;
}
.admin-table td {
  padding:14px 16px;
  border-bottom:1px solid rgba(255,255,255,0.03);
  font-size:0.875rem;
  vertical-align:middle;
  white-space:nowrap;
}
.admin-table tr:hover td { background:rgba(255,255,255,0.02); }
.admin-table tr:last-child td { border-bottom:none; }

/* ---- Status Badges ---- */
.badge {
  display:inline-flex;
  align-items:center;
  gap:4px;
  padding:3px 10px;
  border-radius:50px;
  font-size:0.72rem;
  font-weight:600;
}
.badge-success { background:rgba(0,255,136,0.12); color:var(--a-success); }
.badge-danger  { background:rgba(255,71,87,0.12);  color:var(--a-danger); }
.badge-warning { background:rgba(255,215,0,0.12);  color:var(--a-warning); }
.badge-primary { background:rgba(108,99,255,0.15); color:var(--a-primary); }
.badge-info    { background:rgba(0,212,255,0.12);   color:var(--a-secondary); }
.badge-new     { background:rgba(255,107,157,0.15); color:var(--a-accent); }

/* ---- Action Buttons ---- */
.action-btns { display:flex; gap:6px; flex-wrap:nowrap; align-items:center; }
.action-btn {
  width:30px;height:30px;
  border-radius:6px;
  border:1px solid var(--a-border);
  background:var(--a-card);
  display:flex;align-items:center;justify-content:center;
  font-size:0.75rem;
  cursor:pointer;
  transition:var(--a-trans);
  color:var(--a-muted);
}
.action-btn:hover { transform:scale(1.1); }
.action-btn.edit:hover  { background:rgba(108,99,255,0.15); color:var(--a-primary); border-color:var(--a-primary); }
.action-btn.delete:hover{ background:rgba(255,71,87,0.15); color:var(--a-danger); border-color:var(--a-danger); }
.action-btn.view:hover  { background:rgba(0,212,255,0.15); color:var(--a-secondary); border-color:var(--a-secondary); }
.action-btn.toggle:hover{ background:rgba(0,255,136,0.15); color:var(--a-success); border-color:var(--a-success); }

/* ---- Admin Buttons ---- */
.btn-admin {
  display:inline-flex;align-items:center;gap:8px;
  padding:9px 20px;
  border-radius:8px;
  font-size:0.85rem;font-weight:600;
  cursor:pointer;border:none;outline:none;
  transition:var(--a-trans);
  font-family:inherit;
}
.btn-admin-primary {
  background:var(--a-gradient);
  color:#fff;
  box-shadow:0 4px 15px rgba(108,99,255,0.35);
}
.btn-admin-primary:hover { transform:translateY(-1px); box-shadow:0 6px 20px rgba(108,99,255,0.5); }
.btn-admin-ghost {
  background:var(--a-card);
  color:var(--a-text);
  border:1px solid var(--a-border);
}
.btn-admin-ghost:hover { background:rgba(255,255,255,0.08); }
.btn-admin-danger {
  background:rgba(255,71,87,0.15);
  color:var(--a-danger);
  border:1px solid rgba(255,71,87,0.3);
}
.btn-admin-danger:hover { background:rgba(255,71,87,0.25); }
.btn-admin-success {
  background:rgba(0,255,136,0.12);
  color:var(--a-success);
  border:1px solid rgba(0,255,136,0.3);
}
.btn-admin-success:hover { background:rgba(0,255,136,0.2); }

/* ---- Forms ---- */
.form-admin .form-group { margin-bottom:18px; }
.form-admin label {
  display:block;
  font-size:0.8rem;
  font-weight:600;
  color:var(--a-muted);
  margin-bottom:6px;
  text-transform:uppercase;
  letter-spacing:0.5px;
}
.form-admin .form-control {
  width:100%;
  padding:10px 14px;
  background:rgba(255,255,255,0.04);
  border:1px solid var(--a-border);
  border-radius:8px;
  color:var(--a-text);
  font-size:0.875rem;
  font-family:inherit;
  outline:none;
  transition:var(--a-trans);
}
.form-admin .form-control:focus {
  border-color:var(--a-primary);
  background:rgba(108,99,255,0.06);
  box-shadow:0 0 0 3px rgba(108,99,255,0.1);
}
.form-admin .form-control::placeholder { color:var(--a-muted); }
.form-admin textarea.form-control { resize:vertical; min-height:100px; }
.form-admin select.form-control { cursor:pointer; }
.form-admin .form-row { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.form-admin .form-row-3 { grid-template-columns:1fr 1fr 1fr; }

/* Tabs */
.lang-tabs { display:flex; gap:0; margin-bottom:0; border-bottom:1px solid var(--a-border); }
.lang-tab {
  padding:8px 16px;
  background:transparent;
  border:none;
  border-bottom:2px solid transparent;
  color:var(--a-muted);
  cursor:pointer;
  font-size:0.8rem;
  font-weight:600;
  font-family:inherit;
  transition:var(--a-trans);
  margin-bottom:-1px;
}
.lang-tab.active { color:var(--a-primary); border-bottom-color:var(--a-primary); }
.lang-pane { display:none; padding-top:16px; }
.lang-pane.active { display:block; }

/* ---- Modal ---- */
.modal-overlay {
  position:fixed;inset:0;
  background:rgba(0,0,0,0.7);
  backdrop-filter:blur(8px);
  z-index:1000;
  display:flex;align-items:center;justify-content:center;
  padding:20px;
  opacity:0;visibility:hidden;
  transition:opacity 0.3s ease,visibility 0.3s ease;
}
.modal-overlay.open { opacity:1; visibility:visible; }
.modal {
  background:#0d0d22;
  border:1px solid var(--a-border);
  border-radius:16px;
  width:100%;max-width:680px;
  max-height:90vh;
  overflow:hidden;
  display:flex;flex-direction:column;
  transform:scale(0.9) translateY(20px);
  transition:transform 0.3s ease;
}
.modal-overlay.open .modal { transform:scale(1) translateY(0); }
.modal-header {
  display:flex;align-items:center;justify-content:space-between;
  padding:20px 24px;
  border-bottom:1px solid var(--a-border);
}
.modal-title { font-size:1rem; font-weight:700; display:flex; align-items:center; gap:10px; }
.modal-title i { color:var(--a-primary); }
.modal-close {
  width:32px;height:32px;
  background:var(--a-card);
  border:1px solid var(--a-border);
  border-radius:8px;
  cursor:pointer;color:var(--a-muted);
  display:flex;align-items:center;justify-content:center;
  font-size:0.9rem;
  transition:var(--a-trans);
}
.modal-close:hover { background:rgba(255,71,87,0.15); color:var(--a-danger); border-color:var(--a-danger); }
.modal-body { padding:24px; overflow-y:auto; flex:1; }
.modal-footer {
  padding:16px 24px;
  border-top:1px solid var(--a-border);
  display:flex;justify-content:flex-end;gap:10px;
}

/* ---- Alert Messages ---- */
.alert {
  padding:12px 16px;
  border-radius:8px;
  font-size:0.875rem;
  margin-bottom:16px;
  display:flex;align-items:center;gap:10px;
}
.alert-success { background:rgba(0,255,136,0.1); border:1px solid rgba(0,255,136,0.25); color:var(--a-success); }
.alert-danger   { background:rgba(255,71,87,0.1);  border:1px solid rgba(255,71,87,0.25);  color:var(--a-danger); }
.alert-info     { background:rgba(0,212,255,0.1);   border:1px solid rgba(0,212,255,0.25);  color:var(--a-secondary); }

/* ---- Pagination ---- */
.pagination { display:flex; gap:4px; justify-content:center; margin-top:20px; }
.page-btn {
  min-width:32px;height:32px;
  padding:0 8px;
  border-radius:6px;
  background:var(--a-card);
  border:1px solid var(--a-border);
  color:var(--a-muted);
  cursor:pointer;font-size:0.8rem;
  display:flex;align-items:center;justify-content:center;
  transition:var(--a-trans);
}
.page-btn:hover,.page-btn.active {
  background:rgba(108,99,255,0.15);
  color:var(--a-primary);
  border-color:var(--a-primary);
}

/* ---- Login Page ---- */
.admin-login {
  min-height:100vh;
  display:flex;align-items:center;justify-content:center;
  background:var(--a-bg);
  position:relative;
  overflow:hidden;
}
.admin-login::before {
  content:'';
  position:absolute;inset:0;
  background:
    radial-gradient(ellipse at 20% 30%,rgba(108,99,255,0.1) 0%,transparent 50%),
    radial-gradient(ellipse at 80% 70%,rgba(0,212,255,0.07) 0%,transparent 50%);
}
.login-card {
  position:relative;
  width:100%;max-width:420px;
  background:rgba(12,12,30,0.9);
  backdrop-filter:blur(20px);
  border:1px solid var(--a-border);
  border-radius:20px;
  padding:44px 40px;
  margin:20px;
  animation:loginFadeIn 0.6s ease;
}
@keyframes loginFadeIn { from{opacity:0;transform:translateY(30px);} to{opacity:1;transform:translateY(0);} }
.login-logo {
  text-align:center;
  margin-bottom:32px;
}
.login-logo-icon {
  width:60px;height:60px;
  background:var(--a-gradient);
  border-radius:16px;
  display:flex;align-items:center;justify-content:center;
  font-family:'Orbitron',sans-serif;font-size:1.4rem;font-weight:900;color:#fff;
  margin:0 auto 12px;
}
.login-logo h2 { font-size:1.3rem; margin-bottom:4px; }
.login-logo p { font-size:0.8rem; color:var(--a-muted); }
.login-form .form-group { margin-bottom:20px; }
.login-form label { display:block; font-size:0.8rem; font-weight:600; color:var(--a-muted); margin-bottom:8px; }
.login-input-wrap { position:relative; }
.login-input-wrap i {
  position:absolute;
  top:50%;left:14px;
  transform:translateY(-50%);
  color:var(--a-muted);font-size:0.9rem;
}
.login-input {
  width:100%;
  padding:12px 14px 12px 42px;
  background:rgba(255,255,255,0.04);
  border:1px solid var(--a-border);
  border-radius:10px;
  color:var(--a-text);
  font-size:0.9rem;
  font-family:inherit;
  outline:none;
  transition:var(--a-trans);
}
.login-input:focus {
  border-color:var(--a-primary);
  background:rgba(108,99,255,0.06);
  box-shadow:0 0 0 3px rgba(108,99,255,0.1);
}
.login-btn {
  width:100%;
  padding:13px;
  background:var(--a-gradient);
  border:none;border-radius:10px;
  color:#fff;font-size:0.95rem;font-weight:700;
  cursor:pointer;font-family:inherit;
  transition:var(--a-trans);
  box-shadow:0 4px 20px rgba(108,99,255,0.4);
  letter-spacing:0.5px;
}
.login-btn:hover { transform:translateY(-2px); box-shadow:0 8px 30px rgba(108,99,255,0.6); }
.login-error {
  background:rgba(255,71,87,0.1);
  border:1px solid rgba(255,71,87,0.3);
  color:var(--a-danger);
  padding:10px 14px;
  border-radius:8px;
  font-size:0.85rem;
  margin-bottom:20px;
  display:none;
}
.login-error.show { display:block; }
.login-back { text-align:center; margin-top:20px; font-size:0.8rem; color:var(--a-muted); }
.login-back a { color:var(--a-primary); }

/* ---- Responsive ---- */
@media(max-width:900px) {
  .sidebar { transform:translateX(-100%); }
  body[dir="rtl"] .sidebar { transform:translateX(100%); }
  .sidebar.open { transform:translateX(0); }
  .admin-main { margin-inline-start:0; }
  .sidebar-toggle { display:block; }
  .sidebar-overlay {
    position:fixed;inset:0;background:rgba(0,0,0,0.5);
    z-index:99;display:none;
  }
  .sidebar-overlay.show { display:block; }
}
@media(max-width:600px) {
  .admin-content { padding:16px; }
  .form-admin .form-row,.form-admin .form-row-3 { grid-template-columns:1fr; }
  .stats-grid { grid-template-columns:1fr 1fr; }
}
@media(max-width:400px) {
  .stats-grid { grid-template-columns:1fr; }
}
