@import url('https://fonts.googleapis.com/css2?family=Rajdhani:wght@400;500;600;700&family=Inter:wght@300;400;500;600&display=swap');

:root {
  --bg:        #080812;
  --bg2:       #0d0d1e;
  --bg-card:   #12122a;
  --cyan:      #00e5ff;
  --purple:    #7c3aed;
  --yellow:    #ffd700;
  --green:     #00ff88;
  --red:       #ff4444;
  --text:      #e0e0f0;
  --muted:     #8888aa;
  --border:    rgba(0,229,255,.15);
  --border2:   rgba(0,229,255,.35);
  --glow-c:    0 0 20px rgba(0,229,255,.35);
  --glow-p:    0 0 20px rgba(124,58,237,.35);
}

*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:'Inter',sans-serif;background:var(--bg);color:var(--text);min-height:100vh;overflow-x:hidden}

::-webkit-scrollbar{width:5px}
::-webkit-scrollbar-track{background:var(--bg2)}
::-webkit-scrollbar-thumb{background:var(--purple);border-radius:3px}

h1,h2,h3,h4,h5{font-family:'Rajdhani',sans-serif}

/* ── Utilities ── */
.container{max-width:1200px;margin:0 auto;padding:0 20px}
.text-cyan{color:var(--cyan)}.text-yellow{color:var(--yellow)}.text-green{color:var(--green)}.text-red{color:var(--red)}.text-muted{color:var(--muted)}
.mt-1{margin-top:8px}.mt-2{margin-top:16px}.mt-3{margin-top:24px}.mt-4{margin-top:32px}
.mb-1{margin-bottom:8px}.mb-2{margin-bottom:16px}.mb-3{margin-bottom:24px}.mb-4{margin-bottom:32px}
.flex{display:flex}.flex-center{display:flex;align-items:center}.gap-1{gap:8px}.gap-2{gap:16px}.gap-3{gap:24px}
.justify-between{justify-content:space-between}.justify-center{justify-content:center}
.w-full{width:100%}.text-center{text-align:center}.text-right{text-align:right}
.section{padding:60px 0}.section-sm{padding:40px 0}

