:root{
  --bg:#eef3ff;
  --ink:#182033;
  --muted:#748099;
  --line:rgba(88,101,140,.13);
  --glass:rgba(255,255,255,.62);
  --glass-strong:rgba(255,255,255,.78);
  --blue:#5b8cff;
  --blue2:#6eb7ff;
  --violet:#896dff;
  --purple:#a96dff;
  --pink:#ff79bd;
  --rose:#ff6f91;
  --cyan:#52d4e8;
  --mint:#66dbb2;
  --orange:#ffad65;
  --yellow:#ffd568;
  --danger:#ef5e73;
  --radius:26px;
  --shadow:0 24px 70px rgba(78,95,145,.16);
  --shadow-soft:0 12px 35px rgba(78,95,145,.11);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  min-height:100vh;
  color:var(--ink);
  font:15px/1.55 -apple-system,BlinkMacSystemFont,"SF Pro Display","SF Pro Text",Inter,"Segoe UI",Arial,sans-serif;
  background:
    radial-gradient(circle at 7% 0%,rgba(105,157,255,.35),transparent 28%),
    radial-gradient(circle at 95% 8%,rgba(181,107,255,.28),transparent 28%),
    radial-gradient(circle at 80% 72%,rgba(255,121,189,.22),transparent 30%),
    radial-gradient(circle at 8% 82%,rgba(82,212,232,.22),transparent 30%),
    linear-gradient(150deg,#f8fbff 0%,#eef4ff 36%,#f8efff 70%,#fff4fa 100%);
  background-attachment:fixed;
}
a{color:inherit;text-decoration:none}
button,input,textarea,select{font-family:inherit}
.ambient{position:fixed;border-radius:50%;filter:blur(105px);pointer-events:none;z-index:-1;opacity:.5}
.a1{width:440px;height:440px;left:-140px;top:-120px;background:linear-gradient(135deg,#5e9cff,#8c6dff)}
.a2{width:480px;height:480px;right:-170px;top:38%;background:linear-gradient(135deg,#ff7ac1,#8f78ff)}
.glass{
  background:linear-gradient(150deg,rgba(255,255,255,.77),rgba(255,255,255,.45));
  border:1px solid rgba(255,255,255,.86);
  box-shadow:var(--shadow),inset 0 1px 0 rgba(255,255,255,.95);
  backdrop-filter:blur(30px) saturate(165%);
  -webkit-backdrop-filter:blur(30px) saturate(165%);
}
.container{width:min(1180px,calc(100% - 32px));margin:auto}

/* top nav */
.topbar{
  position:sticky;top:14px;z-index:30;width:min(1000px,calc(100% - 28px));margin:14px auto 0;
  padding:10px 12px 10px 14px;border-radius:23px;display:flex;align-items:center;justify-content:space-between
}
.brand{display:flex;align-items:center;gap:10px;font-weight:800;letter-spacing:-.01em}
.brand-orb{
  display:grid;place-items:center;width:36px;height:36px;border-radius:13px;
  background:linear-gradient(145deg,#5c8dff,#8c70ff 58%,#ff79be);
  color:#fff;box-shadow:0 8px 18px rgba(103,111,255,.32),inset 0 1px 1px rgba(255,255,255,.5)
}
.topbar nav{display:flex;gap:5px}
.topbar nav a{padding:8px 13px;border-radius:14px;color:#5d6780;font-weight:650;transition:.2s}
.topbar nav a:hover{background:rgba(255,255,255,.8);color:#4967d4;box-shadow:0 6px 18px rgba(100,120,180,.1)}

/* hero */
.hero{min-height:670px;display:grid;grid-template-columns:1.15fr .85fr;align-items:center;gap:70px;padding:70px 0 48px}
.hero h1,.checkout-main h1,.payment-card h1{
  font-size:clamp(44px,6vw,78px);line-height:.98;letter-spacing:-.06em;margin:12px 0 24px
}
.hero p{font-size:18px;max-width:620px;color:var(--muted)}
.eyebrow{font-size:11px;font-weight:850;letter-spacing:.16em;color:#7783a3}
.gradient-text{
  background:linear-gradient(90deg,#4f83ff 0%,#8e6cff 38%,#c66fff 67%,#ff71b5 100%);
  background-clip:text;-webkit-background-clip:text;color:transparent
}
.actions{display:flex;gap:12px;margin-top:30px}
.btn{
  border:0;border-radius:17px;padding:13px 18px;font-weight:780;cursor:pointer;display:inline-flex;
  align-items:center;justify-content:center;transition:.2s transform,.2s box-shadow,.2s opacity
}
.btn:hover{transform:translateY(-2px)}
.btn.primary{
  background:linear-gradient(135deg,#5b8cff,#816dff 55%,#b56fff);
  color:#fff;box-shadow:0 12px 28px rgba(99,112,255,.3)
}
.btn.primary:hover{box-shadow:0 16px 34px rgba(99,112,255,.4)}
.glass-btn{background:rgba(255,255,255,.72);border:1px solid rgba(255,255,255,.92);color:#5d6780}
.wide{width:100%}

.phone{
  width:304px;height:565px;border-radius:52px;padding:54px 20px 20px;margin:auto;border:7px solid rgba(255,255,255,.9);
  position:relative;transform:rotate(3deg);
  background:
    radial-gradient(circle at 20% 10%,rgba(94,157,255,.28),transparent 35%),
    radial-gradient(circle at 90% 55%,rgba(255,113,184,.22),transparent 38%),
    rgba(255,255,255,.56)
}
.dynamic-island{position:absolute;top:16px;left:50%;transform:translateX(-50%);width:96px;height:28px;border-radius:30px;background:linear-gradient(180deg,#25304d,#12182a)}
.mini-label{font-size:10px;letter-spacing:.15em;color:#8490a8}
.phone h3{font-size:33px;letter-spacing:-.045em;margin:5px 0 24px}
.phone-card{
  background:rgba(255,255,255,.7);border:1px solid rgba(255,255,255,.95);border-radius:22px;padding:17px;margin:12px 0;
  display:flex;justify-content:space-between;box-shadow:var(--shadow-soft)
}
.phone-card:nth-of-type(2){background:linear-gradient(135deg,rgba(222,238,255,.88),rgba(236,230,255,.82))}
.phone-card:nth-of-type(3){background:linear-gradient(135deg,rgba(226,251,255,.9),rgba(232,242,255,.85))}
.phone-card strong{font-size:20px}
.phone-card.accent{background:linear-gradient(135deg,#7b74ff,#b66dff 60%,#ff79b9);color:white}

/* quick cards */
.quick-section{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:-25px;margin-bottom:20px}
.quick-card{
  padding:17px 18px;border-radius:23px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px;
  transition:.22s;box-shadow:var(--shadow-soft)
}
.quick-card:hover{transform:translateY(-4px)}
.quick-card small{display:block;color:var(--muted)}
.quick-card>span{font-size:22px;color:#7180a5}
.quick-icon{width:45px;height:45px;border-radius:15px;display:grid;place-items:center;color:white;font-size:21px}
.tint-blue .quick-icon{background:linear-gradient(135deg,#5f99ff,#77c2ff)}
.tint-purple .quick-icon{background:linear-gradient(135deg,#856fff,#b16eff)}
.tint-pink .quick-icon{background:linear-gradient(135deg,#ff79b9,#ff8d99)}

/* sections */
.section{padding:70px 0}
.section-head{display:flex;justify-content:space-between;align-items:end;margin-bottom:26px}
.section-head h2{font-size:40px;letter-spacing:-.045em;margin:5px 0}
.pill,.status-chip{
  padding:7px 11px;background:linear-gradient(135deg,rgba(230,238,255,.9),rgba(245,232,255,.88));
  border:1px solid rgba(255,255,255,.9);border-radius:999px;font-size:12px;font-weight:750;color:#6571a5
}
.grid{display:grid;gap:18px}
.cards{grid-template-columns:repeat(3,1fr)}
.card,.service-card{padding:24px;border-radius:var(--radius);position:relative;overflow:hidden}
.card:before,.service-card:before{
  content:"";position:absolute;width:160px;height:160px;border-radius:50%;right:-65px;top:-70px;
  background:radial-gradient(circle,rgba(103,148,255,.19),transparent 68%);pointer-events:none
}
.service-card:before{background:radial-gradient(circle,rgba(183,107,255,.19),transparent 68%)}
.hover-lift{transition:.25s ease}
.hover-lift:hover{transform:translateY(-6px);box-shadow:0 30px 72px rgba(83,94,150,.18)}
.app-icon,.service-icon{
  width:56px;height:56px;border-radius:18px;display:grid;place-items:center;color:#fff;font-size:24px;
  background:linear-gradient(135deg,#5d95ff,#8173ff 55%,#b66eff);
  box-shadow:0 10px 24px rgba(100,112,255,.28)
}
.service-icon{background:linear-gradient(135deg,#9a6fff,#d36dff 55%,#ff78b9)}
.big{width:82px;height:82px;border-radius:26px;font-size:34px}
.card h3,.service-card h3{font-size:22px;letter-spacing:-.025em;margin:18px 0 4px}
.card p,.service-card p{color:var(--muted);min-height:46px}
.variant-list{display:grid;gap:8px;margin-top:18px}
.variant{
  background:linear-gradient(135deg,rgba(245,249,255,.9),rgba(245,240,255,.72));border:1px solid rgba(255,255,255,.95);
  border-radius:16px;padding:12px;display:flex;justify-content:space-between;align-items:center;transition:.2s
}
.variant:hover{box-shadow:0 8px 20px rgba(93,116,190,.12);transform:translateX(2px)}
.variant span{display:flex;flex-direction:column}
.variant small,.catalog-item small,td small{display:block;color:var(--muted)}
.variant strong{color:#5d63d6}
.service-grid{grid-template-columns:repeat(4,1fr)}
.service-card{min-height:235px;display:flex;flex-direction:column}
.service-bottom{margin-top:auto;display:flex;justify-content:space-between;color:#765bd4}
.track-box{padding:34px;border-radius:32px;display:grid;grid-template-columns:1fr 1fr;gap:30px}
.track-box h2{font-size:36px;margin:5px 0}
.track-box p{color:var(--muted)}
.track-form{display:grid;gap:10px;align-content:center}

/* forms */
input,textarea,select{
  width:100%;border:1px solid rgba(97,112,154,.12);
  background:linear-gradient(135deg,rgba(255,255,255,.86),rgba(244,247,255,.72));
  border-radius:16px;padding:13px 14px;font:inherit;color:var(--ink);outline:none;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.95)
}
input:focus,textarea:focus,select:focus{border-color:#8a8fff;box-shadow:0 0 0 4px rgba(111,121,255,.11)}
label{display:grid;gap:7px;font-size:13px;font-weight:720;color:#4c5671}
.footer{text-align:center;padding:60px 20px;color:var(--muted)}

.checkout-shell{display:grid;grid-template-columns:1.2fr .65fr;gap:20px;padding:70px 0}
.checkout-main,.checkout-side,.payment-card{border-radius:32px;padding:30px}
.checkout-main h1{font-size:48px}
.checkout-side{align-self:start;position:sticky;top:100px}
.summary-line,.metric{
  display:flex;justify-content:space-between;padding:16px;
  background:linear-gradient(135deg,rgba(233,242,255,.85),rgba(245,233,255,.78));
  border-radius:18px;margin:15px 0;border:1px solid rgba(255,255,255,.9)
}
.form-stack{display:grid;gap:15px}.two{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.price-xl{font-size:35px;font-weight:840;letter-spacing:-.04em;margin:20px 0;background:linear-gradient(90deg,#5a83ff,#8a6cff,#cf6fff);-webkit-background-clip:text;background-clip:text;color:transparent}
.back{display:block;margin-bottom:25px;color:#697594}
.payment-wrap{padding:70px 0;display:grid;place-items:center}
.payment-card{width:min(590px,100%)}
.payment-card h1{font-size:46px}
.qris-box{width:260px;height:260px;margin:25px auto;padding:15px;background:white;border-radius:28px;box-shadow:0 15px 40px rgba(84,97,140,.12)}
.qris-box img{width:100%;height:100%;object-fit:contain}
.order-code{
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  background:linear-gradient(135deg,#536fff,#8b6dff 60%,#c670ff);color:#fff;border-radius:15px;padding:12px 14px;display:inline-block;letter-spacing:.08em;
  box-shadow:0 10px 24px rgba(103,103,255,.25)
}
.order-code.large{font-size:20px;margin:20px}
.muted{color:var(--muted)}.center{text-align:center}
.success-orb{
  margin:0 auto 18px;width:74px;height:74px;border-radius:50%;display:grid;place-items:center;
  background:linear-gradient(135deg,#67ddb1,#6acdd7);color:#fff;font-size:35px;box-shadow:0 12px 28px rgba(94,200,165,.28)
}
.success-orb.bad{background:linear-gradient(135deg,#ff7b97,#ff6e7b)}
.detail-list{display:grid;margin:22px 0;border-top:1px solid var(--line)}
.detail-list>div{display:flex;justify-content:space-between;gap:20px;padding:13px 0;border-bottom:1px solid var(--line)}
.detail-list span{color:var(--muted)}
.progress{height:8px;background:#e3e9f7;border-radius:10px;margin-top:25px;overflow:hidden}
.progress i{display:block;height:100%;background:linear-gradient(90deg,#5c91ff,#896fff,#d56fff);border-radius:10px}
.alert{padding:12px 14px;border-radius:15px;margin:12px 0}
.alert.success{background:linear-gradient(135deg,#dcf8e9,#ddf8f3);color:#287052}
.alert.danger{background:linear-gradient(135deg,#ffe2e7,#ffe9eb);color:#a7384b}

/* customer account / warranty */
.account-delivery{margin:28px 0;padding-top:22px;border-top:1px solid var(--line)}
.section-head.compact{margin-bottom:16px}.section-head.compact h2{font-size:26px;margin:3px 0}
.credential-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:16px 0}
.credential{
  padding:14px;border-radius:17px;
  background:linear-gradient(135deg,rgba(239,247,255,.88),rgba(247,239,255,.82));
  border:1px solid rgba(255,255,255,.95);display:grid;gap:6px;position:relative
}
.credential span{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}
.credential b{word-break:break-word}
.copy-btn{border:0;background:linear-gradient(135deg,#edf2ff,#f0eaff);color:#6471ad;border-radius:9px;padding:6px 8px;font-size:11px;font-weight:720;cursor:pointer;width:max-content}
.credential-actions{display:flex;gap:6px}.secret{filter:blur(6px);user-select:none;transition:.2s}.secret.revealed{filter:none;user-select:text}
.notice-card{padding:14px 16px;border-radius:16px;background:linear-gradient(135deg,#e8f3ff,#f3ebff);color:#4d5f92;margin:14px 0;border:1px solid rgba(255,255,255,.9)}
.claim-history{margin-top:24px}.claim-row{display:flex;justify-content:space-between;align-items:center;padding:12px 0;border-bottom:1px solid var(--line)}.claim-row span:first-child{display:grid}.claim-row small{color:var(--muted)}
.warranty-flow{display:grid;gap:10px;margin-top:18px}.warranty-flow>div{display:flex;gap:12px;align-items:flex-start;padding:12px;background:linear-gradient(135deg,rgba(237,245,255,.9),rgba(248,237,255,.8));border-radius:15px;border:1px solid rgba(255,255,255,.9)}
.warranty-flow>div>b{width:29px;height:29px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,#708cff,#a66fff);color:#fff;box-shadow:0 7px 18px rgba(100,105,255,.25)}
.warranty-flow span{display:grid}.warranty-flow small{color:var(--muted)}
.timeline{margin-top:18px}.timeline-item{display:grid;grid-template-columns:18px 1fr;gap:10px;position:relative;padding-bottom:18px}
.timeline-item:before{content:"";position:absolute;left:6px;top:14px;bottom:0;width:2px;background:linear-gradient(#8894ff,#d58cff)}
.timeline-item:last-child:before{display:none}.timeline-item i{width:14px;height:14px;border-radius:50%;background:linear-gradient(135deg,#668fff,#b472ff);margin-top:4px;z-index:1;box-shadow:0 3px 8px rgba(100,110,255,.3)}
.timeline-item p{margin:3px 0}.timeline-item small{color:var(--muted)}

/* badges */
.badge{display:inline-block;border-radius:999px;padding:5px 9px;font-size:11px;font-weight:800;text-transform:uppercase;border:1px solid rgba(255,255,255,.9)}
.badge.paid,.badge.completed,.badge.verified,.badge.delivered,.badge.resolved{background:linear-gradient(135deg,#d8f8e9,#d7f8f0);color:#247555}
.badge.waiting_payment,.badge.waiting_verification,.badge.pending,.badge.open,.badge.reviewing,.badge.waiting_customer,.badge.approved{background:linear-gradient(135deg,#fff1cc,#ffebd3);color:#9a6e18}
.badge.cancelled,.badge.rejected,.badge.refund{background:linear-gradient(135deg,#ffe0e5,#ffe7e9);color:#ae4051}
.badge.processing,.badge.revision{background:linear-gradient(135deg,#e0e8ff,#eee2ff);color:#665ab2}

/* admin */
.admin-body{
  background:
    radial-gradient(circle at 0 0,rgba(91,140,255,.28),transparent 25%),
    radial-gradient(circle at 100% 20%,rgba(179,108,255,.22),transparent 28%),
    linear-gradient(145deg,#f5f8ff,#eef3ff 45%,#f8efff);
}
.admin-shell{display:grid;grid-template-columns:250px 1fr;gap:18px;min-height:100vh;padding:14px}
.sidebar{
  border-radius:30px;padding:18px;position:sticky;top:14px;height:calc(100vh - 28px);display:flex;flex-direction:column;
  background:linear-gradient(160deg,rgba(255,255,255,.78),rgba(245,244,255,.56))
}
.side-nav{display:grid;gap:6px;margin-top:30px}
.side-nav a{padding:10px 11px;border-radius:15px;color:#5d6883;font-weight:680;display:flex;align-items:center;gap:10px;transition:.2s}
.side-nav a:hover{background:rgba(255,255,255,.78);transform:translateX(3px);box-shadow:0 6px 18px rgba(95,110,165,.08)}
.nav-ico{width:31px;height:31px;border-radius:11px;display:grid;place-items:center;color:white;font-style:normal;font-size:14px;box-shadow:0 6px 13px rgba(90,100,150,.18)}
.nav-ico.blue{background:linear-gradient(135deg,#5b96ff,#65c0ff)}
.nav-ico.violet{background:linear-gradient(135deg,#786fff,#a46dff)}
.nav-ico.cyan{background:linear-gradient(135deg,#4bcce5,#5ea9ff)}
.nav-ico.pink{background:linear-gradient(135deg,#ff79b9,#d16dff)}
.nav-ico.orange{background:linear-gradient(135deg,#ffad61,#ff7d83)}
.nav-ico.indigo{background:linear-gradient(135deg,#6676ff,#946cff)}
.nav-ico.rose{background:linear-gradient(135deg,#ff729f,#ff7c78)}
.nav-ico.gray{background:linear-gradient(135deg,#8190ad,#65718c)}
.side-bottom{margin-top:auto;padding:12px;display:grid;gap:4px;color:var(--muted)}
.link-btn{border:0;background:none;padding:0;text-align:left;color:#c84d66;cursor:pointer}
.admin-main{padding:15px 12px 50px;min-width:0}
.admin-top{display:flex;justify-content:space-between;align-items:center;margin:5px 4px 25px}
.admin-top h1{font-size:38px;letter-spacing:-.04em;margin:0}
.admin-avatar{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,#5d90ff,#9a70ff,#ff76b5);color:#fff;font-weight:850;box-shadow:0 10px 24px rgba(105,110,255,.25)}
.stat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:18px}
.stat{border-radius:24px;padding:20px;position:relative;overflow:hidden}
.stat:after{content:"";position:absolute;width:90px;height:90px;border-radius:50%;right:-20px;top:-25px;background:radial-gradient(circle,rgba(117,145,255,.18),transparent 67%)}
.stat:nth-child(2):after{background:radial-gradient(circle,rgba(180,108,255,.18),transparent 67%)}
.stat:nth-child(3):after{background:radial-gradient(circle,rgba(80,205,226,.18),transparent 67%)}
.stat:nth-child(4):after{background:radial-gradient(circle,rgba(255,121,186,.18),transparent 67%)}
.stat:nth-child(5):after{background:radial-gradient(circle,rgba(255,174,98,.18),transparent 67%)}
.stat:nth-child(6):after{background:radial-gradient(circle,rgba(95,219,177,.18),transparent 67%)}
.stat span,.stat small{display:block;color:var(--muted)}.stat strong{display:block;font-size:31px;letter-spacing:-.035em;margin:4px 0;color:#465077}
.panel{border-radius:27px;padding:20px;margin-bottom:18px}.panel-head,.row-between{display:flex;justify-content:space-between;align-items:center}.panel h2{margin:0 0 16px;font-size:21px}
.table-wrap{overflow:auto}
table{width:100%;border-collapse:collapse;min-width:720px}
th,td{text-align:left;padding:13px 10px;border-bottom:1px solid var(--line);vertical-align:top}
th{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:#8590a8}
td a b{color:#5966b7}
.admin-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.filters{border-radius:22px;padding:12px;display:grid;grid-template-columns:2fr 1fr 1fr auto;gap:8px;margin-bottom:18px}
.action-row,.inline-form{display:flex;gap:8px}.mini{border:0;border-radius:10px;padding:7px 9px;cursor:pointer;font-weight:730}
.mini.ok{background:linear-gradient(135deg,#daf6e7,#d8f4f1);color:#267054}.mini.bad{background:linear-gradient(135deg,#ffe2e6,#ffe9e8);color:#a83d50}
.catalog-stack{display:grid;gap:10px}.catalog-item{padding:14px;background:linear-gradient(135deg,rgba(242,248,255,.9),rgba(249,241,255,.78));border-radius:17px;border:1px solid rgba(255,255,255,.92)}
.catalog-item.vertical{display:grid;gap:12px}.mini-form{display:grid;grid-template-columns:2fr repeat(4,1fr) auto;gap:6px;margin-top:8px}.mini-form input{padding:9px}.variant-row{padding:7px 0;border-top:1px solid var(--line)}
.slot-row{display:flex;flex-wrap:wrap;gap:6px}.slot{font-size:11px;padding:5px 8px;border-radius:999px;background:#eef1f7}.slot.available{background:linear-gradient(135deg,#dff7ea,#ddf5f1);color:#27785a}.slot.sold{background:linear-gradient(135deg,#e0e8ff,#eee4ff);color:#685daf}.slot.problem{background:linear-gradient(135deg,#ffe0e6,#ffe8e9);color:#aa4456}
.note{padding:15px;background:linear-gradient(135deg,#fff4cf,#fff0df);border-radius:16px;color:#7a622d}
.qris-preview{width:180px;border-radius:20px;background:white;padding:10px;box-shadow:0 10px 30px rgba(80,100,145,.12)}
.settings-panel{max-width:650px}
.login-wrap{min-height:100vh;display:grid;place-items:center;padding:20px}
.login-card{width:min(430px,100%);padding:31px;border-radius:33px;display:grid;gap:14px}
.login-card h1{font-size:40px;letter-spacing:-.045em;margin:0}
.login-card p{color:var(--muted);margin-top:-8px}.big-orb{width:52px;height:52px;border-radius:17px}
.pagination{margin-top:15px}
.pagination nav>div:first-child{display:none}.pagination nav>div:last-child{display:flex;justify-content:space-between;align-items:center}.pagination svg{width:18px}
.install-wrap{min-height:100vh;display:grid;place-items:center;padding:20px}.install-card{width:min(540px,100%);padding:34px;border-radius:34px}.install-card h1{font-size:44px;letter-spacing:-.04em}.danger-text{color:#b54259;margin-top:24px}.install-card .note{margin:18px 0}

@media(max-width:900px){
  .hero{grid-template-columns:1fr;padding-top:90px}.phone{display:none}
  .quick-section{grid-template-columns:1fr}
  .cards,.service-grid{grid-template-columns:1fr 1fr}
  .track-box,.checkout-shell,.admin-grid{grid-template-columns:1fr}
  .checkout-side{position:static}
  .admin-shell{grid-template-columns:1fr}.sidebar{height:auto;position:relative;top:0}
  .side-nav{grid-template-columns:repeat(3,1fr)}.stat-grid{grid-template-columns:1fr 1fr}
  .filters{grid-template-columns:1fr 1fr}
}
@media(max-width:620px){
  .topbar nav{display:none}.hero{min-height:540px}.hero h1{font-size:51px}
  .cards,.service-grid,.stat-grid,.filters,.two,.credential-grid{grid-template-columns:1fr}
  .section-head{align-items:start;gap:12px;flex-direction:column}.track-box{padding:22px}
  .admin-shell{padding:8px}.side-nav{grid-template-columns:1fr 1fr}
  .checkout-main,.checkout-side,.payment-card{padding:22px}
  .checkout-main h1,.payment-card h1{font-size:38px}.mini-form{grid-template-columns:1fr}
}


/* V4 inventory + richer account tracking */
.stock-wait{
  background:linear-gradient(135deg,#fff0ce,#ffe9dc);
  color:#8d6123;
  border:1px solid rgba(255,255,255,.9)
}
.inventory-hero{
  border-radius:30px;padding:24px;margin-bottom:18px;display:flex;align-items:center;justify-content:space-between;gap:20px;
  background:
    radial-gradient(circle at 0 0,rgba(89,151,255,.23),transparent 35%),
    radial-gradient(circle at 100% 100%,rgba(198,109,255,.18),transparent 35%),
    linear-gradient(145deg,rgba(255,255,255,.8),rgba(244,243,255,.58))
}
.inventory-hero h2{font-size:28px;letter-spacing:-.035em;margin:4px 0}
.inventory-hero p{margin:0;color:var(--muted)}
.inventory-kpis{display:flex;gap:9px}
.inventory-kpis span{
  min-width:92px;padding:13px 14px;border-radius:18px;text-align:center;
  background:rgba(255,255,255,.68);border:1px solid rgba(255,255,255,.9)
}
.inventory-kpis b{display:block;font-size:25px;color:#5f67b8}
.inventory-kpis small{color:var(--muted)}
.inventory-list{display:grid;gap:18px}
.inventory-card{border-radius:28px;padding:21px}
.inventory-card-head{display:flex;justify-content:space-between;align-items:flex-start;gap:18px}
.inventory-card-head h3{font-size:24px;letter-spacing:-.025em;margin:3px 0}
.inventory-card-head p{margin:0;color:var(--muted)}
.stock-bubbles{display:flex;flex-wrap:wrap;gap:6px;justify-content:flex-end}
.bubble{font-size:11px;font-weight:800;padding:6px 9px;border-radius:999px}
.bubble.green{background:linear-gradient(135deg,#d9f8e9,#dcf7f2);color:#28785a}
.bubble.purple{background:linear-gradient(135deg,#e3e7ff,#eee1ff);color:#655ab2}
.bubble.red{background:linear-gradient(135deg,#ffe0e5,#ffe8ea);color:#aa4053}
.edit-box,.add-slot-box{
  margin-top:14px;padding:12px 14px;border-radius:16px;
  background:linear-gradient(135deg,rgba(238,245,255,.82),rgba(248,238,255,.72));
  border:1px solid rgba(255,255,255,.92)
}
.edit-box summary,.add-slot-box summary,.slot-card summary{cursor:pointer;font-weight:750;color:#6570a5}
.edit-form{margin-top:12px}
.slot-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:15px}
.slot-card{
  padding:13px;border-radius:18px;border:1px solid rgba(255,255,255,.92);
  background:linear-gradient(145deg,rgba(245,249,255,.9),rgba(245,239,255,.8))
}
.slot-card.available{background:linear-gradient(145deg,#effcf7,#edf9ff)}
.slot-card.sold{background:linear-gradient(145deg,#eef2ff,#f4edff)}
.slot-card.problem{background:linear-gradient(145deg,#fff0f2,#fff2e9)}
.slot-top{display:flex;justify-content:space-between;gap:8px;align-items:flex-start}
.slot-top div{display:grid}.slot-top small{color:var(--muted)}
.slot-customer{display:grid;margin:12px 0;padding:9px;border-radius:12px;background:rgba(255,255,255,.6)}
.slot-customer small{color:var(--muted)}.slot-customer a{font-size:11px;color:#6670bd}
.tiny-form{margin-top:9px}.tiny-form input,.tiny-form select{padding:9px}
.inventory-legend{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0 17px}
.mini-note{display:grid;gap:3px;padding:14px;border-radius:16px;background:linear-gradient(135deg,#e9f4ff,#f2ebff);color:#56638e}
.add-slot-form{grid-template-columns:1.4fr 1fr 1fr auto}

/* More color on customer credential card */
.credential:nth-child(1){background:linear-gradient(135deg,#e9f4ff,#edf1ff)}
.credential:nth-child(2){background:linear-gradient(135deg,#f0eaff,#faefff)}
.credential:nth-child(3){background:linear-gradient(135deg,#e7fbf7,#edf8ff)}
.credential:nth-child(4){background:linear-gradient(135deg,#fff0e6,#fff5ed)}
.credential:nth-child(5){background:linear-gradient(135deg,#eaf1ff,#f5efff)}
.credential:nth-child(6){background:linear-gradient(135deg,#ffeaf4,#fff0f7)}

@media(max-width:1050px){.slot-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:780px){
  .inventory-hero{flex-direction:column;align-items:flex-start}
  .inventory-kpis{width:100%}.inventory-kpis span{flex:1}
  .slot-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:520px){
  .slot-grid{grid-template-columns:1fr}
  .inventory-card-head{flex-direction:column}
  .stock-bubbles{justify-content:flex-start}
  .inventory-kpis{display:grid;grid-template-columns:repeat(3,1fr)}
  .inventory-kpis span{min-width:0}
}

.logo-box{
  background:
    radial-gradient(circle at 25% 20%,rgba(255,255,255,.28),transparent 38%),
    linear-gradient(135deg,#0f1730,#1d1022);
  padding:10px;overflow:hidden
}
.logo-box img{width:100%;height:100%;object-fit:contain;display:block}
.mini-brand{width:18px;height:18px;vertical-align:-3px;margin-right:6px;border-radius:6px;background:#fff;padding:1px}
.card:nth-child(1){background:
  radial-gradient(circle at top right,rgba(255,77,103,.14),transparent 36%),
  linear-gradient(160deg,rgba(255,255,255,.80),rgba(255,241,244,.62))}
.card:nth-child(2){background:
  radial-gradient(circle at top right,rgba(70,150,255,.16),transparent 36%),
  linear-gradient(160deg,rgba(255,255,255,.80),rgba(238,246,255,.64))}
.card:nth-child(3){background:
  radial-gradient(circle at top right,rgba(30,215,96,.16),transparent 36%),
  linear-gradient(160deg,rgba(255,255,255,.80),rgba(236,255,245,.64))}
.card:nth-child(4){background:
  radial-gradient(circle at top right,rgba(25,195,125,.16),transparent 36%),
  linear-gradient(160deg,rgba(255,255,255,.80),rgba(236,255,247,.64))}
.service-card:nth-child(1){background:linear-gradient(160deg,rgba(255,255,255,.80),rgba(241,243,255,.64))}
.service-card:nth-child(2){background:linear-gradient(160deg,rgba(255,255,255,.80),rgba(242,250,255,.64))}
.service-card:nth-child(3){background:linear-gradient(160deg,rgba(255,255,255,.80),rgba(248,241,255,.64))}
.service-card:nth-child(4){background:linear-gradient(160deg,rgba(255,255,255,.80),rgba(255,244,248,.64))}
.brand-ribbon{
  display:inline-flex;align-items:center;gap:8px;padding:8px 11px;border-radius:999px;
  background:rgba(255,255,255,.72);border:1px solid rgba(255,255,255,.92);font-size:12px;font-weight:700;color:#617096
}
.inventory-card-head .eyebrow{display:block}

/* V8 variant inventory */
.variant-stock-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.variant-stock-card{
  padding:14px;border-radius:18px;
  background:linear-gradient(145deg,#edf8ff,#f3efff);
  border:1px solid rgba(255,255,255,.95)
}
.variant-stock-card.empty{background:linear-gradient(145deg,#fff0f2,#fff5eb)}
.variant-stock-card>span{display:block;font-size:10px;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}
.variant-stock-card>b{display:block;margin:4px 0 12px;font-size:14px}
.variant-stock-card>div{display:flex;align-items:end;gap:5px}
.variant-stock-card strong{font-size:28px;line-height:1;color:#5967b3}
.variant-stock-card.empty strong{color:#c35a69}
.variant-stock-card small{color:var(--muted)}
.variant-stock-card em{margin-left:auto;font-style:normal;font-size:10px;color:var(--muted)}
.slot-variant{
  margin:10px 0;padding:8px 9px;border-radius:11px;
  background:rgba(255,255,255,.62);display:grid
}
.slot-variant small{font-size:9px;color:var(--muted);letter-spacing:.08em}
.slot-variant b{font-size:11px;color:#5d67a7}
.retry-assign-panel{
  display:flex;align-items:center;justify-content:space-between;gap:20px;
  background:
    radial-gradient(circle at 100% 0,rgba(255,170,95,.17),transparent 38%),
    linear-gradient(145deg,rgba(255,255,255,.82),rgba(255,246,231,.72))
}
.retry-assign-panel h2{margin:4px 0 3px}
.retry-assign-panel p{margin:0}
@media(max-width:1000px){.variant-stock-grid{grid-template-columns:1fr 1fr}}
@media(max-width:620px){
  .variant-stock-grid{grid-template-columns:1fr}
  .retry-assign-panel{align-items:stretch;flex-direction:column}
}

/* V9 settings + email */
.settings-grid-v9{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(320px,.85fr);gap:16px}
.settings-divider{height:1px;background:rgba(104,115,153,.14);margin:8px 0}
.toggle-row{display:flex!important;align-items:center;gap:12px;padding:13px 14px;border-radius:16px;background:rgba(239,244,255,.72);border:1px solid rgba(255,255,255,.9)}
.toggle-row input{width:20px!important;height:20px!important;min-height:0!important;margin:0!important}
.toggle-row span{display:grid}.toggle-row small{color:var(--muted);margin-top:2px}
.smtp-box{padding:13px 14px;border-radius:16px;background:rgba(247,244,255,.66);border:1px solid rgba(255,255,255,.9)}
.smtp-box summary{cursor:pointer;font-weight:750;color:#626a84}
.flow-v9{display:grid;gap:10px;margin-top:15px}
.flow-v9>div{padding:13px;border-radius:16px;background:rgba(255,255,255,.64);display:flex;flex-wrap:wrap;gap:7px;align-items:center}
.flow-v9 b{min-width:110px}
.flow-v9 span,.flow-v9 strong{padding:5px 8px;border-radius:999px;font-size:10px;background:#edf1ff;color:#6571ae}
.flow-v9 strong{background:#e7f8ef;color:#3b8061}
.email-paid-panel{display:flex;align-items:center;justify-content:space-between;gap:18px}
.email-paid-panel h2{margin:4px 0}
@media(max-width:900px){.settings-grid-v9{grid-template-columns:1fr}}
@media(max-width:620px){.email-paid-panel{align-items:stretch;flex-direction:column}.flow-v9>div{align-items:flex-start;flex-direction:column}.flow-v9 b{min-width:0}}

/* V10 payment verification */
.done-label{
  display:inline-flex;align-items:center;padding:6px 9px;border-radius:999px;
  background:#e2f7ed;color:#2f7c5a;font-size:10px;font-weight:800
}
.bad-text{background:#ffe6e9;color:#b64f5e}
.badge.verified{background:linear-gradient(135deg,#dcf8ea,#cff5e4);color:#267a55}
.badge.rejected{background:linear-gradient(135deg,#ffe5e9,#ffedf0);color:#b44d5c}
.badge.waiting_stock{background:linear-gradient(135deg,#fff0cb,#ffe6ce);color:#9a681c}
@media(max-width:760px){
  .table-wrap table{min-width:920px}
}

/* V11 compact inventory + editable product pricing */
.slot-scroll-v11{
  max-height:340px;
  overflow-y:auto;
  overflow-x:hidden;
  padding-right:6px;
  margin-top:12px;
  scrollbar-width:thin;
  scrollbar-color:#a9b7ef transparent;
}
.slot-scroll-v11::-webkit-scrollbar{width:7px}
.slot-scroll-v11::-webkit-scrollbar-track{background:transparent}
.slot-scroll-v11::-webkit-scrollbar-thumb{
  background:linear-gradient(#82a6ff,#ae7fff);
  border-radius:999px
}
.slot-scroll-v11 .slot-grid{margin-top:0}
.slot-price-v11{
  margin-top:3px;
  font-size:10px;
  font-weight:800;
  color:#6973b0
}
.label-help{
  display:block;
  font-size:9px;
  font-weight:500;
  color:var(--muted);
  margin-top:2px
}

.product-admin-hero{
  display:flex;justify-content:space-between;align-items:center;gap:25px
}
.product-admin-hero h2{margin:5px 0}
.price-guide{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;min-width:520px}
.price-guide>div{
  padding:11px 12px;border-radius:15px;background:rgba(255,255,255,.65);
  border:1px solid rgba(255,255,255,.9);display:grid
}
.price-guide span{font-size:9px;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}
.price-guide b{font-size:11px;margin-top:4px}
.product-catalog-v11{display:grid;gap:15px;margin-top:16px}
.product-manage-card{padding:20px}
.product-manage-head{display:flex;justify-content:space-between;align-items:flex-start;gap:20px}
.product-manage-brand{display:flex;gap:13px;align-items:center;min-width:0}
.product-manage-brand h3{margin:3px 0;font-size:21px}
.product-manage-brand p{margin:0;color:var(--muted);font-size:12px}
.product-manage-icon{
  flex:0 0 auto;width:55px;height:55px;border-radius:17px;background:#fff;
  display:grid;place-items:center;overflow:hidden;box-shadow:0 8px 24px rgba(68,78,120,.11)
}
.product-manage-icon img{width:100%;height:100%;object-fit:cover}
.variant-list-v11{display:grid;gap:8px;margin-top:15px}
.variant-edit-card{
  border-radius:17px;padding:12px 13px;
  background:rgba(255,255,255,.60);border:1px solid rgba(255,255,255,.92)
}
.variant-edit-card.inactive{opacity:.62}
.variant-view{
  display:grid;
  grid-template-columns:minmax(180px,1.6fr) repeat(3,minmax(110px,.7fr));
  gap:12px;align-items:center
}
.variant-view>div{display:grid}
.variant-name{font-weight:800}
.variant-view small{font-size:9px;color:var(--muted);text-transform:uppercase;letter-spacing:.06em}
.variant-view strong{color:#5967b3;font-size:16px}
.variant-view b{font-size:12px}
.variant-margin-block b{color:#33805d}
.variant-edit-card details{margin-top:9px}
.variant-edit-card summary,.add-package-box summary{cursor:pointer;color:#626da8;font-weight:750;font-size:12px}
.variant-edit-form,.package-add-form{margin-top:10px}
.three{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}
.compact-toggle{padding:9px 11px}
.add-package-box{margin-top:13px;padding:11px 12px;border-radius:15px;background:rgba(239,243,255,.65)}
.compact-empty{padding:20px}

@media(max-width:1050px){
  .product-admin-hero{align-items:flex-start;flex-direction:column}
  .price-guide{min-width:0;width:100%}
  .variant-view{grid-template-columns:1.5fr 1fr 1fr}
  .variant-margin-block{grid-column:2/4}
}
@media(max-width:700px){
  .price-guide{grid-template-columns:1fr}
  .variant-view{grid-template-columns:1fr 1fr}
  .variant-view>div:first-child{grid-column:1/-1}
  .variant-margin-block{grid-column:auto}
  .three{grid-template-columns:1fr}
  .product-manage-head{flex-direction:column}
  .slot-scroll-v11{max-height:300px}
}


/* =========================================================
   V12 Products Admin - compact, card based
   ========================================================= */

.products-v12-top{display:grid;gap:14px;margin-bottom:16px}

.products-v12-intro{
  margin:0!important;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:22px;
  padding:20px 22px!important
}
.products-v12-intro h2{margin:4px 0 5px!important;font-size:26px!important}
.products-v12-intro p{margin:0;color:var(--muted);font-size:13px}

.products-v12-legend{
  display:grid;
  grid-template-columns:repeat(3,minmax(120px,1fr));
  gap:8px;
  min-width:480px
}
.products-v12-legend>div{
  padding:11px 12px;
  border-radius:15px;
  background:rgba(255,255,255,.68);
  border:1px solid rgba(255,255,255,.95);
  display:grid
}
.products-v12-legend span{
  font-size:9px;color:var(--muted);
  letter-spacing:.08em;text-transform:uppercase
}
.products-v12-legend b{font-size:11px;margin-top:3px}

.products-v12-add{
  margin:0!important;
  padding:0!important;
  overflow:hidden
}
.products-v12-add>summary{
  list-style:none;
  cursor:pointer;
  padding:16px 18px;
  display:flex;
  align-items:center;
  gap:8px;
  font-size:14px;
  font-weight:800;
  color:#5865a4
}
.products-v12-add>summary::-webkit-details-marker{display:none}
.products-v12-add>summary span{
  width:28px;height:28px;
  display:grid;place-items:center;
  border-radius:9px;
  background:#edf1ff;
  font-size:18px
}
.products-v12-add[open]>summary{
  border-bottom:1px solid rgba(112,124,162,.10)
}

.products-v12-form{
  width:min(760px,100%);
  padding:15px 18px 18px;
  display:grid;
  gap:11px
}
.products-v12-form.compact{
  width:100%;
  padding:13px 0 2px
}
.products-v12-form label{
  display:grid!important;
  gap:5px!important;
  font-size:11px!important;
  font-weight:750!important;
  color:#59627c!important
}
.products-v12-form input,
.products-v12-form select,
.products-v12-form textarea{
  width:100%!important;
  min-height:42px!important;
  padding:10px 12px!important;
  border-radius:13px!important;
  font-size:13px!important;
  background:rgba(250,251,255,.82)!important;
  border:1px solid rgba(115,127,166,.13)!important;
  box-shadow:none!important
}
.products-v12-form textarea{min-height:80px!important;resize:vertical}

.v12-form-grid{display:grid;gap:10px}
.v12-form-grid.two-col{grid-template-columns:repeat(2,minmax(0,1fr))}
.v12-form-grid.three-col{grid-template-columns:repeat(3,minmax(0,1fr))}
.v12-form-grid.small-cols{grid-template-columns:minmax(160px,.55fr) minmax(220px,1fr)}
.v12-form-actions{display:flex;justify-content:flex-end;padding-top:2px}
.v12-form-actions .btn,
.v12-form-actions .mini{min-width:150px}

.products-v12-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
  align-items:start
}

.product-card-admin-v12{
  margin:0!important;
  padding:18px!important;
  border-radius:25px!important;
  min-width:0
}
.product-card-admin-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:14px
}
.product-card-admin-brand{
  display:flex;
  gap:12px;
  align-items:center;
  min-width:0
}
.product-card-admin-icon{
  width:54px;height:54px;
  flex:0 0 54px;
  border-radius:17px;
  overflow:hidden;
  display:grid;
  place-items:center;
  background:rgba(255,255,255,.86);
  box-shadow:0 8px 22px rgba(57,70,112,.10)
}
.product-card-admin-icon img{width:100%;height:100%;object-fit:cover}
.product-card-admin-icon span{font-size:23px}
.product-card-admin-copy{min-width:0}
.product-card-admin-copy h3{
  margin:2px 0 3px!important;
  font-size:20px!important;
  letter-spacing:-.02em
}
.product-card-admin-copy p{
  margin:0;
  color:var(--muted);
  font-size:11px;
  line-height:1.4;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  max-width:330px
}

.product-card-admin-stats{
  display:grid;
  grid-template-columns:.7fr 1.2fr 1fr;
  gap:8px;
  margin:14px 0
}
.product-card-admin-stats>div{
  padding:10px 11px;
  border-radius:14px;
  background:rgba(245,247,255,.76);
  border:1px solid rgba(255,255,255,.9);
  display:grid
}
.product-card-admin-stats span{
  font-size:8px;
  color:var(--muted);
  text-transform:uppercase;
  letter-spacing:.07em
}
.product-card-admin-stats b{font-size:11px;margin-top:3px}

.product-card-admin-actions{margin-bottom:10px}

.v12-details{
  border-radius:13px;
  background:rgba(242,245,255,.62);
  border:1px solid rgba(255,255,255,.9);
  overflow:hidden
}
.v12-details>summary{
  cursor:pointer;
  list-style:none;
  padding:10px 12px;
  font-size:11px;
  font-weight:800;
  color:#5c68a7;
  display:flex;
  align-items:center;
  justify-content:space-between
}
.v12-details>summary::-webkit-details-marker{display:none}
.v12-details>summary:after{content:'＋';font-size:13px}
.v12-details[open]>summary:after{content:'−'}
.v12-details[open]>summary{
  border-bottom:1px solid rgba(108,121,159,.09)
}

.product-package-list-v12{
  display:grid;
  gap:8px;
  max-height:410px;
  overflow:auto;
  padding-right:4px
}
.product-package-list-v12::-webkit-scrollbar{width:6px}
.product-package-list-v12::-webkit-scrollbar-thumb{
  background:linear-gradient(#93a9ff,#bb87ff);
  border-radius:999px
}

.package-card-v12{
  padding:11px 12px;
  border-radius:15px;
  background:rgba(255,255,255,.68);
  border:1px solid rgba(255,255,255,.94)
}
.package-card-v12.inactive{opacity:.58}
.package-card-main-v12{
  display:grid;
  grid-template-columns:minmax(150px,1.3fr) minmax(100px,.8fr) minmax(150px,1fr);
  gap:10px;
  align-items:center
}
.package-name-v12{
  display:flex;
  align-items:center;
  gap:8px;
  min-width:0
}
.package-status-dot{
  width:8px;height:8px;border-radius:999px;
  flex:0 0 8px
}
.package-status-dot.on{background:#57c994;box-shadow:0 0 0 4px rgba(87,201,148,.12)}
.package-status-dot.off{background:#c6cbd7}
.package-name-v12>div{display:grid;min-width:0}
.package-name-v12 b{
  font-size:12px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis
}
.package-name-v12 small{font-size:9px;color:var(--muted);margin-top:2px}

.package-price-v12{
  display:grid;
  justify-items:end
}
.package-price-v12 small,
.package-meta-v12 small{
  font-size:8px;color:var(--muted);
  letter-spacing:.06em
}
.package-price-v12 strong{
  font-size:17px;
  color:#5665b8;
  margin-top:2px
}
.package-meta-v12{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:7px
}
.package-meta-v12 span{
  padding:7px 8px;
  border-radius:10px;
  background:rgba(242,245,255,.7);
  display:grid
}
.package-meta-v12 b{font-size:10px;margin-top:2px}
.package-meta-v12 .positive{color:#2d7e5a}
.package-meta-v12 .negative{color:#bd4f5d}

.package-edit-v12{
  margin-top:9px;
  background:rgba(248,249,255,.72)
}
.add-package-v12{
  margin-top:10px;
  background:linear-gradient(135deg,rgba(236,242,255,.80),rgba(247,239,255,.72))
}
.package-empty-v12{
  padding:16px;
  border-radius:14px;
  background:rgba(249,250,255,.72);
  display:grid;
  text-align:center
}
.package-empty-v12 span{font-size:12px;font-weight:800}
.package-empty-v12 small{margin-top:3px;color:var(--muted)}

.input-prefix-v12,
.input-suffix-v12{
  display:grid;
  grid-template-columns:auto 1fr;
  align-items:center;
  border-radius:13px;
  background:rgba(250,251,255,.82);
  border:1px solid rgba(115,127,166,.13);
  overflow:hidden
}
.input-suffix-v12{grid-template-columns:1fr auto}
.input-prefix-v12>span,
.input-suffix-v12>span{
  padding:0 10px;
  font-size:10px;
  color:#737d98;
  font-weight:800
}
.input-prefix-v12 input,
.input-suffix-v12 input{
  border:0!important;
  background:transparent!important
}

@media(max-width:1200px){
  .products-v12-grid{grid-template-columns:1fr}
  .products-v12-legend{min-width:420px}
  .product-card-admin-copy p{max-width:520px}
}

@media(max-width:850px){
  .products-v12-intro{flex-direction:column;align-items:flex-start}
  .products-v12-legend{min-width:0;width:100%}
}

@media(max-width:680px){
  .products-v12-legend{grid-template-columns:1fr}
  .products-v12-form{padding:13px}
  .v12-form-grid.two-col,
  .v12-form-grid.three-col,
  .v12-form-grid.small-cols{grid-template-columns:1fr}
  .product-card-admin-v12{padding:14px!important}
  .product-card-admin-head{flex-direction:column}
  .product-card-admin-stats{grid-template-columns:1fr 1fr}
  .product-card-admin-stats>div:last-child{grid-column:1/-1}
  .package-card-main-v12{
    grid-template-columns:1fr auto
  }
  .package-meta-v12{
    grid-column:1/-1
  }
  .package-price-v12{justify-items:end}
  .product-package-list-v12{max-height:360px}
}


/* =========================================================
   V15 Admin Operations
   ========================================================= */
.nav-ico.green{background:linear-gradient(135deg,#54d5a0,#4fb8a6)}
.nav-ico.amber{background:linear-gradient(135deg,#ffb95d,#ff8a6c)}
.nav-ico.teal{background:linear-gradient(135deg,#45c9c4,#5b9df8)}
.nav-ico.red{background:linear-gradient(135deg,#ff687c,#ef5daf)}
.side-nav a{position:relative}
.nav-count{
  margin-left:auto;min-width:20px;height:20px;padding:0 5px;border-radius:999px;
  display:inline-flex;align-items:center;justify-content:center;background:#ff5f78;color:#fff;
  font-size:9px;box-shadow:0 5px 13px rgba(255,95,120,.22)
}

.v15-admin-top{display:grid!important;grid-template-columns:minmax(210px,1fr) minmax(300px,520px) auto!important;gap:18px!important;align-items:center!important}
.admin-title-wrap{min-width:0}
.global-search-v15{
  display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:8px;
  padding:7px 8px 7px 13px;border-radius:18px;
  background:rgba(255,255,255,.65);border:1px solid rgba(255,255,255,.9);
  box-shadow:0 10px 28px rgba(67,80,126,.07)
}
.global-search-v15>span{color:#7d87a1;font-size:17px}
.global-search-v15 input{
  min-height:34px!important;border:0!important;background:transparent!important;padding:0!important;
  box-shadow:none!important;font-size:12px!important
}
.global-search-v15 button{
  border:0;padding:8px 12px;border-radius:12px;background:#edf1ff;color:#5f6db2;font-weight:800;cursor:pointer
}
.admin-top-actions{display:flex;align-items:center;gap:9px}
.notification-button-v15{
  width:44px;height:44px;border-radius:15px;background:rgba(255,255,255,.67);
  display:grid;place-items:center;color:#6974b3;position:relative;font-weight:900;
  border:1px solid rgba(255,255,255,.9)
}
.notification-button-v15 b{
  position:absolute;right:-4px;top:-4px;min-width:18px;height:18px;padding:0 4px;border-radius:999px;
  display:grid;place-items:center;background:#ff607c;color:white;font-size:8px
}

.dashboard-welcome-v15{
  display:flex;justify-content:space-between;align-items:center;gap:24px;
  padding:22px 24px;margin-bottom:14px
}
.dashboard-welcome-v15 h2{font-size:27px;margin:5px 0}
.dashboard-welcome-v15 p{margin:0;color:var(--muted)}
.dashboard-quick-v15{display:flex;gap:8px;flex-wrap:wrap}
.dashboard-quick-v15 a{
  display:flex;align-items:center;gap:8px;padding:11px 13px;border-radius:15px;
  background:rgba(255,255,255,.70);border:1px solid rgba(255,255,255,.92);
  font-size:11px;color:#5d6786
}
.dashboard-quick-v15 span{width:28px;height:28px;border-radius:9px;background:#edf1ff;display:grid;place-items:center;color:#6572ba}
.v15-stat-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important}
.stat-v15.danger{background:linear-gradient(145deg,rgba(255,255,255,.78),rgba(255,231,236,.72))}
.stat-v15.warning{background:linear-gradient(145deg,rgba(255,255,255,.78),rgba(255,244,220,.74))}
.dashboard-grid-v15{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(280px,.7fr);gap:14px;margin-top:14px}
.stock-alert-list-v15{display:grid;gap:8px}
.stock-alert-row-v15{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:11px 12px;border-radius:14px
}
.stock-alert-row-v15.low{background:#fff5db}
.stock-alert-row-v15.zero{background:#ffe8ed}
.stock-alert-row-v15>div{display:grid}.stock-alert-row-v15 small{font-size:9px;color:var(--muted);margin-top:2px}
.stock-alert-row-v15 strong{font-size:21px}
.empty-mini-v15{padding:18px;text-align:center;color:var(--muted);font-size:11px;background:rgba(248,249,255,.62);border-radius:14px}

.customer-toolbar-v15{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:14px}
.customer-toolbar-v15 h2{margin:4px 0}
.inline-search-v15{display:flex;gap:8px;width:min(460px,100%)}
.inline-search-v15 input{flex:1}
.customer-grid-v15{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.customer-card-v15{padding:16px;border-radius:22px;display:grid;grid-template-columns:auto 1fr;gap:11px;transition:.2s}
.customer-card-v15:hover{transform:translateY(-3px)}
.customer-avatar-v15{
  width:45px;height:45px;border-radius:15px;display:grid;place-items:center;
  background:linear-gradient(135deg,#5c8fff,#9b6dff,#ef69bb);color:white;font-weight:900
}
.customer-avatar-v15.large{width:62px;height:62px;border-radius:20px;font-size:21px}
.customer-card-copy-v15{display:grid;align-content:center;min-width:0}
.customer-card-copy-v15 h3{margin:0;font-size:15px}
.customer-card-copy-v15 span,.customer-card-copy-v15 small{font-size:10px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.customer-card-stats-v15{grid-column:1/-1;display:grid;grid-template-columns:.65fr .8fr 1.4fr;gap:7px}
.customer-card-stats-v15 span{padding:9px;border-radius:12px;background:rgba(244,247,255,.74);display:grid}
.customer-card-stats-v15 small{font-size:8px;color:var(--muted);text-transform:uppercase}.customer-card-stats-v15 b{font-size:11px;margin-top:2px}
.customer-last-v15{grid-column:1/-1;font-size:9px;color:#7d86a0}
.customer-profile-v15{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:22px;margin-bottom:14px}
.customer-profile-main-v15{display:flex;align-items:center;gap:13px}.customer-profile-main-v15 h2{margin:3px 0}.customer-profile-main-v15 p{margin:0;color:var(--muted)}
.customer-profile-stats-v15{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;min-width:420px}
.customer-profile-stats-v15 span{padding:11px;border-radius:14px;background:rgba(255,255,255,.66);display:grid}.customer-profile-stats-v15 small{font-size:8px;color:var(--muted);text-transform:uppercase}.customer-profile-stats-v15 b{margin-top:3px;font-size:12px}

.report-stat-v15{margin-bottom:14px}
.reports-grid-v15{display:grid;grid-template-columns:1.35fr .85fr;gap:14px}
.revenue-bars-v15{display:grid;gap:8px;max-height:470px;overflow:auto;padding-right:5px}
.revenue-row-v15{display:grid;grid-template-columns:55px 1fr 100px;gap:10px;align-items:center;font-size:10px}
.revenue-row-v15>div{height:9px;background:#edf0f8;border-radius:999px;overflow:hidden}.revenue-row-v15 i{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,#5b8dff,#a36eff,#ed72bb)}
.revenue-row-v15 b{text-align:right;font-size:10px}
.ranking-list-v15{display:grid;gap:7px}
.ranking-list-v15>div{display:grid;grid-template-columns:30px 1fr auto auto;gap:8px;align-items:center;padding:10px;border-radius:13px;background:rgba(247,248,255,.70)}
.ranking-list-v15>div>strong{color:#6975b7}.ranking-list-v15 span{display:grid}.ranking-list-v15 span b{font-size:11px}.ranking-list-v15 small{font-size:8px;color:var(--muted)}.ranking-list-v15 em{font-size:9px;color:var(--muted);font-style:normal}.ranking-list-v15>div>b{font-size:10px}
.report-note-v15{margin-top:14px}

.stock-alert-hero-v15{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:22px;margin-bottom:14px}
.stock-alert-hero-v15 h2{margin:5px 0}.stock-alert-hero-v15 p{margin:0;color:var(--muted)}
.threshold-form-v15{display:flex;align-items:end;gap:8px}.threshold-form-v15 label{font-size:10px;color:var(--muted)}.threshold-form-v15 input{width:90px!important}
.stock-stat-v15{grid-template-columns:repeat(3,1fr)!important;margin-bottom:14px}
.stock-catalog-v15{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:11px}
.stock-item-v15{padding:16px;border-radius:22px;display:grid;grid-template-columns:1fr auto;gap:12px;position:relative;overflow:hidden}
.stock-item-v15.out{background:linear-gradient(145deg,rgba(255,255,255,.78),rgba(255,231,236,.77))}
.stock-item-v15.low{background:linear-gradient(145deg,rgba(255,255,255,.78),rgba(255,245,218,.78))}
.stock-item-copy-v15 h3{margin:3px 0;font-size:16px}.stock-item-copy-v15 small{color:var(--muted)}
.stock-number-v15{display:grid;text-align:right}.stock-number-v15 strong{font-size:32px;line-height:1}.stock-number-v15 span{font-size:8px;color:var(--muted)}
.stock-mini-v15{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;gap:7px}.stock-mini-v15 span{display:flex;justify-content:space-between;padding:8px;border-radius:11px;background:rgba(255,255,255,.58)}.stock-mini-v15 small{font-size:8px;color:var(--muted)}
.stock-state-v15{grid-column:1/-1;padding:6px 8px;border-radius:9px;font-size:9px;font-weight:900;text-align:center}
.stock-state-v15.out{background:#ffdfe5;color:#b4485a}.stock-state-v15.low{background:#fff0c8;color:#97651c}.stock-state-v15.safe{background:#dff7ec;color:#2e7b58}
.stock-item-v15>a{grid-column:1/-1;font-size:10px;color:#6370af}

.notification-hero-v15{display:flex;align-items:center;justify-content:space-between;padding:22px 24px;margin-bottom:14px}.notification-hero-v15 h2{margin:5px 0}.notification-hero-v15 p{margin:0;color:var(--muted)}
.notification-hero-count-v15{width:70px;height:70px;border-radius:22px;display:grid;place-items:center;background:linear-gradient(135deg,#5e8dff,#996eff,#e869ba);color:white;font-size:26px;font-weight:900;box-shadow:0 14px 35px rgba(106,103,236,.25)}
.notification-grid-v15{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.notification-section-v15{padding:15px;border-radius:22px}.notification-section-v15 .panel-head{margin-bottom:8px}
.notification-row-v15{display:grid;grid-template-columns:auto 1fr auto;gap:9px;align-items:center;padding:9px;border-radius:13px;margin-top:6px;background:rgba(247,249,255,.67)}
.notification-icon-v15{width:34px;height:34px;border-radius:11px;display:grid;place-items:center;background:#edf1ff;color:#6874b6}
.notification-row-v15>div{display:grid}.notification-row-v15 b{font-size:10px}.notification-row-v15 small{font-size:8px;color:var(--muted);margin-top:2px}.notification-row-v15 time{font-size:8px;color:var(--muted)}
.email-log-panel-v15{margin-top:14px}.email-error-v15{max-width:260px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

.search-hero-v15{padding:24px;margin-bottom:14px}.search-hero-v15 h2{margin:5px 0 16px}.search-big-v15{display:flex;gap:9px;width:min(760px,100%)}.search-big-v15 input{flex:1;font-size:14px!important}
.search-results-grid-v15{display:grid;grid-template-columns:1.2fr .8fr;gap:14px}.search-result-list-v15{display:grid;gap:7px}
.search-result-list-v15>a{display:grid;grid-template-columns:1.2fr .8fr auto;gap:9px;align-items:center;padding:10px 11px;border-radius:13px;background:rgba(247,249,255,.70)}
.search-result-list-v15>a>div{display:grid}.search-result-list-v15 b{font-size:10px}.search-result-list-v15 small,.search-result-list-v15 span{font-size:8px;color:var(--muted)}.search-result-list-v15 strong{font-size:10px}.search-result-list-v15 em{font-size:9px;font-style:normal;color:#6672af}

@media(max-width:1200px){
  .v15-admin-top{grid-template-columns:1fr auto!important}
  .global-search-v15{grid-column:1/-1;grid-row:2}
  .v15-stat-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .dashboard-grid-v15,.reports-grid-v15,.search-results-grid-v15{grid-template-columns:1fr}
  .customer-grid-v15,.stock-catalog-v15{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:850px){
  .dashboard-welcome-v15,.customer-toolbar-v15,.customer-profile-v15,.stock-alert-hero-v15,.notification-hero-v15{align-items:flex-start;flex-direction:column}
  .customer-profile-stats-v15{min-width:0;width:100%}
  .notification-grid-v15{grid-template-columns:1fr}
}
@media(max-width:620px){
  .v15-admin-top{display:flex!important;flex-wrap:wrap}
  .global-search-v15{order:3;width:100%}
  .admin-title-wrap{flex:1}
  .v15-stat-grid,.stock-stat-v15{grid-template-columns:1fr!important}
  .customer-grid-v15,.stock-catalog-v15{grid-template-columns:1fr}
  .customer-profile-stats-v15{grid-template-columns:1fr}
  .customer-card-stats-v15{grid-template-columns:1fr 1fr}.customer-card-stats-v15 span:last-child{grid-column:1/-1}
  .revenue-row-v15{grid-template-columns:48px 1fr}.revenue-row-v15 b{grid-column:2;text-align:left}
  .ranking-list-v15>div{grid-template-columns:25px 1fr}.ranking-list-v15 em,.ranking-list-v15>div>b{grid-column:2}
  .search-result-list-v15>a{grid-template-columns:1fr}.search-result-list-v15 em{justify-self:start}
}


/* =======================
   V16 Branding Controls
   ======================= */
.brand-orb,.admin-avatar{overflow:hidden}
.brand-orb img,.admin-avatar img,.big-orb img{
  width:100%;height:100%;object-fit:cover;display:block;border-radius:inherit
}
.branding-preview-v16{
  display:grid;grid-template-columns:150px 1fr 120px;gap:16px;
  padding:18px;border-radius:22px;background:rgba(249,250,255,.62);
  border:1px solid rgba(255,255,255,.92)
}
.branding-preview-item-v16,.branding-preview-copy-v16{display:grid;align-content:center}
.preview-logo-v16,.preview-favicon-v16{
  width:76px;height:76px;border-radius:22px;background:linear-gradient(145deg,#5c8dff,#8c70ff 58%,#ff79be);
  display:grid;place-items:center;color:#fff;font-size:28px;font-weight:900;
  box-shadow:0 10px 24px rgba(103,111,255,.24),inset 0 1px 1px rgba(255,255,255,.5)
}
.preview-logo-v16 img,.preview-favicon-v16 img{
  width:100%;height:100%;object-fit:cover;border-radius:inherit;display:block;background:#fff
}
.branding-preview-copy-v16 h3{margin:5px 0 2px;font-size:24px;letter-spacing:-.03em}
.branding-preview-copy-v16 p{margin:0;color:var(--muted)}
.branding-preview-copy-v16 small{margin-top:6px;color:#7b86a2}
.settings-grid-v16{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(280px,.6fr);gap:16px}
@media(max-width:960px){
  .settings-grid-v16{grid-template-columns:1fr}
  .branding-preview-v16{grid-template-columns:1fr;justify-items:start}
}


/* =========================================================
   V17 Internal card scrolling
   ========================================================= */
.scroll-card-v17{
  padding:0!important;
  overflow:hidden!important;
}
.scroll-card-inner-v17{
  max-height:calc(100vh - 150px);
  overflow-y:auto;
  overflow-x:hidden;
  padding:20px 22px 24px;
  overscroll-behavior:contain;
  scrollbar-width:thin;
  scrollbar-color:#9eb0ee transparent;
}
.scroll-card-inner-v17::-webkit-scrollbar{width:7px}
.scroll-card-inner-v17::-webkit-scrollbar-track{background:transparent}
.scroll-card-inner-v17::-webkit-scrollbar-thumb{
  background:linear-gradient(180deg,#84a4ff,#a87fff,#e879c4);
  border-radius:999px
}
.scroll-card-inner-v17::-webkit-scrollbar-thumb:hover{
  background:linear-gradient(180deg,#7396ff,#986eff,#db68b6)
}

/* keep the section heading visible while scrolling */
.settings-main-card-v17 .panel-head,
.settings-side-card-v17 > .scroll-card-inner-v17 > .eyebrow:first-child{
  position:sticky;
  top:0;
  z-index:5;
}
.settings-main-card-v17 .panel-head{
  margin:-20px -22px 18px;
  padding:18px 22px 14px;
  background:linear-gradient(180deg,rgba(249,251,255,.97),rgba(249,251,255,.90),rgba(249,251,255,.72));
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
  border-bottom:1px solid rgba(105,117,157,.08);
}

/* subtle separation between long settings groups */
.settings-main-card-v17 .settings-divider{
  margin:20px 0!important;
}

/* optional compact scroll behavior for any long admin panel */
.admin-main .panel.auto-scroll-v17{
  max-height:calc(100vh - 165px);
  overflow-y:auto;
  overflow-x:hidden;
  scrollbar-width:thin;
  scrollbar-color:#9eb0ee transparent;
}
.admin-main .panel.auto-scroll-v17::-webkit-scrollbar{width:7px}
.admin-main .panel.auto-scroll-v17::-webkit-scrollbar-thumb{
  background:linear-gradient(180deg,#84a4ff,#a87fff);
  border-radius:999px
}

@media(max-width:960px){
  .scroll-card-inner-v17{
    max-height:70vh;
  }
}

@media(max-width:700px){
  .scroll-card-v17{
    overflow:visible!important;
  }
  .scroll-card-inner-v17{
    max-height:none;
    overflow:visible;
    padding:16px;
  }
  .settings-main-card-v17 .panel-head{
    position:static;
    margin:0 0 16px;
    padding:0;
    background:transparent;
    border-bottom:0;
    backdrop-filter:none;
    -webkit-backdrop-filter:none;
  }
}


/* =========================================================
   V18 Sidebar compact width refinement
   ========================================================= */
.admin-shell{
  grid-template-columns:228px 1fr!important;
  gap:14px!important;
}
.sidebar{
  padding:16px 12px 14px!important;
  border-radius:30px!important;
}
.sidebar .brand{
  gap:10px!important;
  font-size:14px!important;
  padding:2px 4px 2px 2px;
}
.sidebar .brand-orb{
  width:34px!important;
  height:34px!important;
  border-radius:12px!important;
  font-size:15px!important;
}
.side-nav{
  gap:4px!important;
  margin-top:18px!important;
}
.side-nav a{
  padding:8px 9px!important;
  min-height:46px;
  border-radius:14px!important;
  gap:10px!important;
  font-size:12px!important;
  font-weight:720!important;
}
.nav-ico{
  width:30px!important;
  height:30px!important;
  border-radius:10px!important;
  font-size:13px!important;
  flex:0 0 30px;
}
.nav-count{
  min-width:18px!important;
  height:18px!important;
  font-size:8px!important;
}
.side-bottom{
  margin-top:18px!important;
  padding:0 5px 2px;
}
.side-bottom small{
  font-size:11px!important;
}
.side-bottom .link-btn{
  font-size:11px!important;
  margin-top:6px;
  display:inline-block;
}

/* medium screens */
@media(max-width:1200px){
  .admin-shell{
    grid-template-columns:214px 1fr!important;
    gap:12px!important;
  }
  .sidebar{
    padding:14px 11px 12px!important;
  }
}

/* tablet: still vertical but slimmer */
@media(max-width:900px){
  .admin-shell{
    grid-template-columns:198px 1fr!important;
    gap:10px!important;
    padding:10px!important;
  }
  .sidebar{
    padding:12px 10px!important;
    border-radius:26px!important;
  }
  .side-nav{
    grid-template-columns:1fr!important;
    gap:3px!important;
    margin-top:14px!important;
  }
  .side-nav a{
    min-height:42px!important;
    padding:7px 8px!important;
    gap:9px!important;
  }
  .nav-ico{
    width:28px!important;
    height:28px!important;
    border-radius:9px!important;
  }
}

/* mobile: compact floating sidebar width */
@media(max-width:620px){
  .admin-shell{
    grid-template-columns:1fr!important;
    padding:8px!important;
  }
  .sidebar{
    width:min(216px,78vw)!important;
    max-width:min(216px,78vw)!important;
    padding:12px 10px!important;
    border-radius:24px!important;
  }
  .side-nav{
    grid-template-columns:1fr!important;
  }
  .side-nav a{
    font-size:11px!important;
    min-height:40px!important;
    padding:7px 8px!important;
  }
  .sidebar .brand{
    font-size:13px!important;
  }
}


/* ================= V26 RESELLER + STAFF ================= */
.v26-admin-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.v26-scroll-list{max-height:calc(100vh - 220px);overflow:auto;display:grid;gap:9px;padding-right:5px;scrollbar-width:thin}
.v26-reseller-card,.v26-staff-card,.v26-price-row{background:rgba(255,255,255,.62);border:1px solid rgba(255,255,255,.9);border-radius:16px;padding:12px;display:grid;gap:8px}
.v26-reseller-card>div:first-child{display:grid;gap:3px}.v26-reseller-card h3{margin:0;font-size:14px}.v26-reseller-card small,.v26-price-row small,.v26-staff-card small{color:var(--muted);font-size:9px}.v26-reseller-card p{margin:3px 0 0;font-size:10px;color:#65708b}
.v26-inline-form{display:grid;grid-template-columns:minmax(120px,1fr) auto auto auto;gap:6px;align-items:center}.v26-inline-form input,.v26-price-row input,.v26-staff-card input,.v26-staff-card select{min-width:0}
.v26-price-row{grid-template-columns:minmax(170px,1fr) 130px auto auto;align-items:center}.v26-price-row>div{display:grid}
.v26-staff-card{grid-template-columns:minmax(170px,1fr) 120px 120px 165px auto auto;align-items:center}.v26-staff-card>div{display:grid}
.v26-check{display:flex!important;align-items:center;gap:5px!important;font-size:10px!important;white-space:nowrap}.v26-check input{width:auto!important;margin:0!important}
.reseller-public-v26{padding-top:70px}.reseller-price-note-v26{font-size:10px;color:#73809c;margin-top:10px}.reseller-price-note-v26 b{color:#6c63df}.reseller-price-note-v26 s{opacity:.7}
.reseller-dashboard-v26{padding:80px 0 60px}.reseller-dash-head-v26{display:flex;justify-content:space-between;gap:20px;align-items:end;margin-bottom:16px}.reseller-dash-head-v26 h1{font-size:42px;margin:5px 0}.reseller-dash-head-v26 p{color:#73809c;margin:0}.reseller-dash-actions-v26{display:flex;gap:8px;flex-wrap:wrap}.reseller-stats-v26{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:14px}.reseller-stats-v26>div{padding:17px;border-radius:20px;display:grid}.reseller-stats-v26 small{font-size:9px;color:#7b86a2;text-transform:uppercase}.reseller-stats-v26 b{font-size:22px;margin-top:4px}.reseller-orders-v26{padding:18px}
@media(max-width:1000px){.v26-admin-grid{grid-template-columns:1fr}.v26-scroll-list{max-height:none}.v26-staff-card{grid-template-columns:1fr 1fr}.v26-price-row{grid-template-columns:1fr 1fr}.v26-inline-form{grid-template-columns:1fr 1fr}.reseller-dash-head-v26{align-items:flex-start;flex-direction:column}}
@media(max-width:650px){.reseller-stats-v26{grid-template-columns:1fr}.v26-staff-card,.v26-price-row,.v26-inline-form{grid-template-columns:1fr}.reseller-dashboard-v26{padding-top:50px}.reseller-dash-head-v26 h1{font-size:34px}}

/* V27 Complete Joki Workflow */
.joki-price-box{display:flex;justify-content:space-between;align-items:center;padding:15px 16px;border-radius:16px;background:linear-gradient(135deg,#eef4ff,#f7efff);border:1px solid rgba(113,127,200,.12)}
.joki-price-box b{font-size:20px;color:#5f6ed5}.joki-admin-grid-v27{display:grid;grid-template-columns:1fr 1fr;gap:14px}.deadline-chip-v27{display:inline-flex;padding:7px 10px;border-radius:999px;font-size:10px;font-weight:800;background:#edf3ff;color:#6372b4;margin:8px 0}.deadline-chip-v27.urgent{background:#fff0d8;color:#a16718}.deadline-chip-v27.overdue{background:#ffe6eb;color:#b84255}.v27-result-list,.v27-results-public{display:grid;gap:9px}.v27-result-item{display:grid;padding:12px 14px;border-radius:14px;background:rgba(255,255,255,.72);border:1px solid rgba(255,255,255,.9)}.v27-result-item small{font-size:9px;color:#8790a7;margin-top:3px}.v27-revision-card{padding:13px;border-radius:15px;background:rgba(255,255,255,.65);display:grid;gap:10px;margin-top:8px}.v27-revision-card>div{display:grid;gap:3px}.v27-chat-list{display:grid;gap:8px;max-height:420px;overflow:auto;margin:12px 0}.v27-chat{max-width:82%;padding:11px 13px;border-radius:16px;background:#f3f5ff}.v27-chat.admin{margin-left:auto;background:#e9f7f0}.v27-chat p{margin:4px 0;font-size:12px;line-height:1.55}.v27-chat small{font-size:8px;color:#8a93a8}.v27-public-joki{display:grid;gap:16px;margin-top:20px}.v27-complete-box,.v27-rating-box{padding:14px;border-radius:18px;background:rgba(245,249,255,.8)}
@media(max-width:850px){.joki-admin-grid-v27{grid-template-columns:1fr}.v27-chat{max-width:95%}}


/* =========================================================
   V29 - Modular features + grouped admin navigation
   ========================================================= */
.feature-toggle-grid-v29{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.feature-toggle-card-v29{position:relative;display:grid!important;grid-template-columns:auto 1fr auto;align-items:center;gap:11px;padding:14px!important;border-radius:18px;background:rgba(248,250,255,.72);border:1px solid rgba(121,132,174,.14);cursor:pointer;transition:.18s}
.feature-toggle-card-v29:hover{transform:translateY(-1px);border-color:rgba(103,116,232,.25)}
.feature-toggle-card-v29 input{position:absolute;opacity:0;pointer-events:none}
.feature-toggle-icon-v29{width:40px;height:40px;border-radius:13px;display:grid;place-items:center;background:#edf1ff;color:#6674df;font-size:16px;font-weight:900}
.feature-toggle-card-v29.premium .feature-toggle-icon-v29{background:#eaf2ff;color:#567de2}.feature-toggle-card-v29.joki .feature-toggle-icon-v29{background:#f1eaff;color:#8a65db}
.feature-toggle-copy-v29{display:grid;gap:3px}.feature-toggle-copy-v29 b{font-size:12px}.feature-toggle-copy-v29 small{font-size:9px;line-height:1.4;color:var(--muted)}
.feature-toggle-card-v29>i{width:40px;height:22px;border-radius:999px;background:#dbe0ec;position:relative;transition:.2s}
.feature-toggle-card-v29>i:after{content:'';position:absolute;width:16px;height:16px;left:3px;top:3px;border-radius:50%;background:white;box-shadow:0 2px 6px rgba(40,50,80,.15);transition:.2s}
.feature-toggle-card-v29 input:checked~i{background:linear-gradient(90deg,#6689f2,#8b6ce8)}
.feature-toggle-card-v29 input:checked~i:after{transform:translateX(18px)}

.side-nav-v29{gap:7px!important}.side-nav-v29>.nav-main-v29{margin-bottom:2px}
.admin-nav-group-v29{border:0;padding:0;margin:0}.admin-nav-group-v29>summary{list-style:none;display:flex;align-items:center;justify-content:space-between;padding:8px 10px 5px;color:#9aa1b5;font-size:8px;font-weight:900;letter-spacing:.11em;cursor:pointer;user-select:none}
.admin-nav-group-v29>summary::-webkit-details-marker{display:none}.admin-nav-group-v29>summary i{font-style:normal;font-size:11px;transition:.2s}.admin-nav-group-v29[open]>summary i{transform:rotate(180deg)}
.admin-nav-group-v29>div{display:grid;gap:3px}.admin-nav-group-v29:not([open])>div{display:none}
.sidebar-collapsed-v19 .admin-nav-group-v29>summary span{display:none}.sidebar-collapsed-v19 .admin-nav-group-v29>summary{justify-content:center;padding:5px 0}.sidebar-collapsed-v19 .admin-nav-group-v29>summary i{font-size:9px}
@media(max-width:760px){.feature-toggle-grid-v29{grid-template-columns:1fr}}