/* ===== User theme (mobile-app style) — loaded after style.css, user side only ===== */
:root{
  --vt-bg:#dce9fb;--vt-brand:#e6ff00;--vt-brand-bg:#0b0b0f;
  --accent:#2563eb;--accent2:#1d4ed8;--line:#d5def0;--bg:var(--vt-bg);
  --vt-ink:#0f172a;--vt-green:#14532d;
}
html{scroll-behavior:smooth}
body.vt-body{font-family:Nunito,Inter,system-ui,sans-serif;background:var(--vt-bg);color:var(--vt-ink);padding-bottom:calc(112px + env(safe-area-inset-bottom,0px))}
.vt-body input,.vt-body select,.vt-body textarea,.vt-body button{font-family:Nunito,Inter,sans-serif}

/* Top bar */
.vt-top{position:sticky;top:0;z-index:100;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 14px;max-width:1100px;margin:0 auto;background:linear-gradient(var(--vt-bg) 70%,rgba(220,233,251,0))}
.vt-brand{display:inline-flex;align-items:center;gap:8px;background:var(--vt-brand-bg);color:var(--vt-brand);border-radius:10px;padding:9px 14px;font:800 17px "Courier New",ui-monospace,monospace;letter-spacing:.5px;box-shadow:0 3px 0 rgba(0,0,0,.25);max-width:62%}
.vt-brand span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.vt-brand i{color:#fbbf24;font-size:15px}
.vt-brand img{height:26px;width:auto;border-radius:4px}
.vt-wallet{display:inline-flex;align-items:center;gap:7px;background:#f5c518;color:#111;border-radius:14px;padding:10px 15px;font:900 15px Nunito,sans-serif;box-shadow:0 3px 0 rgba(0,0,0,.2)}
.vt-wallet i{font-size:14px}
.vt-wallet:active,.vt-brand:active{transform:translateY(1px)}

/* Page wrap */
.np-wrap{max-width:720px;padding:8px 14px 28px}
.np-sec-head h2,.vt-h{font:900 22px Nunito,sans-serif;color:#17306b;letter-spacing:-.2px}
.vt-h{text-align:center;margin:18px 0 16px}
.np-sec-head a{color:var(--accent)}

/* Bordered list rows (menu / services) */
.vt-list{display:flex;flex-direction:column;gap:10px}
.vt-row{display:flex;align-items:center;gap:12px;width:100%;background:#fff;border:1.5px solid #111;border-radius:12px;padding:13px 14px;font:800 15px Nunito,sans-serif;color:#0f172a;text-align:left;cursor:pointer;transition:transform .08s,box-shadow .15s}
.vt-row:active{transform:scale(.985)}
.vt-row .ic{width:26px;text-align:center;font-size:20px;flex-shrink:0}
.vt-row .tx{flex:1;min-width:0}
.vt-row .tx small{display:block;font:600 11px Nunito,sans-serif;color:#64748b;margin-top:1px}
.vt-row .rate{font:800 12px Nunito,sans-serif;color:#475569;white-space:nowrap}
.vt-row .go{color:#2563eb;font-size:14px}
.vt-row.pl{border-left:5px solid #a855f7}
.vt-row.green{background:linear-gradient(135deg,#ecfdf5,#d1fae5);border-color:#34d399}
.vt-row.hot .tx{color:#b91c1c}
.vt-row .badge{background:#dc2626;color:#fff;border-radius:6px;padding:2px 7px;font:800 10px Nunito,sans-serif;margin-left:6px}
[class*="fa-instagram"]{color:#e1306c}
[class*="fa-youtube"]{color:#f00}
[class*="fa-facebook"]{color:#1877f2}
[class*="fa-telegram"]{color:#26a5e4}
[class*="fa-spotify"]{color:#1db954}
[class*="fa-tiktok"],[class*="fa-x-twitter"]{color:#111}
.vt-row.hot .ic,.vt-row .ic.blue{color:#2563eb}

/* User ID card */
.vt-idcard{position:relative;display:flex;align-items:center;justify-content:space-between;gap:10px;background:#fff;border:1.5px solid #111;border-radius:12px;padding:16px 14px 14px 14px;margin:14px 0 12px}
.vt-idcard .av{width:44px;height:44px;border-radius:50%;background:#e2e8f0;display:flex;align-items:center;justify-content:center;color:#94a3b8;font-size:20px;flex-shrink:0}
.vt-idcard .mid{flex:1;text-align:center}
.vt-idcard small{display:block;font:800 10px Nunito,sans-serif;letter-spacing:.6px;color:#64748b}
.vt-idcard b{font:900 20px Nunito,sans-serif;letter-spacing:.5px}
.vt-copy{display:inline-flex;align-items:center;gap:6px;background:#ecfdf5;border:1.5px solid #22c55e;color:#15803d;border-radius:9px;padding:7px 11px;font:800 12px Nunito,sans-serif;cursor:pointer}
.vt-tag{position:absolute;left:-4px;top:-9px;display:inline-flex;align-items:center;gap:5px;border-radius:7px;padding:3px 8px;font:800 10px Nunito,sans-serif;color:#fff;box-shadow:0 2px 6px rgba(0,0,0,.18)}
.vt-tag.red{background:#ef4444}
.vt-tag.blue{background:#4f46e5;top:auto;bottom:-9px}

/* Back / titles */
.vt-back{display:inline-flex;align-items:center;gap:6px;color:#0f172a;font:800 14px Nunito,sans-serif;margin:8px 0 2px;background:none;border:0;cursor:pointer;padding:6px 2px}
.vt-search{display:flex;align-items:center;gap:8px;background:#fff;border:1.5px solid #cbd5e1;border-radius:12px;padding:4px 6px 4px 12px;margin:10px 0 14px}
.vt-search i{color:#94a3b8}
.vt-search input{flex:1;border:0;outline:0;background:none;font:700 14px Nunito,sans-serif;padding:9px 4px;min-width:0}
.vt-search button,.vt-pill-btn{background:#000;color:#fff;border:0;border-radius:8px;padding:8px 13px;font:800 12px Nunito,sans-serif;cursor:pointer}
.vt-chips{display:flex;gap:8px;overflow-x:auto;padding:2px 0 12px;-webkit-overflow-scrolling:touch}
.vt-chip{flex-shrink:0;background:#fff;border:1.5px solid #e2e8f0;border-radius:999px;padding:7px 13px;font:800 12px Nunito,sans-serif;color:#0f172a;white-space:nowrap}
.vt-chip.on{background:#000;color:#fff;border-color:#000}

/* Packages + submit (create order) */
.vt-pkgs{display:flex;flex-direction:column;gap:10px;margin-bottom:16px}
.vt-pkg{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;border:2px solid rgba(34,197,94,.25);border-radius:12px;padding:13px 14px;color:#fff;font:800 14px Nunito,sans-serif;text-align:left;cursor:pointer;background:linear-gradient(135deg,#052e16,#14532d 60%,#166534);box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 4px 12px rgba(5,46,22,.25)}
.vt-pkg .nm{flex:1;min-width:0;line-height:1.25}
.vt-pkg .pr{display:flex;align-items:center;gap:8px;font:900 16px Nunito,sans-serif;white-space:nowrap}
.vt-pkg .off{background:#dc2626;color:#fff;border-radius:6px;padding:2px 7px;font:800 11px Nunito,sans-serif}
.vt-pkg.on{border-color:#4ade80;box-shadow:0 0 0 3px rgba(74,222,128,.35),0 6px 18px rgba(5,46,22,.35)}
.vt-field label{display:block;font:800 13px Nunito,sans-serif;margin:10px 0 6px;color:#0f172a}
.vt-field input,.vt-field textarea,.vt-field select{width:100%;background:#fff;border:2px solid #111;border-radius:10px;padding:12px 13px;font:700 14px Nunito,sans-serif;outline:0}
.vt-field input:focus{box-shadow:0 0 0 3px rgba(37,99,235,.25)}
.vt-field .hint{font:700 12px Nunito,sans-serif;color:#475569;margin-top:6px}
.vt-submit{display:block;width:100%;margin-top:16px;border:2px solid #22c55e;border-radius:12px;padding:15px;color:#fff;font:900 16px Nunito,sans-serif;letter-spacing:1px;text-transform:uppercase;cursor:pointer;background:linear-gradient(110deg,#052e16 0%,#15803d 50%,#052e16 100%);background-size:200% 100%;animation:vtSheen 3.5s linear infinite;box-shadow:0 6px 18px rgba(21,128,61,.35)}
.vt-submit:disabled{opacity:.55;animation:none}
@keyframes vtSheen{0%{background-position:200% 0}100%{background-position:-200% 0}}
.vt-total{display:flex;justify-content:space-between;align-items:center;background:#fff;border:1.5px dashed #94a3b8;border-radius:12px;padding:11px 14px;margin-top:12px;font:800 14px Nunito,sans-serif}
.vt-total b{font:900 18px Nunito,sans-serif;color:#15803d}
.vt-detail{background:#fff;border:1.5px solid #111;border-radius:12px;padding:14px;margin-top:18px;font:600 13px/1.65 Nunito,sans-serif;color:#1e293b;white-space:pre-line}
.vt-detail h4{font:900 14px Nunito,sans-serif;margin-bottom:6px}
.vt-empty{text-align:center;color:#64748b;padding:34px 10px;font:700 14px Nunito,sans-serif}
.vt-empty i{font-size:42px;color:#94a3b8;display:block;margin-bottom:10px}
.vt-empty h4{font:900 17px Nunito,sans-serif;color:#0f172a;margin-bottom:4px}
[hidden]{display:none !important}

/* Cards (orders, txns, generic) */
.vt-card{background:#fff;border:1.5px solid #cfdaf0;border-radius:14px;padding:14px;margin-bottom:12px;box-shadow:0 2px 0 rgba(15,23,42,.04)}
.vt-card .top{display:flex;justify-content:space-between;gap:8px;align-items:flex-start}
.vt-card .ttl{font:800 14px/1.3 Nunito,sans-serif}
.vt-card .meta{font:700 12px Nunito,sans-serif;color:#64748b;margin-top:3px;word-break:break-all}
.vt-card .meta a{color:#2563eb}
.vt-card .kv{display:flex;flex-wrap:wrap;gap:6px 16px;margin-top:10px;font:700 12px Nunito,sans-serif;color:#475569}
.vt-card .kv b{color:#0f172a}
.vt-bar{height:7px;border-radius:99px;background:#e2e8f0;overflow:hidden;margin-top:10px}
.vt-bar i{display:block;height:100%;background:linear-gradient(90deg,#16a34a,#4ade80);border-radius:99px}
.vt-actions{display:flex;gap:8px;margin-top:10px}
.vt-mini{display:inline-flex;align-items:center;gap:6px;background:#f1f5f9;border:1px solid #e2e8f0;border-radius:8px;padding:6px 10px;font:800 11px Nunito,sans-serif;color:#0f172a;cursor:pointer}
.vt-amt.pos{color:#15803d}.vt-amt.neg{color:#dc2626}
.vt-txi{display:flex;align-items:center;gap:12px}
.vt-txi .ic{width:38px;height:38px;border-radius:11px;display:flex;align-items:center;justify-content:center;font-size:15px;flex-shrink:0}
.vt-txi .ic.pos{background:#dcfce7;color:#15803d}.vt-txi .ic.neg{background:#fee2e2;color:#dc2626}
.vt-txi .mid{flex:1;min-width:0}
.vt-txi .mid b{display:block;font:800 13px Nunito,sans-serif}
.vt-txi .mid small{display:block;font:600 11px Nunito,sans-serif;color:#64748b;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.vt-txi .end{text-align:right;font:900 14px Nunito,sans-serif}
.vt-txi .end small{display:block;font:600 10px Nunito,sans-serif;color:#94a3b8}

/* Stat tiles */
.vt-stats{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:12px 0}
.vt-stat{background:#fff;border:1.5px solid #cfdaf0;border-radius:14px;padding:14px;text-align:center}
.vt-stat i{font-size:20px;color:#6366f1;margin-bottom:6px}
.vt-stat b{display:block;font:900 20px Nunito,sans-serif}
.vt-stat span{font:700 12px Nunito,sans-serif;color:#64748b}
.vt-quick{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:12px 0}
.vt-quick a{background:#fff;border:1.5px solid #111;border-radius:12px;padding:11px 4px;text-align:center;font:800 11px Nunito,sans-serif}
.vt-quick a i{display:block;font-size:20px;margin-bottom:5px;color:#2563eb}

/* Level / discount */
.vt-lvl{display:flex;align-items:center;gap:12px;background:#fff;border:1.5px solid #e2e8f0;border-radius:14px;padding:12px 14px;margin-bottom:10px}
.vt-lvl .ico{width:44px;height:44px;border-radius:50%;border:2px solid #fcd34d;display:flex;align-items:center;justify-content:center;font-size:22px;background:#fffbeb;flex-shrink:0}
.vt-lvl .mid{flex:1}.vt-lvl .mid b{display:block;font:900 15px Nunito,sans-serif}
.vt-lvl .mid small{font:700 12px Nunito,sans-serif;color:#64748b}
.vt-lvl .pc{text-align:right;font:900 17px Nunito,sans-serif;color:#15803d}.vt-lvl .pc small{display:block;font:800 10px Nunito,sans-serif}
.vt-lvl.cur{border-color:#22c55e;box-shadow:0 0 0 3px rgba(34,197,94,.18)}
.vt-note{background:#fffbeb;border:1.5px solid #fcd34d;color:#92400e;border-radius:12px;padding:12px 14px;font:800 13px/1.45 Nunito,sans-serif;margin:12px 0}
.vt-cta{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;background:linear-gradient(135deg,#6366f1,#4f46e5);color:#fff;border:0;border-radius:12px;padding:14px;font:900 15px Nunito,sans-serif;cursor:pointer}

/* Coupon / refer */
.vt-panel{background:#fff;border:1.5px solid #cfdaf0;border-radius:18px;padding:22px 18px;text-align:center;box-shadow:0 10px 30px rgba(37,99,235,.08);position:relative;overflow:hidden}
.vt-panel::before{content:"";position:absolute;left:0;right:0;top:0;height:5px;background:linear-gradient(90deg,#6366f1,#a855f7,#ec4899)}
.vt-panel .big{width:62px;height:62px;border-radius:18px;background:linear-gradient(135deg,#6366f1,#8b5cf6);color:#fff;display:flex;align-items:center;justify-content:center;font-size:28px;margin:4px auto 10px}
.vt-balpill{display:inline-block;background:#dcfce7;color:#15803d;border-radius:99px;padding:4px 12px;font:800 12px Nunito,sans-serif;margin-bottom:14px}
.vt-code{width:100%;text-align:center;letter-spacing:3px;text-transform:uppercase;background:#f8fafc;border:1.5px solid #cbd5e1;border-radius:10px;padding:13px;font:800 15px Nunito,sans-serif;outline:0;margin-bottom:12px}
.vt-linkbox{display:flex;gap:8px;align-items:center;background:#f8fafc;border:1.5px dashed #94a3b8;border-radius:12px;padding:10px 12px;margin:10px 0;text-align:left}
.vt-linkbox span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:700 12px Nunito,sans-serif;color:#334155}

/* Alerts & forms for legacy pages */
.np-alert{border-radius:12px;font-family:Nunito,sans-serif}
.np-card,.np-auth-card{border:1.5px solid #cfdaf0;border-radius:16px;font-family:Nunito,sans-serif}
.np-card h3,.np-auth-card h1{font-family:Nunito,sans-serif;font-weight:900}
.np-auth-card h1{font-size:22px}
.np-form label{font-family:Nunito,sans-serif;font-weight:800}
.np-form input,.np-form select,.np-form textarea{border:1.5px solid #cbd5e1;border-radius:10px;font-family:Nunito,sans-serif;font-weight:600}
.np-form input:focus,.np-form select:focus,.np-form textarea:focus{border-color:#2563eb;box-shadow:0 0 0 3px rgba(37,99,235,.15)}
.np-btn{border-radius:12px;font-family:Nunito,sans-serif;font-weight:900;background:linear-gradient(135deg,#2563eb,#1d4ed8)}
.np-btn.green{background:linear-gradient(135deg,#16a34a,#15803d)}
.np-btn.ghost{background:#fff;color:#0f172a}
.np-table-wrap,.np-toolbar{border-color:#cfdaf0}
.np-svc-table{font-family:Nunito,sans-serif}
.np-svc-table th{font-family:Nunito,sans-serif;background:#eef4ff}
.np-svc-table .svc-cat{background:#dbeafe;color:#1d4ed8}
.np-svc-table .svc-price{color:#15803d}
.np-pay-box{border-color:#93c5fd;background:#f0f7ff}
.np-charge-box{background:linear-gradient(135deg,#052e16,#166534)}
.np-charge-box small,.np-charge-box .hint{color:#bbf7d0}
.np-stat-card,.np-cat-card,.np-feat-card,.np-ticket{border-color:#cfdaf0;font-family:Nunito,sans-serif}
.np-feat-card i{background:#dbeafe;color:#2563eb}
.np-cat-card i{color:#2563eb}
.np-cat-card:hover{border-color:#2563eb;box-shadow:0 8px 20px rgba(37,99,235,.14)}
.np-msg.me{background:#2563eb}
.np-hero{background:linear-gradient(135deg,#07111f 0%,#0f2b5c 55%,#2563eb 100%);border-radius:0 0 26px 26px}
.np-hero h1{font-family:Nunito,sans-serif}
.np-hero-btns .np-btn{background:#fff;color:#1d4ed8}
.np-hero-btns .np-btn.ghost{background:transparent;color:#fff}
.np-hero-stats span{color:#bfdbfe}
.np-pager .on{background:#2563eb;border-color:#2563eb}
.np-announce{background:linear-gradient(90deg,#07111f,#2563eb);font-family:Nunito,sans-serif}
.np-footer{background:transparent;border-top:0;padding-bottom:12px}
.ic.v{background:#dbeafe;color:#2563eb}
@media(min-width:820px){.np-wrap{max-width:900px}}
.np-wrap:has(.np-svc-table){max-width:1000px}

/* Bottom nav */
.vt-bottom{position:fixed;left:0;right:0;bottom:0;z-index:150;display:flex;align-items:center;justify-content:space-around;gap:6px;background:#f2f7ff;border-top:1px solid #cfdaf0;padding:8px 14px calc(8px + env(safe-area-inset-bottom,0px));box-shadow:0 -6px 24px rgba(15,23,42,.08)}
.vt-bi{flex:1;max-width:120px;display:flex;flex-direction:column;align-items:center;gap:3px;color:#475569;font:800 11px Nunito,sans-serif;padding:6px 4px;border-radius:10px}
.vt-bi i{font-size:17px}
.vt-bi.on{color:#2563eb;background:#e4edff}
.vt-create{flex:1.5;max-width:190px;margin-top:-26px;display:flex;align-items:center;justify-content:center;gap:6px;flex-direction:column;background:linear-gradient(135deg,#2f6df6,#1d4ed8);color:#fff;border-radius:999px;padding:9px 20px;font:900 14px Nunito,sans-serif;box-shadow:0 0 0 4px rgba(74,222,128,.4),0 10px 24px rgba(37,99,235,.45);line-height:1.05}
.vt-create b{font:900 22px/0.8 Nunito,sans-serif}
.vt-create span{font:900 14px Nunito,sans-serif}
.vt-create:active{transform:scale(.97)}

/* Floating buttons */
.vt-fab{position:fixed;bottom:calc(98px + env(safe-area-inset-bottom,0px));z-index:140;width:54px;height:54px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-size:24px;box-shadow:0 8px 20px rgba(0,0,0,.28)}
.vt-fab.tg{left:14px;background:#229ed9}
.vt-fab.tg i{color:#fff}
.vt-fab.yt{right:14px;background:#f00}
.vt-fab::after{content:"";position:absolute;inset:-6px;border-radius:50%;border:3px solid currentColor;opacity:.35;animation:vtPulse 1.8s ease-out infinite}
.vt-fab.tg::after{border-color:#67c6f2}.vt-fab.yt::after{border-color:#ff7b7b}
@keyframes vtPulse{0%{transform:scale(.85);opacity:.7}100%{transform:scale(1.35);opacity:0}}

/* Support chat */
.vt-chat{max-width:560px;margin:0 auto;background:#efeae2;border-radius:16px;overflow:hidden;border:1.5px solid #cfdaf0}
.vt-chat-h{display:flex;align-items:center;gap:10px;background:#075e54;color:#fff;padding:12px 14px}
.vt-chat-h .av{width:38px;height:38px;border-radius:50%;background:#128c7e;display:flex;align-items:center;justify-content:center}
.vt-chat-h b{display:block;font:800 15px Nunito,sans-serif}.vt-chat-h small{font:600 11px Nunito,sans-serif;color:#b7e4dc}
.vt-chat-b{padding:14px 12px;min-height:300px;max-height:56vh;overflow-y:auto}
.vt-bub{max-width:84%;border-radius:12px;padding:9px 12px;margin:0 0 8px;font:600 14px/1.45 Nunito,sans-serif;box-shadow:0 1px 1px rgba(0,0,0,.1);white-space:pre-line}
.vt-bub.in{background:#fff;border-top-left-radius:3px}
.vt-bub.out{background:#d9fdd3;margin-left:auto;border-top-right-radius:3px}
.vt-topic{display:flex;align-items:center;gap:10px;width:100%;background:#fff;border:0;border-radius:10px;padding:12px 14px;margin-bottom:8px;font:700 14px Nunito,sans-serif;text-align:left;cursor:pointer;box-shadow:0 1px 2px rgba(0,0,0,.08)}
.vt-topic i{color:#075e54;width:18px;text-align:center}
.vt-langs{display:flex;gap:8px;justify-content:center;margin-bottom:10px}
.vt-langs button{border:1.5px solid #075e54;background:#fff;color:#075e54;border-radius:99px;padding:6px 14px;font:800 12px Nunito,sans-serif;cursor:pointer}
.vt-langs button.on{background:#075e54;color:#fff}
.vt-chat-f{display:flex;gap:8px;padding:10px;background:#f0f0f0}
.vt-chat-f input{flex:1;border:0;border-radius:99px;padding:11px 14px;font:600 14px Nunito,sans-serif;outline:0}
.vt-chat-f button{width:44px;height:44px;border-radius:50%;border:0;background:#25d366;color:#fff;font-size:16px;cursor:pointer}