/* Gradient text */
.grad-text{background:linear-gradient(135deg,var(--cyan),var(--purple));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.neon{color:var(--cyan);text-shadow:0 0 10px var(--cyan),0 0 30px rgba(0,229,255,.4)}

/* ── Header ── */
.site-header{background:rgba(8,8,18,.96);backdrop-filter:blur(20px);border-bottom:1px solid var(--border);position:sticky;top:0;z-index:1000;padding:12px 0}
.hdr{display:flex;align-items:center;gap:16px}
.logo{font-family:'Rajdhani',sans-serif;font-size:24px;font-weight:700;text-decoration:none;background:linear-gradient(135deg,var(--cyan),var(--purple));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;white-space:nowrap;line-height:1.1}
.logo small{display:block;font-size:9px;letter-spacing:2px;-webkit-text-fill-color:var(--muted);margin-top:-2px}
.main-nav{display:flex;gap:2px;flex:1}
.main-nav a{color:var(--muted);text-decoration:none;padding:8px 14px;border-radius:8px;font-size:13.5px;font-weight:500;transition:all .2s;display:flex;align-items:center;gap:6px}
.main-nav a:hover,.main-nav a.active{color:var(--cyan);background:rgba(0,229,255,.08)}
.hdr-actions{display:flex;align-items:center;gap:10px;margin-left:auto}
.avatar{width:34px;height:34px;border-radius:50%;background:linear-gradient(135deg,var(--cyan),var(--purple));display:flex;align-items:center;justify-content:center;font-weight:700;font-size:13px;color:#fff}

/* ── Buttons ── */
.btn{display:inline-flex;align-items:center;gap:8px;padding:10px 20px;border-radius:10px;font-size:13.5px;font-weight:600;cursor:pointer;text-decoration:none;border:none;transition:all .25s;white-space:nowrap;font-family:'Inter',sans-serif}
.btn-primary{background:linear-gradient(135deg,var(--cyan),#0088aa);color:#000;box-shadow:0 4px 15px rgba(0,229,255,.3)}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 6px 25px rgba(0,229,255,.5);color:#000}
.btn-outline{background:transparent;border:1px solid var(--border);color:var(--text)}
.btn-outline:hover{border-color:var(--cyan);color:var(--cyan);background:rgba(0,229,255,.05)}
.btn-purple{background:linear-gradient(135deg,var(--purple),#5b21b6);color:#fff;box-shadow:0 4px 15px rgba(124,58,237,.3)}
.btn-purple:hover{transform:translateY(-2px);box-shadow:0 6px 25px rgba(124,58,237,.5);color:#fff}
.btn-danger{background:rgba(255,68,68,.12);border:1px solid rgba(255,68,68,.35);color:var(--red)}
.btn-danger:hover{background:rgba(255,68,68,.25)}
.btn-success{background:rgba(0,255,136,.12);border:1px solid rgba(0,255,136,.35);color:var(--green)}
.btn-success:hover{background:rgba(0,255,136,.25)}
.btn-sm{padding:6px 12px;font-size:12px;border-radius:7px}
.btn-lg{padding:14px 32px;font-size:16px;border-radius:12px}
.btn-block{width:100%;justify-content:center}

/* ── Hero ── */
.hero{padding:90px 0 70px;text-align:center;position:relative;overflow:hidden}
.hero::before{content:'';position:absolute;top:-20%;left:50%;transform:translateX(-50%);width:700px;height:500px;background:radial-gradient(ellipse,rgba(0,229,255,.07) 0%,transparent 70%);pointer-events:none}
.hero-title{font-size:clamp(38px,7vw,76px);font-weight:700;line-height:1.05;margin-bottom:20px}
.hero-sub{font-size:17px;color:var(--muted);margin-bottom:40px;max-width:560px;margin-left:auto;margin-right:auto;line-height:1.7}
.hero-btns{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin-bottom:60px}
.hero-stats{display:flex;justify-content:center;gap:50px;padding-top:40px;border-top:1px solid var(--border);flex-wrap:wrap}
.stat-item{text-align:center}
.stat-val{font-family:'Rajdhani',sans-serif;font-size:38px;font-weight:700;color:var(--cyan)}
.stat-lbl{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:1px;margin-top:2px}

/* ── Section title ── */
.sec-title{font-family:'Rajdhani',sans-serif;font-size:26px;font-weight:700;margin-bottom:24px;display:flex;align-items:center;gap:14px}
.sec-title::after{content:'';flex:1;height:1px;background:linear-gradient(90deg,var(--border),transparent)}

/* ── Category cards ── */
.cat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:20px;margin-bottom:60px}
.cat-card{background:var(--bg-card);border:1px solid var(--border);border-radius:16px;padding:28px;text-decoration:none;color:var(--text);transition:all .3s;display:flex;flex-direction:column;gap:10px;position:relative;overflow:hidden}
.cat-card::before{content:'';position:absolute;top:0;right:0;width:60px;height:60px;background:radial-gradient(circle,rgba(0,229,255,.12),transparent);border-radius:0 16px 0 80px}
.cat-card:hover{border-color:var(--cyan);box-shadow:var(--glow-c);transform:translateY(-4px);color:var(--text)}
.cat-icon-lg{font-size:44px;line-height:1}
.cat-name{font-family:'Rajdhani',sans-serif;font-size:20px;font-weight:700}
.cat-desc{font-size:12.5px;color:var(--muted);line-height:1.55}
.cat-tag{display:inline-flex;align-items:center;background:rgba(0,229,255,.1);border:1px solid rgba(0,229,255,.2);color:var(--cyan);padding:3px 10px;border-radius:20px;font-size:11px;font-weight:600}

/* ── Product cards ── */
.products-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:20px}
.product-card{background:var(--bg-card);border:1px solid var(--border);border-radius:16px;overflow:hidden;transition:all .3s;display:flex;flex-direction:column}
.product-card:hover{border-color:rgba(124,58,237,.5);box-shadow:var(--glow-p);transform:translateY(-4px)}
.product-img{height:150px;background:linear-gradient(135deg,#1a1a3a,#0d0d1e);display:flex;align-items:center;justify-content:center;font-size:60px;position:relative;overflow:hidden}
.product-img img{width:100%;height:100%;object-fit:cover}
.product-body{padding:18px;flex:1;display:flex;flex-direction:column}
.product-cat{font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:1px;color:var(--purple);margin-bottom:7px}
.product-name{font-family:'Rajdhani',sans-serif;font-size:17px;font-weight:600;color:var(--text);margin-bottom:6px;line-height:1.3}
.product-price{font-family:'Rajdhani',sans-serif;font-size:26px;font-weight:700;color:var(--yellow)}
.product-stock{font-size:11.5px;color:var(--muted);margin:6px 0 14px}
.product-stock.ok{color:var(--green)}.product-stock.low{color:var(--red)}
.product-footer{margin-top:auto}

/* ── Product detail ── */
.pd-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:start}
.pd-image{background:var(--bg-card);border:1px solid var(--border);border-radius:16px;height:300px;display:flex;align-items:center;justify-content:center;font-size:100px}
.pd-price{font-family:'Rajdhani',sans-serif;font-size:52px;font-weight:700;color:var(--yellow)}
.pd-desc{font-size:14px;color:var(--muted);line-height:1.7}
.qty-input{display:flex;align-items:center;gap:10px}
.qty-btn{background:var(--bg2);border:1px solid var(--border);color:var(--text);width:36px;height:36px;border-radius:8px;cursor:pointer;font-size:18px;display:flex;align-items:center;justify-content:center;transition:.2s}
.qty-btn:hover{border-color:var(--cyan);color:var(--cyan)}
.qty-num{width:50px;text-align:center;background:var(--bg-card);border:1px solid var(--border);color:var(--text);padding:8px;border-radius:8px;font-size:16px;font-family:'Rajdhani',sans-serif;font-weight:700}

/* ── Forms ── */
.form-group{margin-bottom:18px}
.form-label{display:block;font-size:12px;font-weight:600;color:var(--muted);margin-bottom:7px;text-transform:uppercase;letter-spacing:.5px}
.form-control{width:100%;padding:11px 15px;background:rgba(13,13,30,.8);border:1px solid var(--border);border-radius:10px;color:var(--text);font-size:14px;transition:.2s;outline:none;font-family:'Inter',sans-serif}
.form-control:focus{border-color:var(--cyan);box-shadow:0 0 0 3px rgba(0,229,255,.1)}
.form-control::placeholder{color:var(--muted)}
textarea.form-control{resize:vertical;min-height:110px}
select.form-control{cursor:pointer;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%238888aa' d='M6 8L0 0h12z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 13px center;padding-right:35px}

/* ── Auth pages ── */
.auth-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:40px 20px;background:radial-gradient(ellipse at top,rgba(0,229,255,.06) 0%,transparent 60%)}
.auth-card{background:var(--bg-card);border:1px solid var(--border);border-radius:20px;padding:44px 38px;width:100%;max-width:430px}
.auth-title{font-size:30px;margin-bottom:6px}
.auth-sub{color:var(--muted);font-size:13.5px;margin-bottom:28px}
.divider{height:1px;background:var(--border);margin:20px 0}

/* ── Alerts ── */
.alert{padding:13px 16px;border-radius:10px;font-size:13.5px;margin-bottom:18px;display:flex;align-items:center;gap:10px}
.alert-success{background:rgba(0,255,136,.08);border:1px solid rgba(0,255,136,.3);color:var(--green)}
.alert-error{background:rgba(255,68,68,.08);border:1px solid rgba(255,68,68,.3);color:var(--red)}
.alert-warning{background:rgba(255,184,0,.08);border:1px solid rgba(255,184,0,.3);color:#ffb800}
.alert-info{background:rgba(0,229,255,.08);border:1px solid rgba(0,229,255,.3);color:var(--cyan)}

/* ── Badges ── */
.badge{display:inline-flex;align-items:center;gap:4px;padding:3px 10px;border-radius:20px;font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.5px}
.badge-pending{background:rgba(255,184,0,.12);color:#ffb800;border:1px solid rgba(255,184,0,.3)}
.badge-paid{background:rgba(0,255,136,.12);color:var(--green);border:1px solid rgba(0,255,136,.3)}
.badge-expired{background:rgba(255,68,68,.12);color:var(--red);border:1px solid rgba(255,68,68,.3)}
.badge-active{background:rgba(0,229,255,.12);color:var(--cyan);border:1px solid rgba(0,229,255,.3)}
.badge-inactive{background:rgba(136,136,170,.12);color:var(--muted);border:1px solid rgba(136,136,170,.3)}
.badge-admin{background:rgba(124,58,237,.12);color:var(--purple);border:1px solid rgba(124,58,237,.3)}
.badge-user{background:rgba(0,229,255,.08);color:var(--cyan);border:1px solid rgba(0,229,255,.2)}

/* ── Breadcrumb ── */
.breadcrumb{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--muted);margin-bottom:22px}
.breadcrumb a{color:var(--muted);text-decoration:none;transition:.2s}
.breadcrumb a:hover{color:var(--cyan)}
.breadcrumb-sep{opacity:.4}

/* ── Payment page ── */
.pay-card{background:var(--bg-card);border:1px solid var(--border);border-radius:20px;overflow:hidden}
.pay-hdr{padding:22px 28px;background:linear-gradient(135deg,rgba(0,229,255,.08),rgba(124,58,237,.08));border-bottom:1px solid var(--border)}
.pay-body{padding:28px}
.bank-box{background:rgba(0,229,255,.04);border:1px solid rgba(0,229,255,.2);border-radius:14px;padding:22px;margin-bottom:18px}
.bank-row{display:flex;justify-content:space-between;align-items:center;padding:9px 0;border-bottom:1px solid rgba(255,255,255,.04)}
.bank-row:last-child{border-bottom:none}
.bank-lbl{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.5px}
.bank-val{font-weight:600;display:flex;align-items:center;gap:8px}
.bank-val.hl{color:var(--yellow);font-family:'Rajdhani',sans-serif;font-size:20px}
.bank-val.code{color:var(--cyan);font-family:'Rajdhani',sans-serif;font-size:18px;letter-spacing:2px}
.copy-btn{background:none;border:1px solid var(--border);color:var(--muted);padding:4px 8px;border-radius:6px;cursor:pointer;font-size:11px;transition:.2s}
.copy-btn:hover{border-color:var(--cyan);color:var(--cyan)}
.copy-btn.copied{border-color:var(--green);color:var(--green)}
.countdown{text-align:center;padding:18px;background:rgba(255,68,68,.05);border:1px solid rgba(255,68,68,.2);border-radius:12px;margin-bottom:18px}
.countdown-lbl{font-size:11px;color:var(--muted);margin-bottom:6px}
.countdown-time{font-family:'Rajdhani',sans-serif;font-size:44px;font-weight:700;color:var(--red);letter-spacing:4px}
.pay-status{text-align:center;padding:28px 20px}
.status-icon{font-size:60px;display:block;margin-bottom:14px}
.anim-pulse{animation:pulse 2s infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.4}}
.delivered-box{background:rgba(0,0,0,.5);border:1px solid rgba(0,255,136,.2);border-radius:12px;padding:16px;font-family:'Courier New',monospace;font-size:12.5px}
.del-item{color:var(--green);padding:7px 10px;background:rgba(0,255,136,.04);border-radius:6px;margin-bottom:5px;display:flex;align-items:center;justify-content:space-between;word-break:break-all}

/* ── Orders list ── */
.order-card{background:var(--bg-card);border:1px solid var(--border);border-radius:14px;padding:18px 22px;margin-bottom:14px;display:grid;grid-template-columns:auto 1fr auto;gap:18px;align-items:center;transition:.2s;text-decoration:none;color:var(--text)}
.order-card:hover{border-color:var(--border2);color:var(--text)}
.order-icon{font-size:32px;width:54px;height:54px;display:flex;align-items:center;justify-content:center;background:rgba(124,58,237,.1);border-radius:12px;flex-shrink:0}
.order-name{font-size:15px;font-weight:600;margin-bottom:4px}
.order-meta{font-size:11.5px;color:var(--muted);display:flex;gap:12px;flex-wrap:wrap}
.order-price{font-family:'Rajdhani',sans-serif;font-size:22px;font-weight:700;color:var(--yellow);text-align:right;white-space:nowrap}

/* ── Tables ── */
.table-wrap{overflow-x:auto}
table{width:100%;border-collapse:collapse}
th{text-align:left;padding:11px 15px;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:1px;color:var(--muted);border-bottom:1px solid var(--border);white-space:nowrap}
td{padding:13px 15px;border-bottom:1px solid rgba(255,255,255,.03);font-size:13.5px;vertical-align:middle}
tr:hover td{background:rgba(255,255,255,.015)}
tr:last-child td{border-bottom:none}

/* ── Cards ── */
.card{background:var(--bg-card);border:1px solid var(--border);border-radius:14px;padding:22px}
.card-title{font-family:'Rajdhani',sans-serif;font-size:18px;font-weight:700;margin-bottom:16px;display:flex;align-items:center;gap:10px}

/* ── Pagination ── */
.pagination{display:flex;justify-content:center;gap:8px;margin-top:36px;flex-wrap:wrap}
.page-btn{padding:8px 15px;border-radius:8px;text-decoration:none;font-size:13.5px;font-weight:500;border:1px solid var(--border);color:var(--muted);transition:.2s}
.page-btn:hover,.page-btn.active{border-color:var(--cyan);color:var(--cyan);background:rgba(0,229,255,.07)}

/* ── Footer ── */
.site-footer{background:var(--bg2);border-top:1px solid var(--border);padding:40px 0 20px;margin-top:auto}
.footer-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:36px;margin-bottom:28px}
.footer-brand p{font-size:12.5px;color:var(--muted);margin-top:10px;line-height:1.6}
.footer-links h4{font-size:11px;text-transform:uppercase;letter-spacing:2px;color:var(--muted);margin-bottom:14px}
.footer-links ul{list-style:none;display:flex;flex-direction:column;gap:8px}
.footer-links a{color:var(--muted);text-decoration:none;font-size:13.5px;transition:.2s}
.footer-links a:hover{color:var(--cyan)}
.footer-bottom{padding-top:18px;border-top:1px solid var(--border);display:flex;justify-content:space-between;align-items:center;font-size:12.5px;color:var(--muted);flex-wrap:wrap;gap:10px}

/* ── Success overlay ── */
.success-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.92);z-index:9999;align-items:center;justify-content:center;flex-direction:column;gap:20px;text-align:center;padding:20px}
.success-overlay.show{display:flex;animation:fadeIn .3s ease}
.success-circle{width:100px;height:100px;background:rgba(0,255,136,.1);border:2px solid var(--green);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:52px;animation:scaleIn .5s cubic-bezier(.175,.885,.32,1.275)}
.success-items{background:rgba(0,0,0,.6);border:1px solid rgba(0,255,136,.3);border-radius:14px;padding:20px;width:100%;max-width:500px;font-family:monospace;font-size:13px;color:var(--green);line-height:1.8;word-break:break-all;max-height:300px;overflow-y:auto;text-align:left}

@keyframes scaleIn{from{transform:scale(0);opacity:0}to{transform:scale(1);opacity:1}}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
@keyframes fadeInUp{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
@keyframes glow{0%,100%{box-shadow:0 0 5px var(--cyan),0 0 20px rgba(0,229,255,.3)}50%{box-shadow:0 0 12px var(--cyan),0 0 40px rgba(0,229,255,.5)}}

.anim-fade-up{animation:fadeInUp .6s ease both}
.anim-glow{animation:glow 2.5s ease infinite}
.d1{animation-delay:.1s}.d2{animation-delay:.2s}.d3{animation-delay:.3s}

/* ── ADMIN LAYOUT ── */
.admin-wrap{display:flex;min-height:100vh}
.admin-sidebar{width:250px;background:var(--bg2);border-right:1px solid var(--border);position:fixed;top:0;left:0;height:100vh;display:flex;flex-direction:column;z-index:100;overflow-y:auto}
.sb-logo{padding:22px 18px;border-bottom:1px solid var(--border)}
.sb-logo a{font-family:'Rajdhani',sans-serif;font-size:20px;font-weight:700;text-decoration:none;background:linear-gradient(135deg,var(--cyan),var(--purple));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.sb-logo small{display:block;font-size:9px;letter-spacing:2px;color:var(--muted);-webkit-text-fill-color:var(--muted);margin-top:2px}
.sb-section{padding:18px 10px;flex:1}
.sb-lbl{font-size:9.5px;font-weight:700;text-transform:uppercase;letter-spacing:2px;color:var(--muted);padding:0 8px;margin:14px 0 7px}
.sb-item{display:flex;align-items:center;gap:11px;padding:10px 12px;border-radius:9px;text-decoration:none;color:var(--muted);font-size:13.5px;font-weight:500;transition:.2s;margin-bottom:2px}
.sb-item:hover{color:var(--text);background:rgba(255,255,255,.05)}
.sb-item.active{color:var(--cyan);background:rgba(0,229,255,.09)}
.sb-icon{width:18px;text-align:center;font-size:15px}
.admin-main-wrap{margin-left:250px;flex:1;display:flex;flex-direction:column}
.admin-topbar{padding:14px 28px;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;background:var(--bg)}
.admin-topbar h1{font-size:20px;font-weight:700}
.admin-body{padding:28px;flex:1}

/* Admin stat cards */
.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:18px;margin-bottom:28px}
.stat-card{background:var(--bg-card);border:1px solid var(--border);border-radius:13px;padding:22px;position:relative;overflow:hidden}
.stat-card::after{content:attr(data-icon);position:absolute;top:16px;right:16px;font-size:26px;opacity:.3}
.stat-card-val{font-family:'Rajdhani',sans-serif;font-size:38px;font-weight:700;color:var(--cyan)}
.stat-card-lbl{font-size:12px;color:var(--muted);margin-top:2px}
.stat-card.revenue .stat-card-val{color:var(--yellow)}
.stat-card.orders .stat-card-val{color:var(--purple)}
.stat-card.pending .stat-card-val{color:#ffb800}

/* Admin table card */
.table-card{background:var(--bg-card);border:1px solid var(--border);border-radius:14px;overflow:hidden}
.table-card-hdr{padding:18px 22px;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between}
.table-card-title{font-family:'Rajdhani',sans-serif;font-size:17px;font-weight:700;display:flex;align-items:center;gap:10px}

/* Admin form card */
.form-card{background:var(--bg-card);border:1px solid var(--border);border-radius:14px;padding:28px}
.form-card-title{font-family:'Rajdhani',sans-serif;font-size:20px;font-weight:700;margin-bottom:24px;padding-bottom:16px;border-bottom:1px solid var(--border)}

/* Stock items */
.stock-item-row td{font-family:monospace;font-size:12.5px}
.stock-item-data{max-width:400px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--green)}
.stock-tag-sold{background:rgba(255,68,68,.12);color:var(--red);border:1px solid rgba(255,68,68,.3);padding:2px 8px;border-radius:12px;font-size:11px;font-weight:600}
.stock-tag-avail{background:rgba(0,255,136,.12);color:var(--green);border:1px solid rgba(0,255,136,.3);padding:2px 8px;border-radius:12px;font-size:11px;font-weight:600}

/* ── Product tags ── */
.product-tags{display:flex;flex-wrap:wrap;gap:4px;margin-bottom:7px}
.tag-badge{display:inline-flex;align-items:center;padding:2px 8px;border-radius:20px;font-size:10px;font-weight:700;letter-spacing:.3px;background:rgba(124,58,237,.15);border:1px solid rgba(124,58,237,.35);color:#a78bfa}
.tag-badge:nth-child(3n+1){background:rgba(0,229,255,.1);border-color:rgba(0,229,255,.3);color:var(--cyan)}
.tag-badge:nth-child(3n+2){background:rgba(255,214,0,.1);border-color:rgba(255,214,0,.3);color:var(--yellow)}
.tag-badge:nth-child(3n+3){background:rgba(124,58,237,.15);border-color:rgba(124,58,237,.35);color:#a78bfa}

/* ── Search form ── */
.search-form{display:flex;align-items:center;gap:0;background:rgba(13,13,30,.8);border:1px solid var(--border);border-radius:10px;overflow:hidden;transition:.2s;min-width:200px}
.search-form:focus-within{border-color:var(--cyan);box-shadow:0 0 0 3px rgba(0,229,255,.1)}
.search-input{background:transparent;border:none;color:var(--text);font-size:13px;padding:8px 12px;outline:none;width:180px;font-family:'Inter',sans-serif}
.search-input::placeholder{color:var(--muted)}
.search-btn{background:rgba(0,229,255,.1);border:none;border-left:1px solid var(--border);color:var(--cyan);padding:8px 12px;cursor:pointer;font-size:12px;font-weight:600;font-family:'Inter',sans-serif;transition:.2s;white-space:nowrap}
.search-btn:hover{background:rgba(0,229,255,.2)}

/* ── Sort bar ── */
.sort-bar{display:flex;align-items:center;gap:8px;margin-bottom:24px;flex-wrap:wrap}
.sort-btn{display:inline-flex;align-items:center;padding:6px 14px;border-radius:20px;font-size:12px;font-weight:600;text-decoration:none;border:1px solid var(--border);color:var(--muted);transition:.2s}
.sort-btn:hover,.sort-btn.active{border-color:var(--cyan);color:var(--cyan);background:rgba(0,229,255,.08)}

/* ══════════════════════════════════════════════
   CICODE — Ticker bar
   ══════════════════════════════════════════════ */
.ticker-bar{display:flex;align-items:center;height:36px;overflow:hidden;border-bottom:1px solid rgba(0,229,255,.1);background:rgba(0,0,0,.25);backdrop-filter:blur(4px)}
.ticker-label{height:100%;display:flex;align-items:center;padding:0 16px;font-size:10px;font-weight:800;letter-spacing:2px;white-space:nowrap;flex-shrink:0;text-transform:uppercase}
.ticker-wrap{flex:1;overflow:hidden;position:relative;height:100%;display:flex;align-items:center}
.ticker-inner{display:flex;width:max-content;animation:tickerScroll 25s linear infinite;font-size:13px;font-weight:500;letter-spacing:.3px}
.ticker-item{padding:0 80px;white-space:nowrap}
@keyframes tickerScroll{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}

/* ══════════════════════════════════════════════
   CICODE — Branded success overlay
   ══════════════════════════════════════════════ */
.so-cicode{background:rgba(5,5,18,.97);backdrop-filter:blur(24px)}
.so-brand{display:flex;align-items:center;gap:8px;margin-bottom:28px;padding:8px 18px;background:rgba(0,229,255,.06);border:1px solid rgba(0,229,255,.15);border-radius:20px}
.so-brand-name{font-family:'Rajdhani',sans-serif;font-size:17px;font-weight:700;color:var(--text)}
.so-brand-name span{background:linear-gradient(135deg,var(--cyan),var(--purple));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.so-ring{width:96px;height:96px;border-radius:50%;background:linear-gradient(135deg,rgba(0,229,255,.12),rgba(124,58,237,.12));border:2px solid rgba(0,229,255,.4);display:flex;align-items:center;justify-content:center;font-size:46px;box-shadow:0 0 40px rgba(0,229,255,.25),0 0 80px rgba(0,229,255,.1);animation:soRing .6s cubic-bezier(.175,.885,.32,1.275);margin-bottom:20px;position:relative}
.so-ring::before{content:'';position:absolute;inset:-8px;border-radius:50%;border:1px solid rgba(0,229,255,.15);animation:soRingPulse 2s ease-in-out infinite}
.so-ring::after{content:'';position:absolute;inset:-16px;border-radius:50%;border:1px solid rgba(0,229,255,.07);animation:soRingPulse 2s ease-in-out infinite .4s}
@keyframes soRing{from{opacity:0;transform:scale(.4)}to{opacity:1;transform:scale(1)}}
@keyframes soRingPulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:0;transform:scale(1.3)}}
.so-amount{font-family:'Rajdhani',sans-serif;font-size:54px;font-weight:700;background:linear-gradient(135deg,var(--yellow),#ff8c00,var(--yellow));background-size:200%;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:shimmerAmt 2s linear infinite;margin-bottom:6px}
@keyframes shimmerAmt{0%{background-position:0%}100%{background-position:200%}}
.so-title{font-family:'Rajdhani',sans-serif;font-size:26px;font-weight:700;color:var(--text);margin-bottom:6px}
.so-sub{color:var(--muted);font-size:14px;margin-bottom:20px}
.so-divider{width:160px;height:1px;background:linear-gradient(90deg,transparent,rgba(0,229,255,.3),transparent);margin-bottom:20px}

/* ══════════════════════════════════════════════
   CICODE — Logo & Branding
   ══════════════════════════════════════════════ */
.logo-wrap{display:flex;align-items:center;gap:10px;text-decoration:none;flex-shrink:0}
.logo-mark{width:38px;height:38px;filter:drop-shadow(0 0 8px rgba(0,229,255,.35));transition:.35s}
.logo-wrap:hover .logo-mark{filter:drop-shadow(0 0 16px rgba(0,229,255,.7)) drop-shadow(0 0 30px rgba(124,58,237,.4))}
.logo-name{font-family:'Rajdhani',sans-serif;font-size:21px;font-weight:700;color:var(--text);line-height:1;letter-spacing:.5px}
.logo-name span{background:linear-gradient(135deg,var(--cyan),var(--purple));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.logo-domain{font-size:8.5px;letter-spacing:2.5px;color:var(--muted);text-transform:uppercase;margin-top:1px;opacity:.7}

/* ══════════════════════════════════════════════
   CICODE — Hero decorations
   ══════════════════════════════════════════════ */
.hero{position:relative;overflow:hidden}
.hero::after{content:'';position:absolute;inset:0;background-image:linear-gradient(rgba(0,229,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(0,229,255,.035) 1px,transparent 1px);background-size:44px 44px;pointer-events:none;-webkit-mask-image:radial-gradient(ellipse 75% 75% at 50% 40%,black 30%,transparent 100%);mask-image:radial-gradient(ellipse 75% 75% at 50% 40%,black 30%,transparent 100%)}
.hero-orb{position:absolute;border-radius:50%;pointer-events:none}
.hero-orb-1{width:600px;height:600px;background:radial-gradient(circle,rgba(0,229,255,.09) 0%,transparent 65%);top:-200px;left:-150px;animation:orbFloat 11s ease-in-out infinite}
.hero-orb-2{width:500px;height:500px;background:radial-gradient(circle,rgba(124,58,237,.1) 0%,transparent 65%);bottom:-150px;right:-120px;animation:orbFloat 14s ease-in-out infinite reverse}
.hero-orb-3{width:300px;height:300px;background:radial-gradient(circle,rgba(255,214,0,.05) 0%,transparent 70%);top:50%;left:50%;transform:translate(-50%,-50%);animation:orbFloat 9s ease-in-out infinite 2s}
@keyframes orbFloat{0%,100%{transform:translate(0,0)}33%{transform:translate(25px,-20px)}66%{transform:translate(-20px,15px)}}

/* Hero badge */
.hero-badge{display:inline-flex;align-items:center;gap:8px;padding:6px 16px;border-radius:20px;background:rgba(0,229,255,.07);border:1px solid rgba(0,229,255,.25);color:var(--cyan);font-size:12px;font-weight:600;letter-spacing:.5px;margin-bottom:24px}
.hero-badge-dot{width:7px;height:7px;background:var(--green);border-radius:50%;animation:pulse 2s infinite;flex-shrink:0}

/* ══════════════════════════════════════════════
   CICODE — Card enhancements
   ══════════════════════════════════════════════ */
/* Shimmer sweep on category cards */
.cat-card{position:relative;overflow:hidden}
.cat-card::after{content:'';position:absolute;top:0;left:-120%;width:70%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.04),transparent);transform:skewX(-15deg);transition:.7s;pointer-events:none}
.cat-card:hover::after{left:150%}

/* Glow border on product cards */
.product-card::before{content:'';position:absolute;inset:-1px;border-radius:17px;background:linear-gradient(135deg,var(--cyan),var(--purple));opacity:0;transition:.35s;z-index:-1;pointer-events:none}
.product-card{position:relative;z-index:0}
.product-card:hover::before{opacity:.25}

/* ══════════════════════════════════════════════
   CICODE — Header glow line
   ══════════════════════════════════════════════ */
.site-header{border-bottom:1px solid var(--border);box-shadow:0 1px 0 0 rgba(0,229,255,.06),0 4px 20px rgba(0,0,0,.4)}

/* ══════════════════════════════════════════════
   CICODE — Footer
   ══════════════════════════════════════════════ */
.site-footer{border-top:1px solid var(--border);padding:50px 0 24px;margin-top:60px;background:linear-gradient(180deg,transparent,rgba(0,229,255,.015))}
.footer-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:40px;margin-bottom:36px}
.footer-brand .logo-wrap{margin-bottom:12px}
.footer-links h4{font-family:'Rajdhani',sans-serif;font-size:14px;font-weight:700;color:var(--text);margin-bottom:12px;letter-spacing:.5px}
.footer-links ul{list-style:none}
.footer-links ul li{margin-bottom:8px}
.footer-links ul a{color:var(--muted);text-decoration:none;font-size:13px;transition:.2s;display:flex;align-items:center;gap:6px}
.footer-links ul a:hover{color:var(--cyan)}
.footer-bottom{border-top:1px solid var(--border);padding-top:20px;display:flex;justify-content:space-between;align-items:center;font-size:12px;color:var(--muted)}

/* ══════════════════════════════════════════════
   CICODE — Fade-in animations
   ══════════════════════════════════════════════ */
@keyframes fadeUp{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}
.anim-fade-up{animation:fadeUp .7s ease forwards}
.d1{animation-delay:.15s}.d2{animation-delay:.3s}.d3{animation-delay:.45s}

/* ══════════════════════════════════════════════
   CICODE — Section title accent
   ══════════════════════════════════════════════ */
.sec-title{position:relative}

/* ── Responsive ── */
@media(max-width:900px){
  .main-nav{display:none}
  .pd-grid{grid-template-columns:1fr}
  .admin-sidebar{display:none}
  .admin-main-wrap{margin-left:0}
}
@media(max-width:768px){
  .footer-grid{grid-template-columns:1fr 1fr;gap:24px}
}
@media(max-width:600px){
  .hero-stats{gap:24px}
  .footer-grid{grid-template-columns:1fr}
  .order-card{grid-template-columns:auto 1fr;grid-template-rows:auto auto}
  .order-price{grid-column:2;text-align:left}
  .footer-bottom{flex-direction:column;text-align:center;gap:10px}
  .hero-btns{flex-direction:column;align-items:center}
  .logo-name{font-size:18px}
  .logo-domain{font-size:7.5px}
}

/* ── Product Badges ── */
.prod-badge{position:absolute;top:10px;left:10px;z-index:10;padding:4px 10px;border-radius:20px;font-size:11px;font-weight:700;letter-spacing:.5px;pointer-events:none}
.prod-badge-hot{background:linear-gradient(135deg,#ff4500,#ff8c00);color:#fff;box-shadow:0 0 12px rgba(255,69,0,.5);animation:badge-glow-hot 2s ease-in-out infinite}
.prod-badge-new{background:linear-gradient(135deg,#00c853,#00e676);color:#000;box-shadow:0 0 12px rgba(0,200,83,.5);animation:badge-glow-new 2s ease-in-out infinite}
.prod-badge-sale{background:linear-gradient(135deg,#ffd700,#ffab00);color:#000;box-shadow:0 0 12px rgba(255,215,0,.5);animation:badge-glow-sale 2s ease-in-out infinite}
@keyframes badge-glow-hot{0%,100%{box-shadow:0 0 8px rgba(255,69,0,.4)}50%{box-shadow:0 0 22px rgba(255,69,0,.9),0 0 40px rgba(255,69,0,.3)}}
@keyframes badge-glow-new{0%,100%{box-shadow:0 0 8px rgba(0,200,83,.4)}50%{box-shadow:0 0 22px rgba(0,200,83,.9),0 0 40px rgba(0,200,83,.3)}}
@keyframes badge-glow-sale{0%,100%{box-shadow:0 0 8px rgba(255,215,0,.4)}50%{box-shadow:0 0 22px rgba(255,215,0,.9),0 0 40px rgba(255,215,0,.3)}}

/* ── Verified badge ── */
.prod-verified{position:absolute;top:10px;right:10px;z-index:10;width:26px;height:26px;background:linear-gradient(135deg,#1d9bf0,#0056b3);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:900;color:#fff;box-shadow:0 0 0 2px rgba(29,155,240,.3);animation:verified-pulse 2.5s ease-in-out infinite;pointer-events:none}
@keyframes verified-pulse{0%,100%{box-shadow:0 0 0 2px rgba(29,155,240,.3),0 0 10px rgba(29,155,240,.2)}50%{box-shadow:0 0 0 4px rgba(29,155,240,.5),0 0 20px rgba(29,155,240,.6),0 0 40px rgba(29,155,240,.2)}}

/* ══════════════════════════════════════════════
   CICODE — Light Theme
   ══════════════════════════════════════════════ */
[data-theme="light"]{
  --bg:#f0f4f9;--bg2:#e4eaf4;--bg-card:#ffffff;
  --cyan:#0284c7;--purple:#7c3aed;--yellow:#d97706;--green:#059669;--red:#dc2626;
  --text:#0f172a;--muted:#64748b;
  --border:rgba(15,23,42,.1);--border2:rgba(15,23,42,.22);
  --glow-c:0 4px 20px rgba(2,132,199,.12);--glow-p:0 4px 20px rgba(124,58,237,.12);
}
[data-theme="light"] body{background:#f0f4f9}
[data-theme="light"] ::-webkit-scrollbar-track{background:#e4eaf4}
[data-theme="light"] ::-webkit-scrollbar-thumb{background:#94a3b8}
[data-theme="light"] .site-header{background:rgba(255,255,255,.97);border-bottom-color:rgba(0,0,0,.08);box-shadow:0 1px 0 rgba(0,0,0,.05),0 4px 20px rgba(0,0,0,.07)}
[data-theme="light"] .main-nav a:hover,[data-theme="light"] .main-nav a.active{background:rgba(2,132,199,.07)}
[data-theme="light"] .search-form{background:#f1f5f9;border-color:rgba(0,0,0,.1)}
[data-theme="light"] .search-input{color:#0f172a}
[data-theme="light"] .search-btn{background:rgba(2,132,199,.1);border-left-color:rgba(0,0,0,.08)}
[data-theme="light"] .hero::after{background-image:linear-gradient(rgba(2,132,199,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(2,132,199,.04) 1px,transparent 1px)}
[data-theme="light"] .hero-orb-1{background:radial-gradient(circle,rgba(2,132,199,.08) 0%,transparent 65%)}
[data-theme="light"] .hero-orb-2{background:radial-gradient(circle,rgba(124,58,237,.07) 0%,transparent 65%)}
[data-theme="light"] .hero-orb-3{background:radial-gradient(circle,rgba(217,119,6,.04) 0%,transparent 70%)}
[data-theme="light"] .hero-badge{background:rgba(2,132,199,.07);border-color:rgba(2,132,199,.2)}
[data-theme="light"] .cat-card{background:#fff;border-color:rgba(0,0,0,.08);box-shadow:0 2px 10px rgba(0,0,0,.04)}
[data-theme="light"] .cat-card:hover{box-shadow:0 8px 30px rgba(2,132,199,.15)}
[data-theme="light"] .cat-card::before{background:radial-gradient(circle,rgba(2,132,199,.08),transparent)}
[data-theme="light"] .cat-card::after{background:linear-gradient(90deg,transparent,rgba(0,0,0,.025),transparent)}
[data-theme="light"] .cat-tag{background:rgba(2,132,199,.08);border-color:rgba(2,132,199,.2)}
[data-theme="light"] .product-card{background:#fff;border-color:rgba(0,0,0,.08);box-shadow:0 2px 10px rgba(0,0,0,.04)}
[data-theme="light"] .product-card:hover{box-shadow:0 10px 40px rgba(124,58,237,.12)}
[data-theme="light"] .product-img{background:linear-gradient(135deg,#e8edf5,#f0f4f9)}
[data-theme="light"] .product-name{color:#0f172a}
[data-theme="light"] .form-control{background:#f8fafc;border-color:rgba(0,0,0,.12);color:#0f172a}
[data-theme="light"] .form-control:focus{border-color:#0284c7;box-shadow:0 0 0 3px rgba(2,132,199,.1);background:#fff}
[data-theme="light"] .form-control::placeholder{color:#94a3b8}
[data-theme="light"] select.form-control{background-color:#f8fafc}
[data-theme="light"] .auth-wrap{background:radial-gradient(ellipse at top,rgba(2,132,199,.05) 0%,transparent 60%)}
[data-theme="light"] .auth-card{background:#fff;border-color:rgba(0,0,0,.08);box-shadow:0 8px 40px rgba(0,0,0,.08)}
[data-theme="light"] .btn-outline{border-color:rgba(0,0,0,.14);color:#0f172a}
[data-theme="light"] .btn-outline:hover{border-color:#0284c7;color:#0284c7;background:rgba(2,132,199,.06)}
[data-theme="light"] td{border-bottom-color:rgba(0,0,0,.05)}
[data-theme="light"] tr:hover td{background:rgba(2,132,199,.025)}
[data-theme="light"] th{color:#64748b;border-bottom-color:rgba(0,0,0,.08)}
[data-theme="light"] .page-btn{border-color:rgba(0,0,0,.1);color:#64748b;background:#fff}
[data-theme="light"] .page-btn:hover,[data-theme="light"] .page-btn.active{background:rgba(2,132,199,.07)}
[data-theme="light"] .pay-card{background:#fff;border-color:rgba(0,0,0,.08)}
[data-theme="light"] .pay-hdr{background:linear-gradient(135deg,rgba(2,132,199,.06),rgba(124,58,237,.06))}
[data-theme="light"] .bank-box{background:rgba(2,132,199,.04);border-color:rgba(2,132,199,.15)}
[data-theme="light"] .bank-row{border-bottom-color:rgba(0,0,0,.05)}
[data-theme="light"] .copy-btn{border-color:rgba(0,0,0,.1);color:#64748b}
[data-theme="light"] .order-card{background:#fff;border-color:rgba(0,0,0,.08)}
[data-theme="light"] .order-card:hover{border-color:rgba(0,0,0,.15)}
[data-theme="light"] .order-icon{background:rgba(124,58,237,.07)}
[data-theme="light"] .site-footer{background:#e4eaf4;border-top-color:rgba(0,0,0,.08)}
[data-theme="light"] .admin-sidebar{background:#fff;border-right-color:rgba(0,0,0,.08);box-shadow:2px 0 20px rgba(0,0,0,.05)}
[data-theme="light"] .admin-topbar{background:#fff;border-bottom-color:rgba(0,0,0,.08)}
[data-theme="light"] .admin-wrap{background:#f0f4f9}
[data-theme="light"] .sb-item:hover{background:rgba(0,0,0,.04);color:#0f172a}
[data-theme="light"] .sb-item.active{background:rgba(2,132,199,.08)}
[data-theme="light"] .table-card,[data-theme="light"] .form-card{background:#fff;border-color:rgba(0,0,0,.08)}
[data-theme="light"] .table-card-hdr,[data-theme="light"] .form-card-title{border-bottom-color:rgba(0,0,0,.07)}
[data-theme="light"] .stat-card{background:#fff;border-color:rgba(0,0,0,.08)}
[data-theme="light"] .stock-item-data{color:#059669}
[data-theme="light"] .ticker-bar{background:rgba(255,255,255,.7);border-bottom-color:rgba(0,0,0,.07)}
[data-theme="light"] .card{background:#fff;border-color:rgba(0,0,0,.08)}
[data-theme="light"] .pd-image{background:#f0f4f9;border-color:rgba(0,0,0,.08)}
[data-theme="light"] .qty-btn{background:#f1f5f9;border-color:rgba(0,0,0,.1)}
[data-theme="light"] .qty-num{background:#fff;border-color:rgba(0,0,0,.1)}
[data-theme="light"] .delivered-box{background:rgba(0,0,0,.03);border-color:rgba(5,150,105,.2)}
[data-theme="light"] .del-item{background:rgba(5,150,105,.06)}
[data-theme="light"] .sort-btn{border-color:rgba(0,0,0,.1);color:#64748b;background:#fff}
[data-theme="light"] .sort-btn:hover,[data-theme="light"] .sort-btn.active{background:rgba(2,132,199,.07)}
[data-theme="light"] .tag-badge:nth-child(3n+1){background:rgba(2,132,199,.08);border-color:rgba(2,132,199,.25)}
[data-theme="light"] .tag-badge:nth-child(3n+2){background:rgba(217,119,6,.08);border-color:rgba(217,119,6,.25)}
[data-theme="light"] .tag-badge:nth-child(3n+3){background:rgba(124,58,237,.08);border-color:rgba(124,58,237,.2)}
[data-theme="light"] .admin-body{background:#f0f4f9}
[data-theme="light"] .admin-main-wrap{background:#f0f4f9}
/* ── Theme toggle button ── */
.theme-toggle{width:36px;height:36px;border-radius:50%;border:1px solid var(--border);background:transparent;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:17px;transition:all .25s;color:var(--muted);flex-shrink:0}
.theme-toggle:hover{border-color:var(--cyan);color:var(--cyan);background:rgba(2,132,199,.07);transform:rotate(20deg)}