@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap');
@import url('https://cdnjs.cloudflare.com/ajax/libs/limonte-sweetalert2/11.2.0/sweetalert2.min.css');
@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.5.0/font/bootstrap-icons.css");

/* ============================================================
   AESTHETIC PURPLE THEME — visual overrides only
   No markup/logic changed. All original classes/ids preserved.
   ============================================================ */
:root{
  --p-bg-1:#0f0a1f;
  --p-bg-2:#1a0f2e;
  --p-bg-3:#241340;
  --p-surface:rgba(30,18,55,.85);
  --p-surface-2:rgba(45,25,80,.75);
  --p-border:rgba(168,85,247,.28);
  --p-border-strong:rgba(168,85,247,.55);
  --p-primary:#a855f7;
  --p-primary-2:#c084fc;
  --p-primary-3:#7c3aed;
  --p-accent:#e879f9;
  --p-text:#f3e8ff;
  --p-text-dim:#c4b5fd;
  --p-muted:#a78bfa;
  --p-danger:#f472b6;
  --p-success:#a3e635;
  --p-glow:0 0 24px rgba(168,85,247,.35);
}

html,body{
  background: radial-gradient(1200px 800px at 10% -10%, #2a1357 0%, transparent 60%),
              radial-gradient(900px 600px at 110% 10%, #4a1d8a 0%, transparent 55%),
              linear-gradient(180deg, var(--p-bg-1) 0%, var(--p-bg-2) 100%) !important;
  background-attachment: fixed !important;
  background-color: var(--p-bg-1) !important;
  color: var(--p-text) !important;
  font-family: 'Poppins', sans-serif !important;
  min-height: 100vh;
}

.container{ max-width:1140px; }

/* Selection */
::selection{ background:var(--p-primary); color:#fff; }

/* ---------- Navbar ---------- */
.navbar, .navbar.bg-dark, .bg-dark{
  background: linear-gradient(90deg, rgba(20,10,40,.95), rgba(45,20,90,.95)) !important;
  border-bottom: 1px solid var(--p-border);
  backdrop-filter: blur(12px);
  box-shadow: 0 4px 30px rgba(124,58,237,.15);
}
.navbar-brand{ color: var(--p-text) !important; font-weight:600; letter-spacing:.3px; }
.navbar-brand img{ filter: drop-shadow(0 0 6px var(--p-primary)); }
.navbar-dark .navbar-nav .nav-link,
.navbar .nav-link,
.nav-link.text-white{ color: var(--p-text-dim) !important; transition: color .2s, text-shadow .2s; }
.navbar-dark .navbar-nav .nav-link:hover,
.navbar .nav-link:hover{ color: var(--p-primary-2) !important; text-shadow: 0 0 10px var(--p-primary); }
.navbar-toggler{ border-color: var(--p-border-strong) !important; }
.navbar-toggler-icon{ filter: invert(.85) hue-rotate(230deg) saturate(2); }

/* ---------- Side menu ---------- */
.side-menu{
  background: linear-gradient(180deg, #1a0f2e 0%, #0f0a1f 100%) !important;
  border-left: 1px solid var(--p-border);
  box-shadow: -8px 0 40px rgba(124,58,237,.25);
}
.side-menu-header{ border-bottom: 1px solid var(--p-border) !important; }
.side-menu .nav-link{ color: var(--p-text-dim) !important; }
.side-menu .nav-link:hover{ background: rgba(168,85,247,.12); color: var(--p-primary-2) !important; }
.side-menu .nav-link.text-danger{ color: var(--p-danger) !important; }

/* ---------- Cards / surfaces ---------- */
.card{
  background: var(--p-surface) !important;
  border: 1px solid var(--p-border) !important;
  color: var(--p-text) !important;
  border-radius: 14px !important;
  box-shadow: 0 8px 32px rgba(0,0,0,.4), 0 0 0 1px rgba(168,85,247,.08) inset;
  backdrop-filter: blur(10px);
}
.card-header,
.card-header.bg-light,
.card-header.bg-dark{
  background: linear-gradient(90deg, rgba(124,58,237,.35), rgba(168,85,247,.2)) !important;
  border-bottom: 1px solid var(--p-border) !important;
  color: var(--p-text) !important;
}
.card-body, .card-body.bg-light{ background: transparent !important; color: var(--p-text) !important; }
.card-footer{ background: rgba(15,10,31,.6) !important; border-top: 1px solid var(--p-border) !important; color: var(--p-text-dim) !important; }

/* generic light backgrounds → purple surface */
.bg-light, .bg-white, .bg-body{
  background: var(--p-surface) !important;
  color: var(--p-text) !important;
}
.text-black, .text-dark{ color: var(--p-text) !important; }
.text-muted{ color: var(--p-muted) !important; }
.text-white{ color: var(--p-text) !important; }
.text-danger{ color: var(--p-danger) !important; }
.text-success{ color: var(--p-success) !important; }
.border, .border-top, .border-bottom, .border-start, .border-end{ border-color: var(--p-border) !important; }

/* ---------- Buttons ---------- */
.btn{ border-radius: 10px; font-weight:500; letter-spacing:.2px; transition: all .2s ease; }
.btn-primary, .btn-default{
  background: linear-gradient(135deg, var(--p-primary) 0%, var(--p-primary-3) 100%) !important;
  border: none !important; color:#fff !important;
  box-shadow: 0 4px 14px rgba(168,85,247,.4);
}
.btn-primary:hover, .btn-default:hover{
  background: linear-gradient(135deg, var(--p-primary-2) 0%, var(--p-primary) 100%) !important;
  transform: translateY(-1px);
  box-shadow: 0 6px 22px rgba(192,132,252,.55);
  color:#fff !important;
}
.btn-outline-light, .btn-outline-dark, .btn-outline-primary, .btn-outline-secondary{
  background: transparent !important;
  border: 1px solid var(--p-border-strong) !important;
  color: var(--p-text) !important;
}
.btn-outline-light:hover, .btn-outline-dark:hover, .btn-outline-primary:hover, .btn-outline-secondary:hover{
  background: rgba(168,85,247,.18) !important;
  border-color: var(--p-primary) !important;
  color: var(--p-primary-2) !important;
  box-shadow: 0 0 16px rgba(168,85,247,.35);
}
.btn-success{
  background: linear-gradient(135deg,#a855f7,#e879f9) !important; border:none !important; color:#fff !important;
}
.btn-danger{
  background: linear-gradient(135deg,#9333ea,#ec4899) !important; border:none !important; color:#fff !important;
}
.btn-secondary{
  background: rgba(124,58,237,.45) !important; border:1px solid var(--p-border-strong) !important; color:#fff !important;
}
.btn-close, .btn-close-white{ filter: invert(.9) hue-rotate(230deg) saturate(2) brightness(1.2); }

/* ---------- Forms ---------- */
.form-control, .form-select, textarea, input[type="text"], input[type="password"], input[type="email"], input[type="number"]{
  background: rgba(15,10,31,.7) !important;
  border: 1px solid var(--p-border) !important;
  color: var(--p-text) !important;
  border-radius: 10px !important;
  transition: border-color .2s, box-shadow .2s;
}
.form-control::placeholder, textarea::placeholder{ color: rgba(196,181,253,.5) !important; }
.form-control:focus, .form-select:focus, textarea:focus, input:focus{
  background: rgba(15,10,31,.85) !important;
  border-color: var(--p-primary) !important;
  box-shadow: 0 0 0 3px rgba(168,85,247,.25) !important;
  color: var(--p-text) !important;
  outline: none !important;
}
.form-label, label{ color: var(--p-text-dim) !important; font-weight:500; }
.form-check-input{ background-color: rgba(15,10,31,.7) !important; border-color: var(--p-border-strong) !important; }
.form-check-input:checked{ background-color: var(--p-primary) !important; border-color: var(--p-primary) !important; }
.input-group-text{ background: rgba(124,58,237,.25) !important; border:1px solid var(--p-border) !important; color: var(--p-text) !important; }

/* ---------- Tables ---------- */
.table{ color: var(--p-text) !important; border-color: var(--p-border) !important; }
.table > :not(caption) > * > *{
  background: transparent !important;
  border-bottom-color: var(--p-border) !important;
  color: var(--p-text) !important;
}
.table thead th, .table th{
  background: linear-gradient(90deg, rgba(124,58,237,.35), rgba(168,85,247,.2)) !important;
  color: var(--p-text) !important;
  border-color: var(--p-border-strong) !important;
}
.table-striped > tbody > tr:nth-of-type(odd) > *{ background: rgba(168,85,247,.06) !important; }
.table-hover > tbody > tr:hover > *{ background: rgba(168,85,247,.14) !important; }

/* ---------- Alerts ---------- */
.alert{ border-radius: 12px; border:1px solid var(--p-border); background: var(--p-surface); color: var(--p-text); }
.alert-success{ border-color: rgba(163,230,53,.4); background: rgba(76,29,149,.5); color:#e9d5ff; }
.alert-danger{ border-color: rgba(244,114,182,.4); background: rgba(76,29,149,.5); color:#fbcfe8; }
.alert-warning{ border-color: rgba(250,204,21,.4); background: rgba(76,29,149,.5); color:#fde68a; }
.alert-info{ border-color: var(--p-border-strong); background: rgba(76,29,149,.5); color: var(--p-text-dim); }

/* ---------- Modals / dropdowns ---------- */
.modal-content{ background: linear-gradient(180deg,#1a0f2e,#0f0a1f) !important; border:1px solid var(--p-border) !important; color: var(--p-text) !important; }
.modal-header, .modal-footer{ border-color: var(--p-border) !important; }
.dropdown-menu{ background: #1a0f2e !important; border:1px solid var(--p-border) !important; }
.dropdown-item{ color: var(--p-text-dim) !important; }
.dropdown-item:hover{ background: rgba(168,85,247,.18) !important; color: var(--p-primary-2) !important; }

/* ---------- Badges / pills ---------- */
.badge{ background: linear-gradient(135deg, var(--p-primary), var(--p-primary-3)) !important; color:#fff !important; }
.badge.bg-secondary{ background: rgba(124,58,237,.6) !important; }
.badge.bg-success{ background: linear-gradient(135deg,#a855f7,#e879f9) !important; }
.badge.bg-danger{ background: linear-gradient(135deg,#9333ea,#ec4899) !important; }

/* ---------- Footer ---------- */
footer.fixed-bottom, footer{
  background: rgba(15,10,31,.85) !important;
  border-top: 1px solid var(--p-border) !important;
  backdrop-filter: blur(10px);
}
footer .text-muted, footer small{ color: var(--p-muted) !important; }

/* ---------- Toggle switches (.hacks .switch .slider) ---------- */
.slider{ background-color: rgba(60,40,100,.6) !important; }
input:checked + .slider{ background: linear-gradient(135deg, var(--p-primary), var(--p-accent)) !important; box-shadow: 0 0 12px rgba(168,85,247,.55); }
.slider:before{ background-color: #f3e8ff !important; box-shadow: 0 0 6px rgba(255,255,255,.6); }
input:focus + .slider{ box-shadow: 0 0 0 3px rgba(168,85,247,.35) !important; }

/* ---------- Key list helpers ---------- */
.key-sensi{ filter: blur(3px); }

/* Links */
a{ color: var(--p-primary-2); }
a:hover{ color: var(--p-accent); text-shadow: 0 0 8px rgba(232,121,249,.5); }

/* Headings */
h1,h2,h3,h4,h5,h6{ color: var(--p-text); letter-spacing:.2px; }
hr{ border-color: var(--p-border) !important; opacity:.6; }

/* SweetAlert tweak */
.swal2-popup{ background: #1a0f2e !important; color: var(--p-text) !important; border:1px solid var(--p-border); }
.swal2-title, .swal2-html-container{ color: var(--p-text) !important; }