/* تکنوفا | پنل لیست قیمت — نسخه ۲ */
@font-face { font-family: 'Vazirmatn'; src: url('fonts/Vazirmatn.woff2') format('woff2'); font-weight: 100 900; font-display: swap; }
:root {
  --navy: #0B1F3A; --navy2: #17345F; --accent: #2E7CF6; --gold: #C9A227; --gold2: #E7C55A; --goldl: #FFF6D6;
  --bg: #F2F5FA; --card: #FFFFFF; --line: #E1E7F0; --text: #0F172A; --muted: #66758B;
  --green: #12814A; --red: #D0343B; --wa: #1FAF5A; --band: #F2F6FC;
  --r: 18px; --sh: 0 1px 2px rgba(11,31,58,.04), 0 8px 24px rgba(11,31,58,.06);
  --font: 'Vazirmatn', Tahoma, system-ui, sans-serif;
  --nav-h: 66px;
}
* { box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; font-family: var(--font); background: var(--bg); color: var(--text); font-size: 15px; line-height: 1.7; padding-bottom: calc(var(--nav-h) + 20px + env(safe-area-inset-bottom)); }
input, select, textarea, button { font: inherit; color: inherit; }
a { color: var(--accent); text-decoration: none; }
[hidden] { display: none !important; }
.muted { color: var(--muted); } .small { font-size: 12.5px; } .center { text-align: center; }
.mt0 { margin-top: 0 !important; } .mt { margin-top: 12px; } .grow { flex: 1; }

/* ---------- آیکون ---------- */
.i { width: 20px; height: 20px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; vertical-align: -4px; }
.i.xs { width: 14px; height: 14px; vertical-align: -2px; stroke-width: 2.2; }

