/* Modern skin for the admin console. Purely visual: scoped to .admin-modern, no layout/behaviour changes. */
div.admin-modern{
  background:
    radial-gradient(900px 420px at 100% -8%, rgba(108,20,255,.10), transparent 60%),
    radial-gradient(700px 380px at 0% 110%, rgba(56,189,248,.07), transparent 60%),
    #f5f4fb;
  color:#1b1638;
}

/* ---------- sidebar ---------- */
.admin-modern aside{
  background:linear-gradient(190deg,#140c33 0%,#1c1250 55%,#241466 100%);
  border-color:rgba(255,255,255,.06)!important;
  box-shadow:6px 0 30px -12px rgba(20,12,51,.45);
}
.admin-modern aside .border-slate-200,
.admin-modern aside .border-b,
.admin-modern aside .border-t{border-color:rgba(255,255,255,.09)!important}
.admin-modern aside .text-slate-900,
.admin-modern aside .text-slate-800,
.admin-modern aside .text-black{color:#fff!important}
.admin-modern aside .text-\[\#6c14ff\]{color:#b9a2ff!important}
.admin-modern aside .text-slate-400{color:#8f86c4!important}
.admin-modern aside nav button{border:1px solid transparent}
.admin-modern aside nav button:not(.bg-\[\#6c14ff\]){color:#cdc6f2!important;background:transparent}
.admin-modern aside nav button:not(.bg-\[\#6c14ff\]):hover{background:rgba(255,255,255,.08)!important;color:#fff!important;border-color:rgba(255,255,255,.08)}
.admin-modern aside nav button.bg-\[\#6c14ff\]{
  background:linear-gradient(135deg,#8b5cf6 0%,#6c14ff 100%)!important;
  color:#fff!important;
  box-shadow:0 10px 24px -8px rgba(124,58,237,.75), inset 0 1px 0 rgba(255,255,255,.25)!important;
}
.admin-modern aside nav button .bg-slate-100{background:rgba(255,255,255,.1)!important;color:#dcd6ff!important}
.admin-modern aside nav button.bg-\[\#6c14ff\] span.font-mono{background:rgba(255,255,255,.22)!important;color:#fff!important}
.admin-modern aside button.text-slate-400:hover{background:rgba(255,255,255,.08)!important}
.admin-modern aside .text-slate-600{color:#bdb5ec!important}
.admin-modern aside .text-slate-600:hover{color:#fff!important}
.admin-modern aside .bg-rose-500\/10{background:rgba(244,63,94,.14)!important;border-color:rgba(251,113,133,.35)!important}
.admin-modern aside .text-rose-600{color:#fda4af!important}

/* ---------- header ---------- */
.admin-modern header{
  position:sticky;top:0;z-index:20;
  background:rgba(255,255,255,.72)!important;
  backdrop-filter:saturate(180%) blur(14px);-webkit-backdrop-filter:saturate(180%) blur(14px);
  border-color:rgba(108,20,255,.10)!important;
}
.admin-modern header h1{color:#150d3a;letter-spacing:-.02em}
.admin-modern header h1 span{
  background:linear-gradient(135deg,#8b5cf6,#6c14ff)!important;
  box-shadow:0 6px 16px -6px rgba(108,20,255,.6);
  letter-spacing:.02em;
}
.admin-modern header button{border-radius:12px;transition:all .18s ease}
.admin-modern header button:hover{box-shadow:0 6px 16px -8px rgba(21,13,58,.35)}

/* ---------- cards ---------- */
.admin-modern main .bg-white.rounded-2xl,
.admin-modern main .bg-white.rounded-3xl,
.admin-modern main .bg-white.rounded-xl{
  border-color:rgba(108,20,255,.09)!important;
  box-shadow:0 1px 2px rgba(21,13,58,.04), 0 12px 32px -18px rgba(21,13,58,.22)!important;
  transition:box-shadow .2s ease,border-color .2s ease;
}
.admin-modern main .bg-white.rounded-2xl:hover{
  border-color:rgba(108,20,255,.22)!important;
  box-shadow:0 1px 2px rgba(21,13,58,.05), 0 18px 40px -18px rgba(108,20,255,.35)!important;
}
.admin-modern main .shadow-2xl{box-shadow:0 1px 2px rgba(21,13,58,.04), 0 12px 32px -18px rgba(21,13,58,.22)!important}

/* stat cards (top row) */
.admin-modern main > div.grid > div{position:relative;overflow:hidden;padding-top:1.15rem}
.admin-modern main > div.grid > div::before{
  content:"";position:absolute;left:0;top:0;right:0;height:3px;
  background:linear-gradient(90deg,#8b5cf6,#6c14ff);
}
.admin-modern main > div.grid > div:nth-child(2)::before{background:linear-gradient(90deg,#34d399,#10b981)}
.admin-modern main > div.grid > div:nth-child(3)::before{background:linear-gradient(90deg,#fb7185,#e11d48)}
.admin-modern main > div.grid > div:nth-child(4)::before{background:linear-gradient(90deg,#38bdf8,#0ea5e9)}
.admin-modern main > div.grid > div:nth-child(5)::before{background:linear-gradient(90deg,#fbbf24,#f59e0b)}
.admin-modern main > div.grid > div p.text-2xl{letter-spacing:-.02em}

/* ---------- tables ---------- */
.admin-modern table{border-collapse:separate;border-spacing:0}
.admin-modern thead tr{background:linear-gradient(180deg,#faf9ff,#f3f0ff)!important;border-color:#e8e3ff!important}
.admin-modern thead th{color:#7d76a8!important;font-size:11px;letter-spacing:.09em;border-bottom:1px solid #e8e3ff}
.admin-modern tbody tr{transition:background .15s ease}
.admin-modern tbody tr:hover{background:#faf8ff}
.admin-modern tbody td{border-color:#f0ecff}
.admin-modern tbody tr.border-b,.admin-modern tbody .border-slate-200{border-color:#f0ecff!important}

/* ---------- forms & buttons ---------- */
.admin-modern input:not([type=checkbox]):not([type=radio]),
.admin-modern select,
.admin-modern textarea{
  border-radius:12px;background-color:#fbfaff!important;border-color:#e4dfff!important;
  transition:border-color .15s ease, box-shadow .15s ease, background-color .15s ease;
}
.admin-modern input:focus,.admin-modern select:focus,.admin-modern textarea:focus{
  background-color:#fff!important;border-color:#8b5cf6!important;
  box-shadow:0 0 0 4px rgba(108,20,255,.12)!important;outline:none;
}
.admin-modern main button.bg-\[\#6c14ff\]{
  background:linear-gradient(135deg,#8b5cf6,#6c14ff)!important;
  box-shadow:0 10px 22px -10px rgba(108,20,255,.7)!important;
  transition:filter .15s ease, box-shadow .15s ease;
}
.admin-modern main button.bg-\[\#6c14ff\]:hover{filter:brightness(1.06)}
.admin-modern main button{transition:background-color .15s ease,color .15s ease,border-color .15s ease,box-shadow .15s ease,filter .15s ease}

/* ---------- entrance (opacity only, so fixed modals are unaffected) ---------- */
@keyframes admin-fade{from{opacity:0}to{opacity:1}}
.admin-modern main > div:not(.grid){animation:admin-fade .28s ease both}

/* ---------- scrollbars ---------- */
.admin-modern ::-webkit-scrollbar{height:8px;width:8px}
.admin-modern ::-webkit-scrollbar-thumb{background:#d6cffb;border-radius:999px}
.admin-modern ::-webkit-scrollbar-thumb:hover{background:#b9aef5}

/* ---------- phones/tablets: nav becomes a swipeable pill bar ---------- */
@media (max-width:1023px){
  .admin-modern aside{padding:12px 12px 14px;box-shadow:0 10px 30px -14px rgba(20,12,51,.6)}
  .admin-modern aside nav{display:flex;gap:8px;overflow-x:auto;padding:2px 2px 8px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .admin-modern aside nav::-webkit-scrollbar{display:none}
  .admin-modern aside nav > *{margin:0!important}
  .admin-modern aside nav button{width:auto!important;flex:none;white-space:nowrap;padding:.6rem .95rem;border-radius:999px;font-size:13px;background:rgba(255,255,255,.06)}
  .admin-modern aside nav button > div{gap:.5rem}
  .admin-modern aside > div:last-child{margin-top:4px;padding-top:10px;display:flex;gap:8px;align-items:center}
  .admin-modern aside > div:last-child > *{flex:1}
  .admin-modern header{position:static}
}
@media (max-width:640px){
  .admin-modern main{padding:14px}
  .admin-modern header h1{font-size:1.25rem}
}

/* backup restore file picker */
.evl-restore-file{display:block;width:100%;font-size:12px;color:#475569;padding:10px;border:1px dashed #c4b5fd;border-radius:12px;background:#faf7ff}
.evl-restore-file::file-selector-button{margin-right:12px;padding:8px 14px;border:0;border-radius:10px;background:#6c14ff;color:#fff;font-weight:700;cursor:pointer}
