/* ویژن مدیا v8 — فاکتور، حسابداری، کیف پول، تسک، دانلود */
.pl-head{display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; margin-bottom:16px;}
.pl-head h1{margin:0;}
.pl-head p{margin:3px 0 0; color:var(--ink-faint); font-size:12.5px;}
.pl-actions{display:flex; gap:8px; flex-wrap:wrap;}
.pl-nav{display:flex; gap:4px; overflow-x:auto; padding:4px; margin-bottom:16px; border-radius:14px; background:var(--card); border:1px solid var(--edge); scrollbar-width:none; position:sticky; top:64px; z-index:15;}
.pl-nav::-webkit-scrollbar{display:none;}
.pl-nav a{flex:none; padding:8px 13px; border-radius:10px; font-size:12.5px; font-weight:700; color:var(--ink-soft); text-decoration:none; white-space:nowrap; transition:background .2s, color .2s;}
.pl-nav a:hover{background:rgba(var(--fg-rgb),0.05); color:var(--ink);}
.pl-nav a.on{background:var(--brand-grad); color:#fff;}
.pl-kpis{display:grid; grid-template-columns:repeat(auto-fit, minmax(160px,1fr)); gap:10px; margin-bottom:14px;}
.pl-kpi{position:relative; overflow:hidden; padding:14px; border-radius:16px; background:var(--card); border:1px solid var(--edge); animation:pageIn .5s var(--ease) both;}
.pl-kpi:nth-child(2){animation-delay:.05s} .pl-kpi:nth-child(3){animation-delay:.1s} .pl-kpi:nth-child(4){animation-delay:.15s} .pl-kpi:nth-child(5){animation-delay:.2s} .pl-kpi:nth-child(6){animation-delay:.25s}
.pl-kpi span{display:block; font-size:11.5px; color:var(--ink-faint);}
.pl-kpi b{display:block; font-size:18px; margin-top:4px; color:var(--ink);}
.pl-kpi small{font-size:11px; color:var(--ink-faint);}
.pl-kpi.g b{color:var(--mint);} .pl-kpi.r b{color:#F87171;} .pl-kpi.y b{color:#FBBF24;}
.pl-kpi .up{color:var(--mint);} .pl-kpi .down{color:#F87171;}
.pl-grid2{display:grid; grid-template-columns:1fr 1fr; gap:12px;}
.pl-grid3{display:grid; grid-template-columns:2fr 1fr; gap:12px;}
@media (max-width:900px){ .pl-grid2, .pl-grid3{grid-template-columns:1fr;} .pl-nav{top:58px;} }
.pl-row{display:flex; align-items:center; gap:10px; padding:9px 0; border-bottom:1px solid rgba(var(--fg-rgb),0.06); font-size:12.5px;}
.pl-row:last-child{border-bottom:0;}
.pl-row .grow{flex:1; min-width:0;}
.pl-row .grow b{display:block; color:var(--ink); font-size:12.5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.pl-row .grow small{color:var(--ink-faint); font-size:11px;}
.pl-dot{width:9px; height:9px; border-radius:50%; flex:none;}
.pl-amt{font-weight:800; white-space:nowrap;}
.pl-amt.in{color:var(--mint);} .pl-amt.out{color:#F87171;}
.pl-bar{height:7px; border-radius:7px; background:rgba(var(--fg-rgb),0.08); overflow:hidden;}
.pl-bar i{display:block; height:100%; border-radius:7px; background:var(--brand-grad); transform-origin:right; animation:pjBar 1s var(--ease) both;}
.pl-bar.over i{background:linear-gradient(90deg,#F87171,#DC2626);}
.pl-chart{width:100%; height:auto; display:block;}
.pl-chart .bi{fill:#22C55E;} .pl-chart .be{fill:#F87171; opacity:.85;}
.pl-chart rect{transform-origin:bottom; transform-box:fill-box; animation:plGrow .9s var(--ease) both;}
@keyframes plGrow{from{transform:scaleY(0);}}
.pl-chart text{fill:var(--ink-faint); font-size:10px; font-family:inherit;}
.pl-legend{display:flex; gap:14px; font-size:11.5px; color:var(--ink-faint); margin-top:6px;}
.pl-legend i{display:inline-block; width:9px; height:9px; border-radius:3px; margin-left:5px; vertical-align:middle;}
.pl-form{display:grid; grid-template-columns:repeat(auto-fit, minmax(180px,1fr)); gap:10px; align-items:end;}
.pl-form label{margin-top:0;}
.pl-form .full{grid-column:1/-1;}
.pl-tag{display:inline-block; padding:2px 8px; border-radius:7px; font-size:10.5px; font-weight:700; background:rgba(var(--fg-rgb),0.06); color:var(--ink-soft);}
.pl-empty{padding:28px; text-align:center; color:var(--ink-faint); font-size:12.5px;}
.pl-alert{display:flex; gap:10px; align-items:center; padding:10px 12px; border-radius:12px; margin-bottom:8px; font-size:12.5px; background:rgba(251,191,36,0.1); border:1px solid rgba(251,191,36,0.3); color:var(--ink);}
.pl-alert.r{background:rgba(248,113,113,0.1); border-color:rgba(248,113,113,0.3);}
.pl-alert a{margin-inline-start:auto; font-weight:700; color:var(--mint);}
.pl-table{width:100%; border-collapse:collapse; font-size:12.5px;}
.pl-table th{font-size:11px; color:var(--ink-faint); font-weight:700; text-align:right; padding:8px; border-bottom:1px solid var(--edge);}
.pl-table td{padding:9px 8px; border-bottom:1px solid rgba(var(--fg-rgb),0.06); vertical-align:middle;}
.pl-table tr:hover td{background:rgba(var(--fg-rgb),0.02);}
details.pl-more > summary{cursor:pointer; list-style:none; font-size:12px; color:var(--mint); font-weight:700;}
details.pl-more > summary::-webkit-details-marker{display:none;}

/* ---------- کارت بانکی کیف پول ---------- */
.vm-card-wrap{perspective:1200px; margin:0 auto 18px; max-width:420px;}
.vm-card{position:relative; aspect-ratio:1.586; border-radius:22px; cursor:pointer; transform-style:preserve-3d; transition:transform .8s cubic-bezier(.2,.8,.2,1); animation:vmCardIn 1s cubic-bezier(.2,.8,.2,1) both;}
@keyframes vmCardIn{from{opacity:0; transform:rotateX(35deg) translateY(30px) scale(.9);}}
.vm-card.flip{transform:rotateY(180deg);}
.vm-card .face{position:absolute; inset:0; border-radius:22px; overflow:hidden; backface-visibility:hidden; color:#fff; padding:20px 22px;
  background:radial-gradient(120% 140% at 0% 0%, #1b2a22 0%, #0b0f0d 45%, #050706 100%);
  box-shadow:0 30px 60px -25px rgba(0,0,0,0.8), inset 0 0 0 1px rgba(255,255,255,0.08);}
.vm-card .face::before{content:""; position:absolute; inset:0; background:
  radial-gradient(60% 80% at 100% 100%, rgba(239,68,68,0.28), transparent 60%),
  radial-gradient(60% 80% at 100% 0%, rgba(56,189,248,0.22), transparent 60%),
  radial-gradient(50% 60% at 0% 100%, rgba(34,197,94,0.25), transparent 60%); animation:vmCardHue 9s ease-in-out infinite alternate;}
@keyframes vmCardHue{to{filter:hue-rotate(25deg) brightness(1.15);}}
.vm-card .face::after{content:""; position:absolute; inset:-40%; background:linear-gradient(115deg, transparent 42%, rgba(255,255,255,0.16) 50%, transparent 58%); transform:translateX(-60%); animation:vmCardShine 5.5s ease-in-out infinite;}
@keyframes vmCardShine{0%,55%{transform:translateX(-60%);} 85%,100%{transform:translateX(60%);}}
.vm-card .back{transform:rotateY(180deg);}
.vm-card .row{position:relative; z-index:2; display:flex; align-items:center; justify-content:space-between;}
.vm-card .brandc{display:flex; align-items:center; gap:9px; font-weight:900; font-size:14px; letter-spacing:.2px;}
.vm-card .brandc .vm-logo{width:34px; height:34px; border-radius:10px;}
.vm-card .chip{width:38px; height:28px; border-radius:7px; background:linear-gradient(135deg,#f5d77a,#b8913a 60%,#f0d48a); position:relative; box-shadow:inset 0 0 0 1px rgba(0,0,0,0.25);}
.vm-card .chip::before{content:""; position:absolute; inset:7px 9px; border:1.5px solid rgba(0,0,0,0.28); border-radius:4px;}
.vm-card .wave{width:26px; height:26px; opacity:.75;}
.vm-card .bal{position:relative; z-index:2; margin-top:10px;}
.vm-card .bal small{display:block; font-size:11px; opacity:.65;}
.vm-card .bal b{font-size:clamp(20px, 6.4vw, 26px); font-weight:900; letter-spacing:.5px; text-shadow:0 2px 14px rgba(34,197,94,0.35);}
.vm-card .bal em{font-style:normal; font-size:12px; opacity:.7; margin-inline-start:4px;}
.vm-card .num{position:relative; z-index:2; margin-top:6px; font-family:ui-monospace, 'SF Mono', Menlo, Consolas, monospace; font-size:clamp(13px, 4vw, 16px); letter-spacing:2.5px; direction:ltr; text-align:left; opacity:.9;}
.vm-card .foot{position:absolute; z-index:2; left:22px; right:22px; bottom:14px; display:flex; justify-content:space-between; align-items:flex-end; font-size:11px;}
.vm-card .foot small{display:block; opacity:.6; font-size:9.5px; margin-bottom:2px;}
.vm-card .foot b{font-size:12.5px;}
.vm-card .stripe{position:relative; z-index:2; height:42px; margin:6px -22px 14px; background:#000;}
.vm-card .kv{position:relative; z-index:2; font-size:12px; margin-bottom:9px;}
.vm-card .kv small{display:block; opacity:.6; font-size:10px;}
.vm-card .kv b{direction:ltr; display:inline-block; letter-spacing:1px;}
.vm-card-hint{text-align:center; font-size:11px; color:var(--ink-faint); margin-top:8px;}
.vm-card-stats{display:grid; grid-template-columns:repeat(3,1fr); gap:8px; max-width:420px; margin:0 auto 18px;}
.vm-card-stats div{padding:10px; border-radius:14px; background:var(--card); border:1px solid var(--edge); text-align:center;}
.vm-card-stats span{display:block; font-size:10.5px; color:var(--ink-faint);}
.vm-card-stats b{font-size:13.5px; color:var(--ink);}
html.is-scrolling .vm-card .face::before, html.is-scrolling .vm-card .face::after{animation-play-state:paused;}

/* ---------- تسک ---------- */
.tk-sum{display:grid; grid-template-columns:repeat(auto-fit,minmax(130px,1fr)); gap:8px; margin-bottom:14px;}
.tk-filter{display:flex; gap:6px; margin-bottom:12px; flex-wrap:wrap;}
.tk-filter button{font-family:inherit; font-size:12px; font-weight:700; padding:6px 12px; border-radius:10px; border:1px solid var(--edge); background:var(--card); color:var(--ink-soft); cursor:pointer;}
.tk-filter button.on{background:var(--brand-grad); color:#fff; border-color:transparent;}
.tk{position:relative; padding:14px 16px; border-radius:16px; background:var(--card); border:1px solid var(--edge); margin-bottom:10px; animation:pageIn .4s var(--ease) both; transition:transform .25s var(--ease), border-color .25s;}
.tk:hover{transform:translateY(-2px); border-color:rgba(34,197,94,0.3);}
.tk.done{opacity:.72;}
.tk.overdue{border-color:rgba(248,113,113,0.45);}
.tk.high::before{content:""; position:absolute; right:0; top:14px; bottom:14px; width:3px; border-radius:3px; background:#F87171;}
.tk-top{display:flex; gap:10px; align-items:flex-start; justify-content:space-between;}
.tk-title{font-weight:800; font-size:13.5px; color:var(--ink);}
.tk.done .tk-title{text-decoration:line-through; text-decoration-color:rgba(var(--fg-rgb),0.35);}
.tk-meta{display:flex; flex-wrap:wrap; gap:6px; margin-top:7px;}
.tk-price{display:inline-flex; align-items:center; gap:5px; padding:3px 9px; border-radius:9px; font-size:11.5px; font-weight:800; background:rgba(34,197,94,0.12); color:var(--mint); border:1px solid rgba(34,197,94,0.25);}
.tk-price.paid{background:rgba(var(--fg-rgb),0.06); color:var(--ink-soft); border-color:transparent;}
.tk-acts{display:flex; gap:6px; flex-wrap:wrap; margin-top:10px; align-items:center;}
.tk-acts form{margin:0;}

/* ---------- کاغذ فاکتور و رسید ---------- */
.paper-page{min-height:100vh; padding:24px 12px 60px; background:var(--paper);}
.paper-bar{max-width:820px; margin:0 auto 14px; display:flex; gap:8px; flex-wrap:wrap; align-items:center;}
.paper-bar .sp{flex:1;}
.paper{position:relative; max-width:820px; margin:0 auto; background:#fff; color:#0f172a; border-radius:14px; overflow:hidden; box-shadow:0 30px 70px -30px rgba(0,0,0,0.5); font-size:13px;}
.paper *{color:inherit;}
.paper .wm{position:absolute; inset:0; display:grid; place-items:center; pointer-events:none; z-index:0;}
.paper .wm img{width:62%; max-width:460px; opacity:.06;}
.paper .lh-top{position:relative; z-index:1; display:flex; align-items:center; gap:14px; padding:22px 26px 16px; border-bottom:2px solid #e2e8f0;
  background:linear-gradient(90deg, rgba(34,197,94,0.07), rgba(56,189,248,0.04) 60%, rgba(239,68,68,0.05));}
.paper .lh-top img{width:56px; height:56px; border-radius:14px;}
.paper .lh-top h2{margin:0; font-size:17px; color:#0f172a;}
.paper .lh-top p{margin:2px 0 0; font-size:11.5px; color:#64748b;}
.paper .lh-top .doc{margin-inline-start:auto; text-align:left;}
.paper .lh-top .doc b{display:block; font-size:16px; color:#15803d;}
.paper .lh-top .doc span{font-size:11.5px; color:#64748b;}
.paper .body{position:relative; z-index:1; padding:20px 26px;}
.paper .parties{display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-bottom:16px;}
.paper .party{padding:12px 14px; border-radius:12px; background:rgba(241,245,249,0.75); border:1px solid #e2e8f0; font-size:12px; line-height:2;}
.paper .party h4{margin:0 0 4px; font-size:12px; color:#15803d;}
.paper table{width:100%; border-collapse:collapse; margin-bottom:14px; background:rgba(255,255,255,0.6);}
.paper th{background:#0f172a; color:#fff; font-size:11.5px; padding:9px 8px; text-align:right;}
.paper th:first-child{border-radius:0 9px 9px 0;} .paper th:last-child{border-radius:9px 0 0 9px;}
.paper td{padding:9px 8px; border-bottom:1px solid #e2e8f0; font-size:12.5px;}
.paper .totals{margin-inline-start:auto; width:min(320px,100%); font-size:12.5px;}
.paper .totals div{display:flex; justify-content:space-between; padding:6px 0; border-bottom:1px dashed #e2e8f0;}
.paper .totals .grand{border:0; margin-top:4px; padding:10px 12px; border-radius:10px; background:#0f172a; color:#fff; font-weight:800; font-size:14px;}
.paper .totals .grand *{color:#fff;}
.paper .stamp{display:inline-block; padding:6px 16px; border:2.5px solid #16a34a; color:#16a34a; border-radius:10px; font-weight:900; transform:rotate(-8deg); font-size:16px; letter-spacing:1px;}
.paper .stamp.due{border-color:#dc2626; color:#dc2626;}
.paper .note{margin-top:14px; font-size:11.5px; color:#475569; line-height:2;}
.paper .lh-foot{position:relative; z-index:1; padding:12px 26px; border-top:1px solid #e2e8f0; font-size:10.5px; color:#64748b; display:flex; justify-content:space-between; gap:10px; flex-wrap:wrap;
  background:linear-gradient(90deg, rgba(34,197,94,0.05), transparent);}
.paper .sign{display:flex; justify-content:space-between; gap:20px; margin-top:22px; font-size:11.5px; color:#64748b;}
.paper .sign div{flex:1; border-top:1px dashed #cbd5e1; padding-top:8px; text-align:center;}
@media (max-width:600px){ .paper .parties{grid-template-columns:1fr;} .paper .lh-top{flex-wrap:wrap;} .paper .body, .paper .lh-top{padding-left:16px; padding-right:16px;} }
.pay-box{max-width:820px; margin:16px auto 0; display:grid; grid-template-columns:1fr 1fr; gap:12px;}
@media (max-width:700px){ .pay-box{grid-template-columns:1fr;} }
.pay-opt{padding:18px; border-radius:18px; background:var(--card); border:1px solid var(--edge); position:relative; overflow:hidden;}
.pay-opt.main{border-color:rgba(34,197,94,0.45); box-shadow:0 20px 40px -24px rgba(34,197,94,0.6);}
.pay-opt.main::before{content:"پیشنهاد ما"; position:absolute; top:12px; left:-30px; transform:rotate(-45deg); background:var(--brand-grad); color:#fff; font-size:10px; font-weight:800; padding:3px 34px;}
.pay-opt h3{margin:0 0 6px; font-size:14.5px;}
.pay-opt p{font-size:12px; color:var(--ink-faint); margin:0 0 12px; line-height:1.9;}
.pay-big{display:block; width:100%; padding:13px; font-size:14px;}
.pay-flag{max-width:820px; margin:0 auto 12px; padding:12px 14px; border-radius:14px; font-size:13px; font-weight:700;}
.pay-flag.ok{background:rgba(34,197,94,0.12); border:1px solid rgba(34,197,94,0.35); color:var(--mint);}
.pay-flag.bad{background:rgba(248,113,113,0.12); border:1px solid rgba(248,113,113,0.35); color:#F87171;}
@media print{ .paper-bar, .pay-box, .pay-flag, .vm-noprint{display:none !important;} .paper-page{padding:0; background:#fff;} .paper{box-shadow:none; border-radius:0;} body{background:#fff !important;} }

/* ---------- قدم‌های خرید ---------- */
.buy-steps{display:flex; gap:6px; max-width:820px; margin:0 auto 16px;}
.buy-steps div{flex:1; text-align:center; font-size:11px; color:var(--ink-faint); position:relative; padding-top:30px;}
.buy-steps div::before{content:attr(data-n); position:absolute; top:0; left:50%; transform:translateX(-50%); width:24px; height:24px; border-radius:50%; display:grid; place-items:center; font-size:11px; font-weight:800; background:rgba(var(--fg-rgb),0.08); color:var(--ink-faint);}
.buy-steps div.done::before{content:"✓"; background:var(--brand-grad); color:#fff;}
.buy-steps div.cur::before{background:var(--brand-grad); color:#fff; box-shadow:0 0 0 5px rgba(34,197,94,0.18);}
.buy-steps div.cur, .buy-steps div.done{color:var(--ink);}
/* حالت اپلیکیشن */
html.in-app a[href="/download"]{display:none !important;}
.app-only{display:none;}
html.in-app .app-only{display:flex;}