/* ---------- سربرگ و ناوبری ---------- */
.top { position: sticky; top: 0; z-index: 20; display: flex; align-items: center; justify-content: space-between; gap: 10px;
  padding: 10px 16px; padding-top: max(10px, env(safe-area-inset-top)); background: rgba(11,31,58,.97); color: #fff; backdrop-filter: blur(8px); }
.brand { display: flex; align-items: center; gap: 10px; font-size: 17px; color: #fff; }
.brand .logo { width: 36px; height: 36px; display: grid; place-items: center; background: linear-gradient(135deg, var(--gold2), var(--gold)); color: var(--navy); border-radius: 11px; }
.ratepill { display: flex; flex-direction: column; align-items: flex-end; line-height: 1.25; background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.14); padding: 5px 12px; border-radius: 13px; color: #fff; }
.ratepill small { font-size: 10.5px; color: #F3D77A; display: flex; gap: 4px; align-items: center; }
.ratepill b { font-size: 16px; letter-spacing: .3px; }
.ratepill.locked { background: linear-gradient(135deg, var(--gold2), var(--gold)); color: var(--navy); border-color: transparent; }
.ratepill.locked small { color: var(--navy); font-weight: 700; }
.nav { position: fixed; bottom: 10px; inset-inline: 10px; z-index: 30; display: grid; grid-template-columns: repeat(5, 1fr);
  background: rgba(255,255,255,.96); backdrop-filter: blur(12px); border: 1px solid var(--line); border-radius: 22px;
  margin-bottom: env(safe-area-inset-bottom); box-shadow: 0 10px 30px rgba(11,31,58,.14); height: var(--nav-h); padding: 6px; }
.nav a { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; color: var(--muted); font-size: 11px; border-radius: 16px; }
.nav a .i { width: 22px; height: 22px; }
.nav a.on { color: var(--navy); font-weight: 800; background: var(--band); }
.nav a.on .i { color: var(--accent); stroke-width: 2.2; }
.wrap { max-width: 1040px; margin: 0 auto; padding: 16px; }
@media (min-width: 900px) {
  body { padding-bottom: 24px; }
  .nav { position: sticky; top: 64px; bottom: auto; inset-inline: auto; margin: 10px auto 0; width: 640px; height: 54px; border-radius: 16px; }
  .nav a { flex-direction: row; gap: 8px; font-size: 14px; }
  .nav a .i { width: 19px; height: 19px; }
}

/* ---------- اجزا ---------- */
.card { background: var(--card); border: 1px solid var(--line); border-radius: var(--r); padding: 16px; margin-bottom: 14px; box-shadow: var(--sh); }
.card h3 { margin: 0 0 12px; font-size: 15.5px; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.card h3 .i { color: var(--accent); }
.card.gold { border-color: #EAD9A0; background: linear-gradient(180deg, #FFFCF2, #fff 60%); }
.card.gold h3 .i { color: var(--gold); }
.pagehead { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin: 2px 0 12px; }
.pagehead h1 { font-size: 20px; margin: 0; font-weight: 800; }
.pagehead h1 small { font-size: 13px; font-weight: 500; }
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 7px; border: 1px solid transparent; border-radius: 14px;
  padding: 10px 16px; font-weight: 700; cursor: pointer; background: #fff; color: var(--navy); min-height: 46px; white-space: nowrap; transition: transform .1s, box-shadow .2s; }
.btn.lg { min-height: 52px; font-size: 15.5px; }
.btn.sm { min-height: 38px; padding: 6px 12px; font-size: 13px; border-radius: 12px; }
.btn.primary { background: var(--navy); color: #fff; box-shadow: 0 6px 16px rgba(11,31,58,.22); }
.btn.gold { background: linear-gradient(135deg, var(--gold2), var(--gold)); color: var(--navy); box-shadow: 0 6px 16px rgba(201,162,39,.3); }
.btn.ghost { background: #fff; border-color: var(--line); }
.btn.glass { background: rgba(255,255,255,.1); color: #fff; border-color: rgba(255,255,255,.18); margin-top: 10px; }
.btn.wa { background: linear-gradient(135deg, #25D366, #12A04E); color: #fff; box-shadow: 0 8px 20px rgba(18,160,78,.3); }
.btn.danger { background: #fff; color: var(--red); border-color: #F4CDD0; }
.btn.block { width: 100%; }
.btn:active { transform: scale(.97); }
.btn[disabled] { opacity: .55; pointer-events: none; }
.sticky { position: sticky; bottom: calc(var(--nav-h) + 22px); z-index: 5; }
@media (min-width: 900px) { .sticky { bottom: 14px; } }
input, select, textarea { width: 100%; border: 1px solid var(--line); border-radius: 13px; padding: 10px 12px; background: #fff; outline: none; min-height: 46px; }
input:focus, select:focus, textarea:focus { border-color: var(--accent); box-shadow: 0 0 0 3px rgba(46,124,246,.14); }
textarea { resize: vertical; line-height: 1.8; }
label { display: block; font-size: 13.5px; font-weight: 600; }
label > input, label > select { margin-top: 5px; font-weight: 500; }
label small { display: block; color: var(--muted); font-weight: 400; font-size: 11.5px; margin-top: 3px; }
.fields { display: grid; gap: 12px; }
@media (min-width: 640px) { .fields { grid-template-columns: 1fr 1fr; } .fields.three { grid-template-columns: 1fr 1fr 1fr; } }
.stack { display: grid; gap: 12px; }
.row2 { display: flex; gap: 8px; }
.hint { font-size: 12.5px; color: var(--muted); margin: 10px 0 0; line-height: 1.8; }
.chk { display: flex; align-items: center; gap: 8px; font-weight: 500; cursor: pointer; }
.chk input { width: 20px; height: 20px; min-height: 0; margin: 0; accent-color: var(--navy); flex: none; }
.alert { border-radius: 13px; padding: 10px 12px; margin: 10px 0; font-size: 13.5px; display: flex; gap: 6px; align-items: center; }
.alert.err { background: #FDECEC; color: var(--red); }
.alert.warn { background: #FFF6E0; color: #8A5A00; }
.alert.gold { background: var(--goldl); color: #7A5C00; font-weight: 700; }
.tag { display: inline-flex; align-items: center; gap: 3px; font-size: 11px; padding: 1px 9px; border-radius: 999px; background: var(--band); color: var(--navy2); font-weight: 700; }
.tag.sp { background: var(--goldl); color: #8A6A00; }
.tag.lk { background: #FFE9C7; color: #9A5B00; }
.pill { display: inline-flex; align-items: center; gap: 4px; font-size: 11.5px; padding: 1px 10px; border-radius: 999px; background: var(--band); color: var(--muted); font-weight: 600; }
.pill.ok { background: #E3F6EA; color: var(--green); }

/* ---------- ورود ---------- */
body.auth { display: grid; place-items: center; min-height: 100vh; padding: 20px; background: radial-gradient(120% 80% at 50% 0%, #1E4479 0%, #0B1F3A 62%); }
.authbox { width: 100%; max-width: 380px; background: #fff; border-radius: 24px; padding: 28px 22px; box-shadow: 0 24px 60px rgba(0,0,0,.35); display: grid; gap: 12px; }
.authbox h1 { margin: 0; text-align: center; font-size: 23px; }
.authbox p { margin: -6px 0 4px; text-align: center; }
.authlogo { width: 68px; height: 68px; margin: 0 auto; display: grid; place-items: center; color: var(--navy); background: linear-gradient(135deg, var(--gold2), var(--gold)); border-radius: 20px; box-shadow: 0 10px 24px rgba(201,162,39,.35); }
.authlogo .i { width: 34px; height: 34px; }

/* ---------- خانه ---------- */
.hero { background: linear-gradient(150deg, #0B1F3A 0%, #17345F 70%, #1E4479 100%); color: #fff; border-radius: 22px; padding: 18px; box-shadow: 0 14px 34px rgba(11,31,58,.28); position: relative; overflow: hidden; }
.hero::after { content: ''; position: absolute; width: 220px; height: 220px; border-radius: 50%; background: radial-gradient(circle, rgba(231,197,90,.22), transparent 70%); top: -80px; left: -60px; }
.hero-top { display: flex; justify-content: space-between; gap: 10px; font-size: 13px; align-items: center; }
.hero-top > span:first-child { display: flex; gap: 6px; align-items: center; color: #F3D77A; font-weight: 700; }
.hero-top .muted { color: #A9B8CF; }
.hero-rate { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; margin: 2px 0 0; }
.hero-rate b { font-size: 42px; font-weight: 900; letter-spacing: .5px; }
.hero-rate > span { color: #C9D5E6; }
.hero-sub { font-size: 12.5px; color: #C9D5E6; display: flex; gap: 6px; flex-wrap: wrap; align-items: center; }
.hero-sub small { color: #F3D77A; }
.chg { font-size: 13px; font-weight: 700; padding: 1px 8px; border-radius: 8px; background: rgba(255,255,255,.1); }
.chg.up { color: #FF9C9C; } .chg.down { color: #7EE2A1; }
.seg { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; background: var(--bg); padding: 5px; border-radius: 15px; margin: 0 0 14px; }
.seg.dark { background: rgba(0,0,0,.2); margin: 14px 0 0; }
.seg label { margin: 0; }
.seg input { display: none; }
.seg span { display: flex; align-items: center; justify-content: center; gap: 6px; text-align: center; padding: 9px 6px; border-radius: 11px; font-size: 13.5px; cursor: pointer; opacity: .85; }
.seg input:checked + span { background: #fff; color: var(--navy); font-weight: 800; opacity: 1; box-shadow: 0 2px 8px rgba(0,0,0,.12); }
.fixedbox { display: none; gap: 8px; margin-top: 10px; }
.fixedbox[data-show="1"] { display: flex; }
.fixedbox input { background: rgba(255,255,255,.96); border: 0; text-align: center; font-weight: 800; font-size: 17px; }
body[data-live="0"] #refreshRate { display: none; }

.lockcard { display: flex; align-items: center; gap: 12px; margin-top: 12px; background: #fff; border: 1px solid var(--line); border-radius: var(--r); padding: 14px; box-shadow: var(--sh); }
.lock-ic { width: 46px; height: 46px; border-radius: 14px; display: grid; place-items: center; background: var(--band); color: var(--navy2); flex: none; }
.lock-ic .i { width: 24px; height: 24px; }
.lock-txt { flex: 1; display: flex; flex-direction: column; line-height: 1.5; min-width: 0; }
.lock-txt b { font-size: 15.5px; }
.lock-txt small { color: var(--muted); font-size: 12px; }
.lockcard.on { background: linear-gradient(135deg, #FFF7DC, #FFEFC0); border-color: #EBCF7A; }
.lockcard.on .lock-ic { background: linear-gradient(135deg, var(--gold2), var(--gold)); color: var(--navy); }
.lockcard.on .lock-txt small { color: #7A5C00; }
.radios { display: grid; gap: 8px; }
.radio input { display: none; }
.radio span { display: grid; grid-template-columns: auto 1fr; column-gap: 8px; align-items: center; padding: 12px; border: 1.5px solid var(--line); border-radius: 14px; cursor: pointer; font-weight: 700; }
.radio span small { grid-column: 2; font-weight: 400; color: var(--muted); font-size: 12px; margin: 0; }
.radio input:checked + span { border-color: var(--gold); background: var(--goldl); }

.quick { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 12px; }
@media (min-width: 900px) { .quick { grid-template-columns: repeat(4, 1fr); } }
.q { display: flex; flex-direction: column; gap: 2px; padding: 14px; border-radius: var(--r); color: var(--navy); background: #fff; border: 1px solid var(--line); box-shadow: var(--sh); min-height: 112px; }
.q .i { width: 30px; height: 30px; padding: 6px; box-sizing: content-box; border-radius: 12px; margin-bottom: 6px; }
.q b { font-size: 14.5px; } .q small { color: var(--muted); font-size: 11.5px; }
.q1 .i { background: #E8F0FF; color: var(--accent); }
.q2 .i { background: #E2F7EA; color: var(--green); }
.q3 .i { background: #F3EAFE; color: #7C3AED; }
.q4 .i { background: var(--goldl); color: #9A7400; }
.q1 { background: linear-gradient(160deg, #fff 55%, #F1F6FF); }

.kpis { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 12px; }
@media (min-width: 900px) { .kpis { grid-template-columns: repeat(4, 1fr); } }
.kpi { position: relative; background: #fff; border: 1px solid var(--line); border-radius: var(--r); padding: 12px; box-shadow: var(--sh); display: flex; flex-direction: column; min-width: 0; }
.kpi i { position: absolute; top: 12px; left: 12px; width: 30px; height: 30px; border-radius: 10px; display: grid; place-items: center; }
.kpi i .i { width: 17px; height: 17px; }
.kpi .k1 { background: #E8F0FF; color: var(--accent); } .kpi .k2 { background: var(--goldl); color: #9A7400; }
.kpi .k3 { background: #E2F7EA; color: var(--green); } .kpi .k4 { background: #FDECEC; color: var(--red); }
.kpi small { color: var(--muted); font-size: 12px; }
.kpi b { font-size: 20px; font-weight: 800; color: var(--navy); }
.kpi span { font-size: 11.5px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.grid2 { display: grid; gap: 14px; margin-top: 14px; }
@media (min-width: 900px) { .grid2 { grid-template-columns: 1fr 1fr; } }
.spark { width: 100%; height: 110px; display: block; }
.spark .area { fill: rgba(46,124,246,.10); stroke: none; }
.spark .line { fill: none; stroke: var(--accent); stroke-width: 2.5; vector-effect: non-scaling-stroke; stroke-linejoin: round; }
.spark .dot { fill: var(--gold); }
.sparklbl { direction: ltr; display: flex; justify-content: space-between; font-size: 11px; color: var(--muted); }
.recent { list-style: none; margin: 0; padding: 0; }
.recent li { display: grid; grid-template-columns: 1fr auto; gap: 0 10px; padding: 8px 0; border-bottom: 1px dashed var(--line); font-size: 13.5px; }
.recent li:last-child { border: 0; }
.recent .m { font-weight: 700; text-align: right; }
.recent small { grid-column: 1 / -1; color: var(--muted); font-size: 11px; }
.up { color: var(--red); } .down { color: var(--green); }

/* ---------- محصولات ---------- */
.bigactions { display: grid; grid-template-columns: 1.6fr 1fr; gap: 8px; margin-bottom: 12px; }
.filters { position: sticky; top: 58px; z-index: 10; background: var(--bg); padding: 6px 0 10px; margin: 0 -16px; padding-inline: 16px; }
@media (min-width: 900px) { .filters { top: 128px; } }
.searchbox { position: relative; }
.searchbox .i { position: absolute; top: 13px; right: 12px; color: var(--muted); }
.searchbox input { padding-right: 40px; }
.chips { display: flex; gap: 6px; overflow-x: auto; margin-top: 8px; scrollbar-width: none; }
.chips::-webkit-scrollbar { display: none; }
.chip { display: inline-flex; gap: 4px; align-items: center; border: 1px solid var(--line); background: #fff; border-radius: 999px; padding: 5px 14px; font-size: 13px; cursor: pointer; white-space: nowrap; }
.chip.on { background: var(--navy); color: #fff; border-color: var(--navy); }
.plist { display: grid; gap: 10px; }
@media (min-width: 700px) { .plist { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1000px) { .plist { grid-template-columns: 1fr 1fr 1fr; } }
.pcard { background: #fff; border: 1px solid var(--line); border-radius: var(--r); padding: 12px; box-shadow: var(--sh); display: grid; gap: 9px; transition: opacity .2s; }
.pcard.sp { border-inline-start: 4px solid var(--gold); }
.pcard.off { opacity: .55; }
.pcard.locked { background: linear-gradient(180deg, #FFFBEE, #fff 70%); border-color: #EBD9A4; }
.pcard.saving { outline: 2px solid rgba(46,124,246,.35); }
.prow1 { display: flex; align-items: center; gap: 10px; }
.pmodel { font-weight: 800; border-color: transparent; background: var(--band); min-height: 42px; padding: 6px 10px; text-align: left; }
.prow2 { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.aedbox { margin-inline-start: auto; display: flex; align-items: center; gap: 6px; font-weight: 600; }
.aedbox input { width: 100px; margin: 0; text-align: center; font-weight: 800; font-size: 16px; background: #FFF9E6; border-color: #EBD9A4; min-height: 42px; }
.aedbox span { font-size: 11px; color: var(--muted); }
.prices { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; background: var(--bg); border-radius: 13px; padding: 7px; }
.prices div { display: flex; flex-direction: column; align-items: center; line-height: 1.35; min-width: 0; }
.prices small { font-size: 10.5px; color: var(--muted); display: flex; gap: 2px; align-items: center; }
.prices b { font-size: 13px; letter-spacing: .2px; }
.prices .c b { color: var(--navy); font-weight: 800; }
.prices input { min-height: 34px; padding: 3px 4px; text-align: center; font-size: 12.5px; font-weight: 800; background: #FFF4D4; border-color: #EBCF7A; border-radius: 10px; margin-top: 2px; }
.pact { display: flex; gap: 6px; align-items: center; }
.ibtn { display: inline-grid; place-items: center; border: 1px solid var(--line); background: #fff; border-radius: 11px; width: 38px; height: 36px; cursor: pointer; color: var(--muted); padding: 0; }
.ibtn .i { width: 18px; height: 18px; }
.ibtn.del:hover, .ibtn.cdel:hover { color: var(--red); border-color: #F4CDD0; }
.ibtn.lockbtn { width: auto; padding: 0 10px; }
.pcard.locked .lockbtn { background: linear-gradient(135deg, var(--gold2), var(--gold)); color: var(--navy); border-color: transparent; }
.switch { position: relative; width: 48px; height: 28px; flex: none; margin: 0; }
.switch.lg { width: 56px; height: 32px; }
.switch input { display: none; }
.switch span { position: absolute; inset: 0; background: #CBD5E1; border-radius: 99px; transition: .2s; cursor: pointer; }
.switch span::after { content: ''; position: absolute; top: 3px; right: 3px; width: 22px; height: 22px; background: #fff; border-radius: 50%; transition: .2s; box-shadow: 0 1px 3px rgba(0,0,0,.25); }
.switch.lg span::after { width: 26px; height: 26px; }
.switch input:checked + span { background: var(--green); }
.lockcard .switch input:checked + span { background: var(--gold); }
.switch input:checked + span::after { right: calc(100% - 25px); }
.switch.lg input:checked + span::after { right: calc(100% - 29px); }
.pcard.flash { animation: fl .9s; }
@keyframes fl { from { background: #E7F7EC; } to { background: #fff; } }

/* پیش‌نمایش ورود */
.pastebox { position: relative; }
.pastebox textarea { min-height: 200px; font-size: 13.5px; }
.pastebox .btn { position: absolute; bottom: 10px; left: 10px; }
.impsum { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 10px; }
.impsum span { font-size: 12.5px; font-weight: 700; padding: 3px 10px; border-radius: 999px; }
.s-new { background: #E2F7EA; color: var(--green); } .s-update { background: #E8F0FF; color: var(--accent); }
.s-same { background: var(--band); color: var(--muted); } .s-bad { background: #FDECEC; color: var(--red); }
.improws { max-height: 46vh; overflow-y: auto; border: 1px solid var(--line); border-radius: 14px; }
.irow { display: grid; grid-template-columns: auto 1fr auto; gap: 8px; align-items: center; padding: 9px 10px; border-bottom: 1px solid var(--line); font-size: 13px; }
.irow:last-child { border: 0; }
.irow input { width: 20px; height: 20px; min-height: 0; accent-color: var(--navy); }
.irow .m { font-weight: 700; text-align: left; direction: ltr; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.irow .p { text-align: left; white-space: nowrap; font-weight: 800; }
.irow .p del { color: var(--muted); font-weight: 400; margin-left: 4px; font-size: 11.5px; }
.irow .st { grid-column: 2 / 4; font-size: 11px; display: flex; gap: 6px; }
.irow .st span { padding: 0 8px; border-radius: 999px; }
.irow.bad { background: #FFF8F8; }
.opts { display: grid; gap: 10px; margin: 12px 0; }

/* ---------- برگه پایینی ---------- */
.sheet { position: fixed; inset: 0; z-index: 60; display: none; }
.sheet.open { display: block; }
.sheet-bg { position: absolute; inset: 0; background: rgba(8,18,35,.5); opacity: 0; transition: opacity .25s; }
.sheet.show .sheet-bg { opacity: 1; }
.sheet-card { position: absolute; inset-inline: 0; bottom: 0; max-height: 92vh; display: flex; flex-direction: column; background: #fff; border-radius: 24px 24px 0 0;
  transform: translateY(100%); transition: transform .28s cubic-bezier(.2,.8,.2,1); padding-bottom: env(safe-area-inset-bottom); }
.sheet.show .sheet-card { transform: none; }
@media (min-width: 700px) { .sheet-card { max-width: 560px; margin: 0 auto; bottom: 50%; border-radius: 24px; transform: translateY(60%); opacity: 0; transition: .25s; } .sheet.show .sheet-card { transform: translateY(50%); opacity: 1; } }
.sheet-grip { width: 42px; height: 5px; border-radius: 9px; background: #D5DCE6; margin: 8px auto 0; }
.sheet-head { display: flex; align-items: center; justify-content: space-between; padding: 8px 16px; }
.sheet-head h3 { margin: 0; font-size: 16.5px; display: flex; gap: 8px; align-items: center; }
.sheet-head h3 .i { color: var(--accent); }
.sheet-body { overflow-y: auto; padding: 4px 16px 18px; }
body.noscroll { overflow: hidden; }

/* ---------- ارسال ---------- */
.modecard { display: flex; gap: 12px; align-items: center; background: #fff; border: 1px solid var(--line); border-radius: var(--r); padding: 12px 14px; margin-bottom: 12px; box-shadow: var(--sh); }
.modecard > .i { width: 38px; height: 38px; padding: 8px; box-sizing: content-box; border-radius: 13px; background: var(--band); color: var(--navy2); }
.modecard div { flex: 1; display: flex; flex-direction: column; line-height: 1.6; }
.modecard small { color: var(--muted); font-size: 12px; }
.modecard.ok > .i { background: #E2F7EA; color: var(--green); }
.selbar { display: flex; justify-content: space-between; align-items: center; padding: 4px 4px 10px; }
.clist { display: grid; gap: 8px; }
@media (min-width: 700px) { .clist { grid-template-columns: 1fr 1fr; } }
.ccard { display: flex; align-items: center; gap: 12px; background: #fff; border: 1px solid var(--line); border-radius: var(--r); padding: 12px; box-shadow: var(--sh); transition: border-color .2s, background .2s; }
.ccard.sel { border-color: #9EC1FF; background: #F6F9FF; }
.cchk input { display: none; }
.cchk span { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 10px; border: 2px solid #C5D0DF; cursor: pointer; transition: .15s; }
.cchk input:checked + span { background: var(--accent); border-color: var(--accent); }
.cchk input:checked + span::after { content: ''; width: 12px; height: 7px; border: 3px solid #fff; border-top: 0; border-right: 0; transform: rotate(-45deg) translate(1px, -1px); }
.cbody { flex: 1; min-width: 0; display: flex; flex-direction: column; line-height: 1.5; }
.cbody b { font-size: 15px; }
.cph { font-size: 13px; color: var(--muted); text-align: right; }
.cmeta { display: flex; gap: 8px; align-items: center; font-size: 11.5px; flex-wrap: wrap; }
.ltag { padding: 0 8px; border-radius: 999px; font-weight: 700; }
.ltag.c { background: #E8F0FF; color: var(--accent); } .ltag.p { background: #E6EAF2; color: var(--navy2); }
.note { color: #8A6A00; font-size: 11.5px; }
.cact { display: flex; flex-direction: column; gap: 6px; }
.empty { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 4px; padding: 40px 20px; color: var(--muted); }
.empty .i { width: 48px; height: 48px; color: #B8C4D6; }
.empty b { color: var(--text); }
.sendbar { position: sticky; bottom: calc(var(--nav-h) + 22px); z-index: 8; display: flex; gap: 8px; align-items: center; margin-top: 14px; background: rgba(255,255,255,.96); border: 1px solid var(--line); border-radius: 20px; padding: 8px; box-shadow: 0 10px 28px rgba(11,31,58,.15); backdrop-filter: blur(10px); }
@media (min-width: 900px) { .sendbar { bottom: 14px; } }
.sendopts { display: flex; flex-direction: column; gap: 4px; }
.mini input { display: none; }
.mini span { display: flex; gap: 4px; align-items: center; font-size: 12px; padding: 2px 10px; border-radius: 9px; border: 1px solid var(--line); cursor: pointer; color: var(--muted); }
.mini input:checked + span { background: var(--navy); color: #fff; border-color: var(--navy); }
.sendsum { font-weight: 700; margin-bottom: 8px; }
.progress { height: 8px; background: var(--band); border-radius: 9px; overflow: hidden; margin-bottom: 10px; }
.progress span { display: block; height: 100%; width: 0; background: linear-gradient(90deg, #25D366, #12A04E); transition: width .3s; }
.sendlist { list-style: none; margin: 0 0 10px; padding: 0; max-height: 52vh; overflow-y: auto; }
.sendlist li { display: flex; align-items: center; gap: 10px; padding: 10px 2px; border-bottom: 1px solid var(--line); }
.sendlist li b { flex: 1; }
.sendlist .st { font-size: 12.5px; font-weight: 700; color: var(--muted); }
.sendlist .st.ok { color: var(--green); } .sendlist .st.err { color: var(--red); } .sendlist .st.run { color: var(--accent); }
.sendlist .btn { min-height: 38px; }

/* ---------- لیست‌ها ---------- */
.tabs { display: flex; gap: 6px; overflow-x: auto; margin-bottom: 12px; scrollbar-width: none; }
.tabs::-webkit-scrollbar { display: none; }
.tabs a { flex: 1 0 auto; text-align: center; padding: 8px 14px; border-radius: 13px; background: #fff; border: 1px solid var(--line); color: var(--navy); font-weight: 600; font-size: 14px; white-space: nowrap; }
.tabs a.on { background: var(--navy); color: #fff; border-color: var(--navy); }
.actgrid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-bottom: 14px; }
@media (min-width: 700px) { .actgrid { grid-template-columns: repeat(6, 1fr); } }
.act { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 12px 6px; background: #fff; border: 1px solid var(--line); border-radius: var(--r); box-shadow: var(--sh); color: var(--navy); font-size: 12.5px; font-weight: 700; cursor: pointer; }
.act i { width: 44px; height: 44px; border-radius: 14px; display: grid; place-items: center; }
.act i .i { width: 22px; height: 22px; }
.a1 { background: linear-gradient(135deg, var(--gold2), var(--gold)); color: var(--navy); }
.a2 { background: #E2F7EA; color: var(--green); } .a3 { background: #E8F0FF; color: var(--accent); }
.a4 { background: #F3EAFE; color: #7C3AED; } .a5 { background: #FDECEC; color: var(--red); } .a6 { background: #E6EAF2; color: var(--navy2); }
.act:active { transform: scale(.97); }
.poster-wrap { background: #fff; border: 1px solid var(--line); border-radius: var(--r); padding: 10px; margin-bottom: 14px; box-shadow: var(--sh); }
.poster-wrap img { display: block; width: 100%; max-width: 560px; margin: 0 auto; border-radius: 12px; }
.poster-wrap img:not([src]) { display: none; }
#waText { direction: rtl; font-size: 13.5px; }
details.card summary { cursor: pointer; font-weight: 700; list-style: none; display: flex; gap: 8px; align-items: center; }
details.card summary::-webkit-details-marker { display: none; }
details.card summary::after { content: '▾'; margin-inline-start: auto; color: var(--muted); }
details[open].card summary { margin-bottom: 10px; }

/* ---------- اعلان ---------- */
.toast { position: fixed; inset-inline: 16px; bottom: calc(var(--nav-h) + 30px); z-index: 80; margin: 0 auto; max-width: 420px; background: var(--navy); color: #fff;
  padding: 12px 16px; border-radius: 15px; box-shadow: 0 10px 30px rgba(0,0,0,.25); font-size: 14px; text-align: center;
  opacity: 0; transform: translateY(12px); transition: .25s; pointer-events: none; }
.toast.show { opacity: 1; transform: none; }
.toast.err { background: var(--red); }
@media (min-width: 900px) { .toast { bottom: 24px; } }

/* ---------- تصاویر لیست ---------- */
.posters { display: grid; gap: 12px; margin-bottom: 14px; }
@media (min-width: 900px) { .posters { grid-template-columns: 1fr 1fr; } }
.posters figure { margin: 0; background: #fff; border: 1px solid var(--line); border-radius: var(--r); padding: 8px; box-shadow: var(--sh); }
.posters img { display: block; width: 100%; border-radius: 12px; }
.posters figcaption { text-align: center; font-size: 12px; color: var(--muted); padding-top: 6px; }
.muted2 { opacity: .8; font-weight: 500; font-size: 12.5px; }
#waText { min-height: 50vh; }

/* ---------- دسته‌بندی‌ها ---------- */
.catbtn { margin: -2px 0 12px; min-height: 42px; font-size: 14px; }
select.pcat { width: auto; min-height: 30px; padding: 1px 26px 1px 10px; font-size: 12px; font-weight: 700; border-radius: 999px; background-color: var(--band); border-color: transparent; color: var(--navy2); }
.selwrap { display: block; margin-top: 5px; }
.selwrap select { font-weight: 500; }
.catlist { display: grid; gap: 8px; }
.catrow { display: grid; grid-template-columns: 1fr auto auto auto auto; gap: 6px; align-items: center; }
.catrow input { min-height: 42px; font-weight: 700; }
.catrow small { white-space: nowrap; font-size: 11.5px; }
.listcats { display: flex; gap: 6px; align-items: center; overflow-x: auto; margin: -4px 0 12px; padding-bottom: 2px; scrollbar-width: none; }
.listcats::-webkit-scrollbar { display: none; }
.listcats > span { white-space: nowrap; display: flex; gap: 4px; align-items: center; }
.lc input { display: none; }
.lc span { display: inline-flex; padding: 5px 14px; border-radius: 999px; border: 1px solid var(--line); background: #fff; font-size: 13px; font-weight: 600; white-space: nowrap; cursor: pointer; }
.lc input:checked + span { background: var(--navy); color: #fff; border-color: var(--navy); }
.chip small { opacity: .7; font-size: 11px; }
select.pcat { max-width: 150px; text-overflow: ellipsis; }

.sendlist li.man { flex-wrap: wrap; row-gap: 8px; }
.sendlist li.man b { flex: 1 1 auto; }
.sendlist .mbtns { display: flex; gap: 6px; width: 100%; }
.sendlist .mbtns .btn { flex: 1; padding: 6px 8px; font-size: 12.5px; }
.sendlist .mbtns .btn.done { background: #E3F4EA; border-color: #BFE3CD; color: #146C3A; }
.sendlist .mbtns .btn:disabled { opacity: .45; }

/* ---- سود اختصاصی هر مدل ---- */
.pmk { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 8px 0; }
.pmk label { margin: 0; font-size: 11.5px; color: var(--muted); font-weight: 600; }
.pmk label span { display: flex; align-items: center; gap: 4px; margin-bottom: 3px; }
.pmk em { font-style: normal; font-size: 10px; background: var(--band); color: var(--navy2); padding: 0 6px; border-radius: 99px; }
.pmk input { min-height: 40px; padding: 6px 10px; text-align: center; font-weight: 800; font-size: 15px; background: #F5F8FF; border-color: #D5DEEE; }
.pmk.set input { background: #EEF5FF; border-color: #9DBBF0; color: var(--navy); }
.pmk .mknote { grid-column: 1 / -1; color: #9A5B00; font-size: 11px; margin: 0; }