/* ══════════════════════════════════════════════
   admin-premium.css — v11 admin layer (loaded last)
   Premium finish for the login page & dashboard.
══════════════════════════════════════════════ */

/* ── Shared refinement ─────────────────────── */
body{letter-spacing:-.011em;text-rendering:optimizeLegibility;}
::selection{background:rgba(239,68,68,.4);color:#fff;}
::-webkit-scrollbar{width:9px;}
::-webkit-scrollbar-track{background:#060404;}
::-webkit-scrollbar-thumb{background:linear-gradient(180deg,#ef4444,#f97316,#7f1d1d);border-radius:999px;border:2px solid #060404;}
h1,h2,h3{text-wrap:balance;}

/* ── LOGIN — deeper aurora, glass, motion ──── */
.login-wrap{position:relative;isolation:isolate;}
.login-wrap::before{
  content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:radial-gradient(46% 38% at 18% 12%,rgba(239,68,68,.2),transparent 70%),
             radial-gradient(40% 34% at 85% 85%,rgba(249,115,22,.14),transparent 70%);
  animation:auroraShift 16s ease-in-out infinite alternate;
}
@keyframes auroraShift{from{opacity:.75;transform:translateY(0)}to{opacity:1;transform:translateY(-14px)}}

.login-card{
  border-radius:28px;
  box-shadow:0 1px 0 rgba(255,255,255,.08) inset,0 44px 90px -40px rgba(0,0,0,.95),0 0 70px -30px rgba(239,68,68,.35);
  transition:box-shadow .6s var(--ease),transform .6s var(--ease);
}
.login-card:hover{box-shadow:0 1px 0 rgba(255,255,255,.1) inset,0 50px 100px -40px rgba(0,0,0,.95),0 0 90px -28px rgba(239,68,68,.5);}

.login-art{
  background:radial-gradient(120% 80% at 0% 0%,rgba(239,68,68,.42),transparent 60%),
             radial-gradient(90% 70% at 100% 100%,rgba(249,115,22,.3),transparent 60%),
             radial-gradient(70% 60% at 60% 45%,rgba(251,191,36,.08),transparent 70%),rgba(0,0,0,.32);
}
.login-art::before{filter:blur(16px);opacity:.9}

.art-title{
  font-size:clamp(1.9rem,3.6vw,2.75rem);
  letter-spacing:-.03em;line-height:1.08;
}
.art-sub{font-size:.96rem;color:#d4d4d8;}
.art-brand{letter-spacing:-.02em;}

.pill{
  transition:transform .45s cubic-bezier(.34,1.56,.64,1),border-color .4s,background .4s,box-shadow .4s;
}
.pill:hover{
  transform:translateY(-3px);border-color:rgba(239,68,68,.5);
  background:rgba(239,68,68,.1);box-shadow:0 10px 26px -12px rgba(239,68,68,.55);
}

/* Login form */
.login h1{letter-spacing:-.03em;}
.login{padding:2.8rem 2.6rem;}
label{letter-spacing:.1em;}
.inp input{transition:border-color .35s,box-shadow .35s,background .35s,transform .35s var(--ease);}
.inp:focus-within input{transform:translateY(-1px);}
input:focus,select:focus{
  border-color:rgba(239,68,68,.7);
  box-shadow:0 0 0 4px rgba(239,68,68,.16),0 14px 34px -20px rgba(239,68,68,.6);
}

.btn{letter-spacing:-.01em;}
.btn:hover{box-shadow:0 22px 46px -12px rgba(239,68,68,.9);}
.back{transition:color .3s,transform .35s var(--ease);}
.back:hover{transform:translateX(-3px);}

/* ── DASHBOARD — richer cards & panels ─────── */
header.top{
  background:rgba(7,3,3,.8);
  box-shadow:0 20px 44px -34px rgba(0,0,0,.9);
}
.brand img{transition:transform .5s cubic-bezier(.34,1.56,.64,1),box-shadow .5s;}
.brand:hover img{transform:rotate(-8deg) scale(1.08);box-shadow:0 0 26px rgba(239,68,68,.55);}

.greet h1{letter-spacing:-.03em;}
.clock{transition:border-color .4s,box-shadow .4s;}
.clock:hover{border-color:rgba(239,68,68,.4);box-shadow:0 12px 32px -18px rgba(239,68,68,.5);}

.hero-total{
  border-radius:26px;
  transition:transform .55s var(--ease),box-shadow .55s var(--ease);
}
.hero-total:hover{
  transform:translateY(-4px);
  box-shadow:0 40px 80px -40px rgba(0,0,0,.95),0 0 70px -26px rgba(239,68,68,.5);
}
.hero-total::after{height:2.5px}

.stat{
  border-radius:20px;
  transition:transform .5s var(--ease),border-color .4s,box-shadow .5s!important;
}
.stat:hover{
  transform:translateY(-4px);
  box-shadow:0 24px 48px -26px rgba(0,0,0,.9),0 0 40px -18px rgba(239,68,68,.4);
}

.panel{border-radius:24px;}
.ph h2{letter-spacing:-.02em;}

/* Form polish */
.amt-inp input{transition:border-color .35s,box-shadow .35s;}
.amt-inp:focus-within input{
  box-shadow:0 0 0 4px rgba(239,68,68,.16),0 14px 34px -20px rgba(239,68,68,.6);
}
.quick button{transition:all .35s var(--ease);}
.quick button:active{transform:scale(.92);}

/* Chart bars — richer glow */
.bar span{
  background:linear-gradient(180deg,var(--amber),var(--orange) 42%,var(--red));
  box-shadow:0 0 22px rgba(239,68,68,.4);
  transition:height 1.1s cubic-bezier(.2,.8,.2,1),filter .35s;
}
.bar:hover span{filter:brightness(1.28) saturate(1.1);}
.bar.sel span{
  box-shadow:0 0 34px rgba(249,115,22,.85);
}

/* History list */
.item{
  border-radius:18px;
  transition:border-color .35s,transform .45s var(--ease),background .35s,box-shadow .45s!important;
}
.item:hover{
  transform:translateX(6px);
  box-shadow:0 16px 36px -22px rgba(0,0,0,.9),0 0 30px -16px rgba(239,68,68,.5);
}
.money{letter-spacing:.01em;}
.del{transition:all .3s var(--ease);}
.del:active{transform:scale(.85);}

/* Live badge */
.live{letter-spacing:.06em;text-transform:uppercase;font-size:.68rem;}

/* Toast — gradient border already; add glow */
.toast{box-shadow:0 24px 50px -14px rgba(0,0,0,.9),0 0 40px -14px rgba(239,68,68,.55);}

/* ── Responsive polish ─────────────────────── */
@media (max-width:1000px){
  .stat:hover{transform:translateY(-3px);}
}
@media (max-width:780px){
  .login{padding:2rem 1.7rem 2.2rem;}
  .art-title{font-size:1.55rem;}
}
@media (max-width:600px){
  .login-art{padding:1.7rem 1.5rem;}
  .hero-total{border-radius:22px;}
  .item:hover{transform:none;}
  .btn:hover{transform:none;}
}
@media (prefers-reduced-motion:reduce){
  .login-wrap::before,.login-card::after,.login-art .ring{animation:none!important;}
}
