/* VOLT v9.4 · wallet: the member page, pay-from-wallet on orders, admin wallets */
@keyframes wlUp{from{opacity:0;transform:translateY(16px)}}
@keyframes wlCard{from{opacity:0;transform:perspective(900px) rotateX(18deg) translateY(24px) scale(.94)}}
@keyframes wlShine{0%,60%{transform:translateX(120%) skewX(-20deg)}100%{transform:translateX(-260%) skewX(-20deg)}}
@keyframes wlWave{0%,100%{opacity:.35}50%{opacity:1}}
@keyframes wlPop{from{opacity:0;transform:scale(.8)}}

.wl-page{display:grid;gap:18px;min-width:0;animation:wlUp .5s cubic-bezier(.2,.8,.2,1) both}
.wl-page :where(h2,p,b,small){overflow-wrap:anywhere}
.wl-top{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:18px;align-items:stretch}

/* ---------- the card ---------- */
.wl-card{position:relative;overflow:hidden;isolation:isolate;display:grid;align-content:space-between;gap:8px;min-height:228px;padding:24px 26px;border-radius:28px;color:#1A0B05;
  background:radial-gradient(90% 120% at 0% 100%,#FFD3B0 0%,transparent 55%),radial-gradient(120% 140% at 100% 0%,#FFB37A 0%,#FF7A45 42%,#E5531F 100%);
  box-shadow:0 30px 60px -28px #FF6B3D,inset 0 1px 0 #ffffff80;animation:wlCard .8s cubic-bezier(.2,.9,.25,1) both;transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.wl-card::before,.wl-card::after{content:"";position:absolute;z-index:-1;border-radius:50%;border:1px solid #1A0B0514}
.wl-card::before{width:340px;height:340px;left:-120px;bottom:-200px;background:#ffffff14}
.wl-card::after{width:220px;height:220px;left:30%;top:-140px}
.wl-card:hover{transform:translateY(-3px) rotate(-.4deg)}
.wl-card-top{display:flex;align-items:center;justify-content:space-between}
.wl-brand{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:900;letter-spacing:.14em;direction:ltr}
.wl-brand .icon{width:20px;height:20px}
.wl-chip{width:46px;height:34px;border-radius:9px;background:linear-gradient(135deg,#FFF1C2,#E9B949 55%,#C88F1E);box-shadow:inset 0 0 0 1px #8a5a0f55,inset 12px 0 0 -11px #8a5a0f66,inset -12px 0 0 -11px #8a5a0f66,inset 0 10px 0 -9px #8a5a0f66}
.wl-card>small{margin-top:14px;font-size:13px;font-weight:800;color:#3a1405}
.wl-balance{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px;font-size:clamp(34px,6vw,50px);font-weight:900;line-height:1.1;direction:rtl;font-variant-numeric:tabular-nums}
.wl-balance em{font-style:normal;font-size:16px;font-weight:800;color:#3a1405}
.wl-card-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:13px;font-weight:800;color:#2a0e04}
.wl-waves{display:inline-flex;gap:3px;direction:ltr}
.wl-waves i{width:4px;height:14px;border-radius:4px;background:#1A0B05;animation:wlWave 1.8s ease-in-out infinite}
.wl-waves i:nth-child(2){height:20px;animation-delay:.2s}.wl-waves i:nth-child(3){height:26px;animation-delay:.4s}
.wl-shine{position:absolute;inset:0 auto 0 0;z-index:1;width:45%;background:linear-gradient(90deg,transparent,#ffffff59,transparent);pointer-events:none;animation:wlShine 5.5s ease-in-out 1.2s infinite}

/* ---------- panels ---------- */
.wl-panel{position:relative;min-width:0;margin:0;padding:20px;border-radius:24px;border:1px solid var(--v8-line);background:var(--v8-card);animation:wlUp .55s cubic-bezier(.2,.8,.2,1) .1s both}
.wl-panel h2{display:flex;align-items:center;gap:9px;margin:0;font-size:17px;font-weight:900;line-height:1.55}
.wl-panel h2 .icon{flex:none;width:20px;height:20px;color:var(--v8-acc2)}
.wl-head{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:6px 12px;margin-bottom:14px}
.wl-head>span{font-size:12px;font-weight:700;color:var(--v8-t3)}
.wl-how{display:grid;align-content:start;gap:12px}
.wl-how ul{display:grid;gap:8px;margin:0;padding:0;list-style:none}
.wl-how li{position:relative;padding:9px 30px 9px 12px;border-radius:13px;background:#ffffff05;font-size:13px;line-height:1.85;color:var(--v8-t2)}
.wl-how li::before{content:"";position:absolute;right:12px;top:1.15em;width:8px;height:8px;border-radius:50%;background:var(--v8-acc);box-shadow:0 0 0 4px #FF6B3D22}
.wl-how .action-row{margin:0}
.wl-how .btn,.wl-order .btn,.wl-paybox .btn{display:inline-flex;align-items:center;gap:6px;width:auto}
.wl-how .btn .icon,.wl-order .btn .icon,.wl-paybox .btn .icon{width:16px;height:16px}

/* pending orders */
.wl-pending{border-color:#FFC24A40}
.wl-order{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px 14px;padding:12px 14px;border-radius:16px;border:1px solid var(--v8-line);background:#ffffff05;animation:wlUp .45s both}
.wl-order+.wl-order{margin-top:8px}
.wl-order>div{display:grid;flex:1 1 220px;min-width:0}
.wl-order b{font-size:14px;font-weight:900;line-height:1.6}
.wl-order small{font-size:12px;color:var(--v8-t3)}
.wl-order .btn{min-height:40px;padding:0 16px;font-size:13px}
.wl-short{font-size:12px;font-weight:800;color:#FFC24A}

/* history */
.wl-day{margin:14px 0 8px;font-size:12.5px;font-weight:800;color:var(--v8-t3)}
.wl-day:first-of-type{margin-top:0}
.wl-history ul,.wl-admin-tx{display:grid;gap:8px;margin:0;padding:0;list-style:none}
.wl-tx,.wl-admin-tx li{--t:#C5E86C;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:12px;padding:11px 13px;border-radius:16px;border:1px solid var(--v8-line);background:#ffffff04;animation:wlUp .4s both;animation-delay:calc(60ms + var(--i,0) * 35ms)}
.wl-tx.out,.wl-admin-tx li.out{--t:#FF9466}.wl-tx.buy,.wl-admin-tx li.buy{--t:#7CC7FF}
.wl-tx-ic{display:grid;place-items:center;width:38px;height:38px;border-radius:12px;background:color-mix(in srgb,var(--t) 18%,transparent);color:var(--t)}
.wl-tx-ic .icon{width:18px;height:18px}
.wl-tx>div,.wl-admin-tx li>div{display:grid;min-width:0}
.wl-tx b,.wl-admin-tx b{font-size:13.5px;font-weight:900;line-height:1.6}
.wl-tx small,.wl-admin-tx small{font-size:11.5px;line-height:1.7;color:var(--v8-t3)}
.wl-tx-amt{display:grid;justify-items:end;text-align:left}
.wl-tx-amt b{font-size:15px;color:var(--t);font-variant-numeric:tabular-nums}
.wl-tx-amt small{white-space:nowrap}
.wl-link{justify-self:start;min-height:28px;padding:0;border:0;background:none;color:var(--v8-acc2);font:inherit;font-size:12px;font-weight:800;cursor:pointer}
.wl-more{justify-content:center;margin-top:12px}
.wl-empty{display:grid;justify-items:center;gap:8px;padding:30px 20px;text-align:center}
.wl-empty-ic{display:grid;place-items:center;width:60px;height:60px;border-radius:20px;background:linear-gradient(135deg,#FFE0CF,#FF9466);color:#3a1405}
.wl-empty-ic .icon{width:28px;height:28px}
.wl-empty p{margin:0;max-width:44ch;font-size:13.5px;line-height:1.9;color:var(--v8-t2)}

/* ---------- order page and checkout ---------- */
.wl-paybox{display:flex;align-items:center;flex-wrap:wrap;gap:12px 16px;margin:0 0 18px;padding:16px 18px;border-radius:22px;border:1px solid #FF946666;background:linear-gradient(110deg,#FF6B3D1f,transparent 70%),var(--v8-card);animation:wlUp .5s both}
.wl-paybox.short{border-color:#FFC24A59;background:linear-gradient(110deg,#FFC24A14,transparent 70%),var(--v8-card)}
.wl-paybox-ic{display:grid;place-items:center;flex:0 0 46px;width:46px;height:46px;border-radius:15px;background:linear-gradient(135deg,#FFB37A,#FF6B3D);color:#1A0B05;box-shadow:0 12px 24px -14px #FF6B3D}
.wl-paybox-ic .icon{width:22px;height:22px}
.wl-paybox-txt{display:grid;flex:1 1 240px;min-width:0}
.wl-paybox-txt b{font-size:15px;font-weight:900}
.wl-paybox-txt small{font-size:12.5px;line-height:1.8;color:var(--v8-t2)}
.wl-paybox-short{display:flex;align-items:center;flex-wrap:wrap;gap:8px 12px}
.wl-paybox-short span{font-size:12.5px;font-weight:800;color:#FFC24A}
.wl-paid,.wl-note{display:flex;align-items:flex-start;gap:8px;margin:0 0 12px;padding:10px 12px;border-radius:14px;background:#C5E86C14;font-size:12.5px;line-height:1.8;color:#DDF5A0}
.wl-note{margin:14px 0 0;background:#FF6B3D12;color:var(--v8-t2)}
.wl-note b{color:var(--v8-t1)}
.wl-paid .icon,.wl-note .icon{flex:none;width:16px;height:16px;margin-top:3px}
.wl-tip{display:flex;align-items:flex-start;gap:10px;margin:0 0 14px;padding:12px 14px;border-radius:14px;border:1px solid #FF946640;background:#FF6B3D12}
.wl-tip .icon{flex:none;width:20px;height:20px;margin-top:3px;color:var(--v8-acc2)}
.wl-tip p{margin:0;font-size:12.5px;line-height:1.9;color:var(--v8-t2)}

/* ---------- admin ---------- */
.wl-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:16px}
.wl-kpi{--t:#FF9466;display:grid;gap:2px;min-width:0;padding:14px 16px;border-radius:20px;border:1px solid var(--v8-line);background:radial-gradient(120% 90% at 100% 0%,color-mix(in srgb,var(--t) 14%,transparent),transparent 60%),var(--v8-card);animation:wlPop .45s both}
.wl-kpi.sky{--t:#7CC7FF}.wl-kpi.done{--t:#C5E86C}.wl-kpi.warn{--t:#FFC24A}
.wl-kpi>span{display:grid;place-items:center;width:34px;height:34px;margin-bottom:6px;border-radius:11px;background:color-mix(in srgb,var(--t) 20%,transparent);color:var(--t)}
.wl-kpi>span .icon{width:17px;height:17px}
.wl-kpi small{font-size:12px;font-weight:800;color:var(--v8-t3)}
.wl-kpi b{font-size:19px;font-weight:900;line-height:1.5}
.wl-kpi em{font-style:normal;font-size:11.5px;color:var(--v8-t3)}
.wl-who{display:block;font-size:11.5px;color:var(--v8-t3)}
.wl-adm-bal{font-variant-numeric:tabular-nums;color:var(--v8-t3)}
.wl-adm-bal.has{color:#DDF5A0}
.wl-adm-delta{font-weight:800}
.wl-adj-now{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin:0 0 14px;padding:12px 16px;border-radius:16px;background:linear-gradient(110deg,#FF6B3D1c,transparent 75%);border:1px solid #FF946647}
.wl-adj-now small{font-size:12.5px;font-weight:800;color:var(--v8-t2)}
.wl-adj-now b{font-size:22px;font-weight:900}
.wl-adj{display:grid;gap:12px}
.wl-seg{margin:0;padding:0;border:0;min-width:0}
.wl-seg legend{margin-bottom:6px;font-size:13px;font-weight:800}
.wl-seg>div{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
.wl-seg label{position:relative;margin:0;cursor:pointer}
.wl-seg input{position:absolute;opacity:0;pointer-events:none}
.wl-seg span{display:flex;align-items:center;justify-content:center;gap:6px;min-height:46px;padding:4px 6px;border-radius:14px;border:1px solid var(--v8-line2);background:#ffffff06;font-size:13px;font-weight:800;color:var(--v8-t2);text-align:center;transition:background .2s,color .2s,border-color .2s}
.wl-seg span .icon{flex:none;width:16px;height:16px}
.wl-seg input:checked+span{border-color:transparent;background:linear-gradient(135deg,#FFB37A,#FF6B3D);color:#1A0B05}
.wl-seg input[value=DEBIT]:checked+span{background:linear-gradient(135deg,#FFE7A3,#FFC24A);color:#3a2300}
.wl-seg input[value=ZERO]:checked+span{background:linear-gradient(135deg,#FFC9C0,#FF8A7A);color:#3a0a05}
.wl-seg input:disabled+span{opacity:.4;cursor:not-allowed}
.wl-seg input:focus-visible+span{outline:3px solid #FF6B3D80;outline-offset:2px}
.wl-amount[hidden]{display:none}
.wl-quick{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.wl-quick button{min-height:32px;padding:0 12px;border-radius:999px;border:1px solid var(--v8-line2);background:#ffffff08;color:var(--v8-t2);font:inherit;font-size:12px;font-weight:700;cursor:pointer;direction:ltr}
.wl-quick button::before{content:"+ "}
.wl-preview{margin:0;padding:10px 12px;border-radius:12px;background:#C5E86C14;font-size:13px;font-weight:800;color:#DDF5A0}
.wl-preview.bad{background:#FF8A7A1a;color:#FFB4A8}
.wl-user strong{display:block;margin:8px 0 12px;font-size:26px;font-weight:900}
.wl-user h2{display:flex;align-items:center;gap:8px}
.wl-user h2 .icon{width:20px;height:20px;color:var(--v8-acc2)}

@media(max-width:1020px){.wl-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:860px){.wl-top{grid-template-columns:minmax(0,1fr)}}
@media(max-width:600px){
  .wl-page{gap:14px}
  .wl-card{min-height:200px;padding:20px;border-radius:24px}
  .wl-panel{padding:16px;border-radius:22px}
  .wl-tx,.wl-admin-tx li{grid-template-columns:auto minmax(0,1fr);row-gap:4px}
  .wl-tx-amt{grid-column:2;justify-items:start;text-align:right}
  .wl-paybox{padding:14px}
  .wl-paybox .btn{width:100%;justify-content:center}
  .wl-kpi b{font-size:16px}
}
@media(max-width:360px){.wl-kpis{grid-template-columns:minmax(0,1fr)}.wl-seg span{font-size:12px}}
@media(prefers-reduced-motion:reduce){.wl-page,.wl-card,.wl-shine,.wl-waves i,.wl-panel,.wl-order,.wl-tx,.wl-admin-tx li,.wl-paybox,.wl-kpi{animation:none!important}}