/* ===== Admin Panel - Styles partagés ===== */
:root{
  --sidebar-w: 280px;
}
body{
  font-family: 'Cairo', sans-serif;
  background:#f4f6f9;
}
.admin-scrollbar::-webkit-scrollbar{ width:6px; height:6px; }
.admin-scrollbar::-webkit-scrollbar-thumb{ background:#cbd5e1; border-radius:10px; }
.admin-scrollbar::-webkit-scrollbar-track{ background:transparent; }

#admin-sidebar{
  width:var(--sidebar-w);
  min-height:100vh;
}
.sidebar-link{
  display:flex; align-items:center; gap:.75rem;
  padding:.65rem 1rem; border-radius:.6rem;
  color:#cbd5e1; font-weight:600; font-size:.92rem;
  transition:.15s;
}
.sidebar-link:hover{ background:rgba(255,255,255,.08); color:#fff; }
.sidebar-link.active{ background:#fff; color:#111827; }
.sidebar-link.active i{ color:var(--brand,#4f46e5); }

.stat-card{
  background:#fff; border-radius:1rem; padding:1.25rem;
  box-shadow:0 1px 3px rgba(0,0,0,.06);
  border:1px solid #eef0f4;
}
.template-card{
  background:#fff; border-radius:1rem; overflow:hidden;
  border:1px solid #eef0f4; transition:.2s;
  cursor:pointer;
}
.template-card:hover{ transform:translateY(-3px); box-shadow:0 10px 25px rgba(0,0,0,.08); }
.template-card.selected{ outline:3px solid #4f46e5; }

.site-card{
  background:#fff; border-radius:1rem; overflow:hidden;
  border:1px solid #eef0f4; transition:.2s;
}
.site-card:hover{ box-shadow:0 10px 25px rgba(0,0,0,.08); }

.tab-btn{
  padding:.6rem 1.1rem; border-radius:.6rem; font-weight:700; font-size:.88rem;
  color:#475569; white-space:nowrap;
}
.tab-btn.active{ background:#111827; color:#fff; }

.form-label{ display:block; font-size:.85rem; font-weight:700; color:#334155; margin-bottom:.35rem; }
.form-input, .form-textarea, .form-select{
  width:100%; border:1px solid #e2e8f0; border-radius:.6rem; padding:.55rem .8rem;
  font-size:.9rem; background:#fff; transition:.15s;
}
.form-input:focus, .form-textarea:focus, .form-select:focus{
  outline:none; border-color:#4f46e5; box-shadow:0 0 0 3px rgba(79,70,229,.12);
}
.section-card{
  background:#fff; border-radius:1rem; padding:1.5rem; border:1px solid #eef0f4;
}
.badge{
  display:inline-flex; align-items:center; gap:.3rem;
  padding:.2rem .6rem; border-radius:999px; font-size:.75rem; font-weight:700;
}
.badge-green{ background:#dcfce7; color:#166534; }
.badge-gray{ background:#f1f5f9; color:#475569; }
.badge-amber{ background:#fef3c7; color:#92400e; }
.badge-red{ background:#fee2e2; color:#991b1b; }

.btn-primary{
  background:#4f46e5; color:#fff; font-weight:700; padding:.6rem 1.2rem;
  border-radius:.6rem; transition:.15s; display:inline-flex; align-items:center; gap:.5rem;
}
.btn-primary:hover{ background:#4338ca; }
.btn-outline{
  border:1px solid #e2e8f0; color:#334155; font-weight:700; padding:.6rem 1.2rem;
  border-radius:.6rem; transition:.15s; display:inline-flex; align-items:center; gap:.5rem;
  background:#fff;
}
.btn-outline:hover{ background:#f8fafc; }
.btn-danger{
  color:#dc2626; font-weight:700; padding:.5rem 1rem; border-radius:.6rem;
  display:inline-flex; align-items:center; gap:.4rem; transition:.15s;
}
.btn-danger:hover{ background:#fef2f2; }

.modal-overlay{
  position:fixed; inset:0; background:rgba(15,23,42,.6);
  display:flex; align-items:center; justify-content:center; z-index:100;
  padding:1rem;
}
.modal-box{
  background:#fff; border-radius:1rem; width:100%; max-width:640px;
  max-height:90vh; overflow-y:auto;
}

.color-swatch{
  width:2.4rem; height:2.4rem; border-radius:.5rem; border:2px solid #e2e8f0; cursor:pointer;
}

.drag-handle{ cursor:grab; color:#94a3b8; }

.toast{
  position:fixed; bottom:1.5rem; left:50%; transform:translateX(-50%);
  background:#111827; color:#fff; padding:.7rem 1.4rem; border-radius:.7rem;
  font-weight:700; font-size:.9rem; z-index:200; box-shadow:0 10px 25px rgba(0,0,0,.25);
}