*{
margin:0;
padding:0;
box-sizing:border-box;
}

body{
font-family:'Inter',sans-serif;
background:
radial-gradient(circle at 15% 20%, rgba(37,99,235,0.25), transparent 40%),
radial-gradient(circle at 85% 0%, rgba(212,175,55,0.2), transparent 40%),
#020617;
color:white;
}

/* NAV */
.nav{
display:flex;
justify-content:space-between;
padding:22px 70px;
border-bottom:1px solid rgba(255,255,255,0.08);
}

.left{
display:flex;
gap:12px;
align-items:center;
}

.logo{
width:40px;
height:40px;
border-radius:50%;
background:linear-gradient(#d4af37,#f5e6a8);
display:flex;
align-items:center;
justify-content:center;
color:black;
font-weight:600;
box-shadow:0 0 15px rgba(212,175,55,0.6);
}

.brand{
font-size:14px;
letter-spacing:2px;
}

.sub{
font-size:11px;
opacity:.6;
}

.admin{
border:1px solid rgba(255,255,255,0.2);
padding:8px 16px;
border-radius:8px;
text-decoration:none;
color:white;
}

/* HERO */
.hero{
text-align:center;
margin-top:90px;
}

.pill{
padding:6px 16px;
border-radius:20px;
border:1px solid rgba(255,255,255,0.15);
font-size:11px;
letter-spacing:2px;
display:inline-block;
margin-bottom:25px;
}

h1{
font-family:'Playfair Display',serif;
font-size:68px;
letter-spacing:1.5px;
background:linear-gradient(#f5e6a8,#d4af37);
-webkit-background-clip:text;
-webkit-text-fill-color:transparent;
text-shadow:0 10px 40px rgba(212,175,55,0.4);
}

h2{
font-family:'Playfair Display',serif;
font-size:40px;
letter-spacing:6px;
color:#d1d5db;
}

.desc{
width:600px;
margin:20px auto;
opacity:.7;
line-height:1.7;
}

/* STATS */
.stats{
display:flex;
justify-content:center;
gap:80px;
margin-top:30px;
}

.stats span{
color:#f5e6a8;
font-size:28px;
text-shadow:0 0 12px rgba(212,175,55,0.6);
}

/* CARDS */
.cards{
display:flex;
justify-content:center;
gap:40px;
margin-top:100px;
flex-wrap:wrap;
}

.card{
width:420px;
padding:32px;
border-radius:20px;
background:linear-gradient(180deg, rgba(255,255,255,0.05), rgba(255,255,255,0.02));
backdrop-filter:blur(20px);
border:1px solid rgba(255,255,255,0.12);
box-shadow:
0 10px 40px rgba(0,0,0,0.6),
inset 0 1px rgba(255,255,255,0.2);
position:relative;
transition:0.4s;
}

.card:hover{
transform:translateY(-8px);
}

/* GLOW LINES */
.gold-card::after{
content:"";
position:absolute;
left:0;
top:20%;
width:3px;
height:60%;
background:linear-gradient(#f5e6a8,#d4af37);
box-shadow:0 0 20px rgba(212,175,55,0.9);
}

.blue-card::after{
content:"";
position:absolute;
right:0;
top:20%;
width:3px;
height:60%;
background:linear-gradient(#60a5fa,#2563eb);
box-shadow:0 0 20px rgba(59,130,246,1);
}

/* CARD HEAD */
.card-head{
display:flex;
align-items:center;
gap:10px;
margin-bottom:12px;
}

/* SVG ICONS */
.icon{
width:18px;
height:18px;
stroke-width:1.6;
fill:none;
stroke-linecap:round;
stroke-linejoin:round;
}

.icon.gold{
stroke:#f5e6a8;
filter:drop-shadow(0 0 6px rgba(212,175,55,0.5));
}

.icon.blue{
stroke:#60a5fa;
filter:drop-shadow(0 0 6px rgba(59,130,246,0.6));
}

/* TEXT */
.card h3{
font-family:'Playfair Display',serif;
letter-spacing:2px;
margin-bottom:10px;
}

.gold-card h3{
color:#f5e6a8;
}

.blue-card h3{
color:#60a5fa;
}

.card p{
opacity:.6;
margin-bottom:20px;
}

label{
font-size:11px;
letter-spacing:1px;
opacity:.6;
}

input{
width:100%;
padding:12px;
margin:6px 0 16px;
border-radius:8px;
background:#020617;
border:1px solid rgba(255,255,255,0.1);
color:white;
}

/* BUTTONS */
.btn-gold{
width:100%;
padding:14px;
border:none;
border-radius:12px;
background:linear-gradient(#d4af37,#f5e6a8);
color:black;
box-shadow:0 0 20px rgba(212,175,55,0.6);
transition:.3s;
position:relative;
overflow:hidden;
}

.btn-gold:hover{
box-shadow:0 0 40px rgba(212,175,55,1);
transform:translateY(-2px);
}

.btn-gold::after{
content:"";
position:absolute;
top:0;
left:-100%;
width:100%;
height:100%;
background:linear-gradient(120deg,transparent,rgba(255,255,255,0.4),transparent);
transition:0.5s;
}

.btn-gold:hover::after{
left:100%;
}

.btn-blue{
width:100%;
padding:14px;
border:none;
border-radius:12px;
background:linear-gradient(#0ea5e9,#2563eb);
color:white;
box-shadow:0 0 20px rgba(59,130,246,0.7);
}

.btn-blue:hover{
box-shadow:0 0 40px rgba(59,130,246,1);
transform:translateY(-2px);
}

/* RESULT */
.result{
width:500px;
margin:40px auto;
padding:20px;
border-radius:14px;
text-align:center;
}

.success{
border:1px solid #22c55e;
box-shadow:0 0 20px rgba(34,197,94,0.5);
}

.error{
border:1px solid red;
box-shadow:0 0 20px rgba(255,0,0,0.5);
}

/* FOOTER */
footer{
text-align:center;
margin-top:120px;
opacity:.5;
font-size:12px;
}

/* ADMIN PAGE */
.admin-wrapper{
display:flex;
justify-content:center;
align-items:center;
height:80vh;
}

.admin-card{
width:420px;
padding:40px;
border-radius:22px;

background:linear-gradient(180deg, rgba(255,255,255,0.05), rgba(255,255,255,0.02));
backdrop-filter:blur(25px);

border:1px solid rgba(255,255,255,0.12);

box-shadow:
0 0 0 1px rgba(212,175,55,0.25),
0 0 25px rgba(212,175,55,0.25),
0 20px 60px rgba(0,0,0,0.8),
inset 0 1px rgba(255,255,255,0.2);

transition:0.4s;
}

.admin-card:hover{
transform:translateY(-6px);
}

.admin-icon{
width:70px;
height:70px;
border-radius:50%;
margin:0 auto 20px;
display:flex;
align-items:center;
justify-content:center;
background:rgba(212,175,55,0.1);
border:1px solid rgba(212,175,55,0.3);
box-shadow:0 0 25px rgba(212,175,55,0.6);
}

.admin-icon svg{
width:24px;
height:24px;
stroke:#d4af37;
stroke-width:1.6;
fill:none;
}

.admin-title{
font-family:'Playfair Display',serif;
text-align:center;
font-size:28px;
letter-spacing:2px;
background:linear-gradient(#f5e6a8,#d4af37);
-webkit-background-clip:text;
-webkit-text-fill-color:transparent;
}

.admin-sub{
text-align:center;
opacity:.6;
margin-bottom:20px;
}

.divider{
height:1px;
background:rgba(255,255,255,0.1);
margin:20px 0;
}

.password-box{
position:relative;
}

.eye{
position:absolute;
right:12px;
top:50%;
transform:translateY(-50%);
width:18px;
height:18px;
stroke:rgba(255,255,255,0.6);
stroke-width:1.6;
fill:none;
cursor:pointer;
}

.eye:hover{
stroke:white;
}

.admin-note{
text-align:center;
margin-top:20px;
font-size:12px;
opacity:.5;
}

/* STARS */
canvas{
position:fixed;
top:0;
left:0;
z-index:-1;
}

/* MOBILE */
@media(max-width:768px){
.cards{
flex-direction:column;
align-items:center;
}

.desc{
width:90%;
}

.stats{
flex-direction:column;
gap:20px;
}
}

/* DASHBOARD */
.dashboard{
padding:60px 80px;
}

.section-title{
font-size:13px;
letter-spacing:3px;
opacity:.6;
margin-bottom:20px;
}

/* OVERVIEW */
.overview-cards{
display:flex;
gap:25px;
margin-bottom:40px;
}

.ov-card{
flex:1;
padding:28px;
border-radius:16px;
text-align:center;
background:rgba(255,255,255,0.03);
border:1px solid rgba(255,255,255,0.1);
}

.ov-card h2{
font-size:34px;
font-family:'Playfair Display',serif;
}

.ov-card p{
font-size:11px;
letter-spacing:2px;
opacity:.6;
}

.ov-card.gold h2{color:#f5e6a8;}
.ov-card.blue h2{color:#38bdf8;}
.ov-card.purple h2{color:#c084fc;}

/* GRID */
.dashboard-grid{
display:grid;
grid-template-columns: 420px 1fr;
gap:30px;
}

/* DROP ZONE */
.drop-zone{
border:1px dashed rgba(255,255,255,0.2);
padding:40px;
text-align:center;
border-radius:12px;
margin-bottom:20px;
opacity:.7;
}

.drop-zone span{
font-size:12px;
opacity:.5;
}

.csv-box{
background:#020617;
padding:15px;
border-radius:10px;
margin-bottom:20px;
font-size:12px;
opacity:.7;
}

/* TABLE */
.table{
margin-top:20px;
}

.table-head, .table-row{
display:grid;
grid-template-columns: 1fr 2fr 1.5fr 1fr 1fr 1fr;
padding:12px;
align-items:center;
}

.table-head{
font-size:11px;
letter-spacing:2px;
opacity:.6;
border-bottom:1px solid rgba(255,255,255,0.1);
}

.table-row{
border-bottom:1px solid rgba(255,255,255,0.05);
font-size:14px;
}

/* TEXT COLORS */
.gold-text{color:#f5e6a8;}
.blue-text{color:#22d3ee;}

/* BADGES */
.badge{
padding:4px 10px;
border-radius:10px;
font-size:11px;
letter-spacing:1px;
}

.badge.gold{
background:rgba(212,175,55,0.15);
color:#f5e6a8;
}

.badge.blue{
background:rgba(56,189,248,0.15);
color:#38bdf8;
}

/* FILTER */
.filter{
background:#020617;
border:1px solid rgba(255,255,255,0.1);
padding:6px 10px;
border-radius:8px;
color:white;
}

/* ================= PREMIUM UPGRADE ================= */

/* FLOATING ANIMATION */
@keyframes float {
  0% { transform: translateY(0px); }
  50% { transform: translateY(-6px); }
  100% { transform: translateY(0px); }
}

/* CARD HOVER */
.card:hover{
transform: translateY(-10px) scale(1.01);
box-shadow: 0 20px 60px rgba(0,0,0,0.8);
}

/* GLOW PULSE */
@keyframes glowPulseGold {
0%,100% { box-shadow:0 0 20px rgba(212,175,55,0.3);}
50% { box-shadow:0 0 40px rgba(212,175,55,0.8);}
}

@keyframes glowPulseBlue {
0%,100% { box-shadow:0 0 20px rgba(59,130,246,0.3);}
50% { box-shadow:0 0 40px rgba(59,130,246,0.9);}
}

.gold-card{
animation: glowPulseGold 3s infinite ease-in-out;
}

.blue-card{
animation: glowPulseBlue 3s infinite ease-in-out;
}

/* OVERVIEW FLOAT */
.ov-card{
transition:0.4s;
}

.ov-card:hover{
transform: translateY(-8px);
animation: float 3s ease-in-out infinite;
}

/* TABLE ROW HOVER */
.table-row{
position:relative;
overflow:hidden;
transition:0.3s;
}

.table-row:hover{
background: rgba(255,255,255,0.03);
transform: scale(1.01);
}

/* SHINE EFFECT */
.table-row::after{
content:"";
position:absolute;
top:0;
left:-100%;
width:100%;
height:100%;
background:linear-gradient(120deg, transparent, rgba(255,255,255,0.2), transparent);
transition:0.5s;
}

.table-row:hover::after{
left:100%;
}

/* BUTTON RIPPLE GLOW */
.btn-gold, .btn-blue{
position:relative;
overflow:hidden;
}

.btn-gold::after,
.btn-blue::after{
content:"";
position:absolute;
width:300%;
height:300%;
top:-100%;
left:-100%;
background: radial-gradient(circle, rgba(255,255,255,0.3) 0%, transparent 60%);
opacity:0;
transition:0.5s;
}

.btn-gold:hover::after,
.btn-blue:hover::after{
opacity:1;
top:-50%;
left:-50%;
}

/* DROP ZONE PREMIUM */
.drop-zone{
transition:0.4s;
cursor:pointer;
}

.drop-zone:hover{
border-color:#f5e6a8;
box-shadow:0 0 30px rgba(212,175,55,0.4);
transform:scale(1.02);
}

/* BACKGROUND MOTION */
body::before{
content:"";
position:fixed;
top:0;
left:0;
width:200%;
height:200%;
background: radial-gradient(circle at 30% 30%, rgba(59,130,246,0.1), transparent 40%),
            radial-gradient(circle at 70% 60%, rgba(212,175,55,0.1), transparent 40%);
animation: moveBg 20s linear infinite;
z-index:-2;
}

@keyframes moveBg{
0%{transform:translate(0,0);}
50%{transform:translate(-10%,-10%);}
100%{transform:translate(0,0);}
}

.upload-box{
border:2px dashed rgba(212,175,55,0.4);
border-radius:16px;
padding:40px;
text-align:center;
margin-top:20px;
cursor:pointer;
transition:0.3s;
position:relative;
}

.upload-box:hover{
border-color:#f5e6a8;
box-shadow:0 0 20px rgba(212,175,55,0.3);
}

.upload-box.dragover{
background:rgba(212,175,55,0.08);
border-color:#f5e6a8;
box-shadow:0 0 30px rgba(212,175,55,0.6);
}

.upload-icon{
stroke:#f5e6a8;
fill:none;
stroke-width:1.5;
margin-bottom:10px;
}

.upload-sub{
opacity:.5;
font-size:12px;
}

@keyframes spin {
  0% { transform:rotate(0deg); }
  100% { transform:rotate(360deg); }
}

@keyframes fadeUp {
  from {
    transform: translateY(30px);
    opacity:0;
  }
  to {
    transform: translateY(0);
    opacity:1;
  }
}

/* ===== CARD WRAPPER ===== */
#resultBox > div{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:40px;
  padding:40px 20px;
}

/* ===== CARD ===== */
.cert-card{
  width:420px;
  padding:28px;
  border-radius:20px;
  position:relative;

  /* GLASS */
  background:rgba(15,23,42,0.55);
  backdrop-filter:blur(18px);

  border:1px solid rgba(250,204,21,0.25);

  box-shadow:
    0 0 40px rgba(250,204,21,0.15),
    inset 0 0 40px rgba(0,0,0,0.6);

  transition:0.35s;
}

/* ===== CORNERS ===== */
.corner{
  position:absolute;
  width:22px;
  height:22px;
  border:2px solid #facc15;
}

.corner.tl{
  top:10px;
  left:10px;
  border-right:none;
  border-bottom:none;
}

.corner.br{
  bottom:10px;
  right:10px;
  border-left:none;
  border-top:none;
}

/* ===== HEADER ===== */
.cert-head{
  display:flex;
  justify-content:space-between;
  align-items:center;
}

.cert-label{
  font-size:11px;
  letter-spacing:3px;
  opacity:.6;
}

.cert-badge{
  padding:6px 14px;
  border-radius:20px;
  font-size:11px;
}

.cert-badge.gold{
  border:1px solid #facc15;
  color:#facc15;
}

.cert-badge.blue{
  border:1px solid #22d3ee;
  color:#22d3ee;
}

/* ===== TITLE ===== */
.cert-title{
  font-family:'Playfair Display';
  font-size:26px;
  color:#facc15;
  margin-top:8px;
}

/* ===== DIVIDER ===== */
.divider{
  height:1px;
  background:rgba(255,255,255,0.08);
  margin:18px 0;
}

/* ===== BODY ===== */
.cert-sub{
  text-align:center;
  font-size:11px;
  letter-spacing:3px;
  opacity:.6;
}

.cert-name{
  text-align:center;
  font-family:'Playfair Display';
  font-size:34px;
  margin:10px 0;

  background:linear-gradient(90deg,#facc15,#fff,#facc15);
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
}

.cert-email{
  text-align:center;
  opacity:.5;
  font-size:13px;
}

/* ===== DETAILS ===== */
.cert-details{
  display:flex;
  justify-content:space-between;
  margin-top:10px;
}

.cert-details span{
  font-size:10px;
  opacity:.5;
}

.cert-details p{
  font-size:13px;
  margin-top:3px;
}

.blue{color:#22d3ee;}
.gold{color:#facc15;}

/* ===== BUTTONS ===== */
.cert-actions{
  display:flex;
  gap:12px;
  margin-top:20px;
}

.btn-download{
  flex:1;
  text-align:center;
  padding:10px;
  border-radius:10px;
  background:#facc15;
  color:black;
  font-weight:600;
  text-decoration:none;
  box-shadow:0 0 20px rgba(250,204,21,0.4);
}

.btn-view{
  flex:1;
  padding:10px;
  border-radius:10px;
  border:1px solid #22d3ee;
  background:transparent;
  color:#22d3ee;
  cursor:pointer;
}

/* ===== HOVER ===== */
.cert-card:hover{
  transform:translateY(-6px) scale(1.02);
  box-shadow:
    0 0 80px rgba(250,204,21,0.25),
    0 0 30px rgba(34,211,238,0.2);
}
/* ===== POSITION RESULT CENTER ===== */
#resultBox{
  width:100%;
  display:flex;
  flex-direction:column;
  align-items:center;
}

/* SEARCH TITLE CENTER */
#resultBox h2{
  text-align:center !important;
  padding:0 !important;
}

/* CARD GRID CENTER */
#resultBox > div{
  width:100%;
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:40px;
  padding:40px 20px !important;
}

/* LOADING CENTER */
.loading-center{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  padding:80px 0;
}

/* VERIFY BOX SMOOTH */
#resultBox > div{
  animation:fadeUp 0.4s ease;
}

/* ================= MOBILE FULL FIX ================= */
@media (max-width:768px){

/* NAV */
.nav{
  padding:16px 20px;
}

.brand{font-size:12px;}
.sub{font-size:10px;}

/* HERO */
.hero{
  margin-top:60px;
  padding:0 15px;
}

h1{
  font-size:36px;
}

h2{
  font-size:20px;
  letter-spacing:3px;
}

.desc{
  width:100%;
  font-size:14px;
}

/* STATS STACK */
.stats{
  flex-direction:column;
  gap:15px;
}

.stats span{
  font-size:22px;
}

/* CARDS STACK */
.cards{
  flex-direction:column;
  align-items:center;
  gap:20px;
  margin-top:60px;
}

.card{
  width:100%;
  max-width:350px;
  padding:24px;
}

/* INPUT */
input{
  padding:10px;
}

/* BUTTONS */
.btn-gold, .btn-blue{
  padding:12px;
  font-size:14px;
}

/* RESULT BOX */
#resultBox{
  padding:0 10px;
}

/* CARD GRID */
#resultBox > div{
  flex-direction:column;
  align-items:center;
  padding:20px 10px !important;
}

/* CERT CARD */
.cert-card{
  width:100%;
  max-width:340px;
  padding:20px;
}

/* CERT TEXT */
.cert-title{
  font-size:20px;
}

.cert-name{
  font-size:24px;
}

.cert-email{
  font-size:12px;
}

/* DETAILS STACK */
.cert-details{
  flex-direction:column;
  gap:10px;
}

/* BUTTON STACK */
.cert-actions{
  flex-direction:column;
}

.btn-download,
.btn-view{
  width:100%;
  font-size:14px;
}

/* SEARCH TITLE */
#resultBox h2{
  font-size:16px;
  letter-spacing:2px;
}

/* VERIFY / SUCCESS BOX */
.result{
  width:100%;
  max-width:320px;
}

/* MODAL */
#previewModal > div{
  width:95% !important;
  padding:15px !important;
}

#previewFrame{
  height:350px !important;
}

/* FOOTER */
footer{
  padding:20px;
  font-size:11px;
}

}
/* ================= ADMIN MOBILE ONLY ================= */
@media (max-width: 768px){

.admin-page .nav{
  padding:15px 20px;
  flex-direction:column;
  gap:15px;
  align-items:flex-start;
}

.admin-page section{
  padding:30px 20px !important;
}

/* OVERVIEW CARDS STACK */
.admin-page section > div{
  flex-direction:column !important;
  gap:20px !important;
}

/* MAIN SECTION STACK */
.admin-page section[style*="display:flex"]{
  flex-direction:column !important;
  padding:30px 20px !important;
}

/* LEFT PANEL */
.admin-page .card[style*="width:420px"]{
  width:100% !important;
}

/* RIGHT PANEL */
.admin-page .card.blue-card{
  width:100%;
}

/* UPLOAD BOX */
.admin-page #uploadBox{
  padding:25px !important;
}

/* TABLE SCROLL FIX */
.admin-page table{
  display:block;
  width:100%;
  overflow-x:auto;
  white-space:nowrap;
}

/* TABLE TEXT */
.admin-page table th,
.admin-page table td{
  font-size:12px;
  padding:8px;
}

/* BUTTON */
.admin-page .btn-gold{
  padding:12px;
  font-size:14px;
}

/* CARD SPACING */
.admin-page .card{
  padding:20px !important;
}

/* TEXT SCALE */
.admin-page .card h1{
  font-size:28px !important;
}

}

/* EXTRA SMALL */
@media (max-width: 480px){

.admin-page .card h1{
  font-size:24px !important;
}

.admin-page .brand{
  font-size:12px;
}

.admin-page .sub{
  font-size:10px;
}

}
.success-box{
  padding:18px;
  border-radius:14px;
  border:1px solid rgba(34,197,94,0.4);
  background:rgba(34,197,94,0.08);
  box-shadow:0 0 25px rgba(34,197,94,0.2);
  animation:fadeUp 0.4s ease;
}

.error-box{
  padding:18px;
  border-radius:14px;
  border:1px solid rgba(239,68,68,0.4);
  background:rgba(239,68,68,0.08);
  box-shadow:0 0 25px rgba(239,68,68,0.2);
  animation:fadeUp 0.4s ease;
}

.status-title{
  font-weight:600;
  margin-bottom:6px;
}

.status-msg{
  font-size:13px;
  opacity:.8;
}

.success-msg{
background:rgba(34,197,94,0.15);
border:1px solid #22c55e;
color:#22c55e;
}

.error-msg{
background:rgba(239,68,68,0.15);
border:1px solid #ef4444;
color:#ef4444;
}

/* ===== ADMIN FORM ONLY ===== */
.admin-form-card{
margin-top:30px;
padding:25px;
border-radius:16px;
background:linear-gradient(145deg,#020617,#050b17);
box-shadow:0 0 30px rgba(56,189,248,0.08);
}

.admin-form-title{
color:#38bdf8;
margin-bottom:15px;
letter-spacing:1px;
}

/* GRID */
.admin-grid-2{
display:grid;
grid-template-columns:1fr 1fr;
gap:15px;
}

/* INPUT */
.admin-input{
width:100%;
padding:12px 14px;
margin-top:12px;
background:#020617;
color:white;
border-radius:10px;
border:1px solid rgba(255,255,255,0.1);
transition:0.3s;
}

.admin-input:focus{
outline:none;
border-color:#38bdf8;
box-shadow:0 0 10px rgba(56,189,248,0.3);
}

/* BUTTON */
.admin-btn-glow{
width:100%;
margin-top:18px;
padding:14px;
border:none;
border-radius:10px;
background:linear-gradient(90deg,#38bdf8,#22d3ee);
color:#020617;
font-weight:600;
letter-spacing:1px;
cursor:pointer;
transition:0.3s;
}

.admin-btn-glow:hover{
transform:translateY(-2px);
box-shadow:0 0 20px rgba(56,189,248,0.5);
}

/* TOAST */
#adminToast{
position:fixed;
bottom:30px;
right:30px;
padding:14px 20px;
border-radius:10px;
color:white;
font-size:14px;
opacity:0;
pointer-events:none;
transform:translateY(20px);
transition:0.4s;
z-index:999;
}

#adminToast.show{
opacity:1;
transform:translateY(0);
}

.admin-toast-success{
background:#22c55e;
box-shadow:0 0 20px rgba(34,197,94,0.4);
}

.admin-toast-error{
background:#ef4444;
box-shadow:0 0 20px rgba(239,68,68,0.4);
}

/* MOBILE */
@media(max-width:768px){
.admin-grid-2{
grid-template-columns:1fr;
}
}
/* ===== COSMIC PAGINATION ===== */

.admin-pagination{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:20px;
  margin-top:30px;
  padding:12px 20px;

  background:rgba(2,6,23,0.6);
  backdrop-filter:blur(12px);

  border:1px solid rgba(56,189,248,0.15);
  border-radius:12px;

  box-shadow:
    0 0 25px rgba(56,189,248,0.08),
    inset 0 0 20px rgba(250,204,21,0.05);
}

/* BUTTONS */
.admin-pagination button{
  padding:10px 18px;
  border-radius:10px;
  border:1px solid rgba(56,189,248,0.3);

  background:linear-gradient(135deg,#020617,#0f172a);
  color:#38bdf8;

  font-size:13px;
  letter-spacing:1px;

  cursor:pointer;
  transition:all 0.3s ease;
}

/* HOVER GLOW */
.admin-pagination button:hover{
  background:linear-gradient(135deg,#38bdf8,#22d3ee);
  color:#020617;

  box-shadow:
    0 0 15px rgba(56,189,248,0.7),
    0 0 30px rgba(34,211,238,0.4);
}

/* DISABLED */
.admin-pagination button:disabled{
  opacity:0.3;
  cursor:not-allowed;
  box-shadow:none;
}

/* PAGE TEXT */
#pageInfo{
  font-size:14px;
  letter-spacing:2px;
  font-family:'Playfair Display';

  background:linear-gradient(90deg,#facc15,#fff,#facc15);
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;

  text-shadow:0 0 15px rgba(250,204,21,0.3);
}

.admin-modal{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,0.7);
  display:none;
  justify-content:center;
  align-items:center;
  z-index:999;
}

.admin-modal-box{
  background:#020617;
  padding:30px;
  border-radius:14px;
  width:350px;

  border:1px solid rgba(56,189,248,0.2);

  box-shadow:
    0 0 40px rgba(56,189,248,0.2),
    inset 0 0 20px rgba(250,204,21,0.05);
}

.admin-btn-cancel{
  padding:10px;
  border:none;
  border-radius:8px;
  background:#ef4444;
  color:white;
  cursor:pointer;
}

.admin-edit-btn{
  padding:6px 12px;
  border-radius:8px;
  border:1px solid rgba(250,204,21,0.4);

  background:linear-gradient(135deg,#020617,#0f172a);
  color:#facc15;

  font-size:12px;
  letter-spacing:1px;
  cursor:pointer;

  transition:all 0.3s ease;
}

.admin-edit-btn:hover{
  background:#facc15;
  color:#020617;

  box-shadow:
    0 0 12px rgba(250,204,21,0.7),
    0 0 25px rgba(250,204,21,0.4);
}

.admin-modal{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,0.7);
  display:none;
  justify-content:center;
  align-items:center;
  z-index:999;
}

.admin-modal-box{
  background:#020617;
  padding:30px;
  border-radius:14px;
  width:350px;

  border:1px solid rgba(56,189,248,0.2);

  box-shadow:
    0 0 40px rgba(56,189,248,0.2),
    inset 0 0 20px rgba(250,204,21,0.05);
}

.admin-btn-cancel{
  padding:10px;
  border:none;
  border-radius:8px;
  background:#ef4444;
  color:white;
  cursor:pointer;
}