/* لایهٔ هویت بصری پرند — بعد از CSS صفحه‌ها بارگذاری می‌شود
   امضا: «شبکهٔ داده» برگرفته از نشان پرِ داده؛ فقط روی سطوح تیره (منو، سربرگ‌ها، ورود).
   بقیهٔ رابط آرام می‌ماند: خط مو، سایهٔ نرم، اعداد جدولی. */

:root {
  --grid-line: color-mix(in srgb, var(--ink-inverse) 5%, transparent);
  --glow: color-mix(in srgb, var(--accent-bright) 22%, transparent);
  --glow-bank: color-mix(in srgb, var(--bank-accent) 22%, transparent);
  --logo-ac: var(--accent);
}

/* ---------- سطوح تیرهٔ امضادار ---------- */
.sidebar, .db-pulse, .login .l-art, .fm-cyc, .pr-hero .pr-h.pr-main, .bz-preview .pv-h, .fapp .f-top {
  background:
    radial-gradient(90% 70% at 100% 0%, var(--glow), transparent 60%),
    linear-gradient(var(--grid-line) 1px, transparent 1px) 0 0 / 22px 22px,
    linear-gradient(90deg, var(--grid-line) 1px, transparent 1px) 0 0 / 22px 22px,
    linear-gradient(160deg, var(--brand-deep) 0%, var(--brand-night) 100%);
}
[data-shell="bank"] .sidebar, .bk-hero, .bk-big.main {
  background:
    radial-gradient(90% 70% at 100% 0%, var(--glow-bank), transparent 60%),
    linear-gradient(var(--grid-line) 1px, transparent 1px) 0 0 / 22px 22px,
    linear-gradient(90deg, var(--grid-line) 1px, transparent 1px) 0 0 / 22px 22px,
    linear-gradient(160deg, var(--bank-deep) 0%, var(--bank-night) 100%);
}
.sidebar, [data-shell="bank"] .sidebar { background-attachment: local; }
.sidebar .logo, .fapp .f-top .logo, .login .l-art .logo { --logo-ac: var(--accent-bright); }
[data-shell="bank"] .sidebar .logo { --logo-ac: var(--bank-accent); }

/* واترمارک نشان روی سربرگ‌ها */
.db-pulse::after, .bk-hero::after, .login .l-art::after {
  content: ''; position: absolute; pointer-events: none; border: 0; border-radius: 0;
  background: url('../img/parand-mark-white.svg') no-repeat center / contain; opacity: .07;
}
.db-pulse::after { left: 28px; top: 50%; width: 150px; height: 150px; transform: translateY(-50%); opacity: .08; }
@media (max-width: 900px) { .db-pulse::after { display: none; } }
.bk-hero::after { inset: auto; left: 290px; top: 50%; width: 140px; height: 140px; transform: translateY(-50%); opacity: .08; }
@media (max-width: 1100px) { .bk-hero::after { display: none; } }
.login .l-art::after { left: -70px; top: -70px; width: 400px; height: 400px; opacity: .05; }
.login .l-art > * { position: relative; z-index: 1; }

/* ---------- منوی کناری ---------- */
.sidebar { box-shadow: inset 1px 0 0 color-mix(in srgb, var(--ink-inverse) 6%, transparent); scrollbar-width: thin; scrollbar-color: color-mix(in srgb, var(--ink-inverse) 18%, transparent) transparent; }
.side-brand { padding: 20px var(--s4) 16px; }
.side-brand .logo { width: 36px; height: 36px; filter: drop-shadow(0 0 12px color-mix(in srgb, var(--accent-bright) 35%, transparent)); }
[data-shell="bank"] .side-brand .logo { filter: drop-shadow(0 0 12px color-mix(in srgb, var(--bank-accent) 35%, transparent)); }
.side-brand .b-name { font-size: 21px; font-weight: 850; letter-spacing: -.4px; display: flex; align-items: baseline; gap: 8px; }
.side-brand .b-lat { font-size: 9.5px; font-weight: 700; letter-spacing: 2.4px; opacity: .45; }
.side-nav .grp { opacity: .45; font-weight: 600; letter-spacing: .2px; }
.side-nav a { opacity: .78; transition: background .15s, opacity .15s; }
.side-nav a:hover { background: color-mix(in srgb, var(--ink-inverse) 6%, transparent); }
.side-nav a.active {
  background: linear-gradient(to left, color-mix(in srgb, var(--accent-bright) 18%, transparent), color-mix(in srgb, var(--accent-bright) 3%, transparent));
  box-shadow: inset -3px 0 0 var(--accent-bright);
}
.side-nav a.active .ic { color: var(--accent-bright); }
[data-shell="bank"] .side-nav a.active { background: linear-gradient(to left, color-mix(in srgb, var(--bank-accent) 20%, transparent), color-mix(in srgb, var(--bank-accent) 3%, transparent)); box-shadow: inset -3px 0 0 var(--bank-accent); }
[data-shell="bank"] .side-nav a.active .ic { color: var(--bank-accent); }
.side-foot { border-top-color: color-mix(in srgb, var(--ink-inverse) 8%, transparent); opacity: .6; }

/* ---------- نوار بالا ---------- */
.topbar { background: color-mix(in srgb, var(--bg-panel) 84%, transparent); backdrop-filter: saturate(1.5) blur(14px); -webkit-backdrop-filter: saturate(1.5) blur(14px); border-bottom-color: var(--line); }
.tb-search input { background: var(--bg-sunken); border-color: transparent; transition: border-color .15s, background .15s; }
.tb-search input:focus { background: var(--bg-panel); border-color: var(--focus); outline: 0; box-shadow: 0 0 0 3px color-mix(in srgb, var(--focus) 18%, transparent); }
.tb-btn { border-color: var(--line); box-shadow: 0 1px 1px color-mix(in srgb, var(--ink) 4%, transparent); }
.tb-btn.price { background: var(--brand); border-color: var(--brand); color: var(--brand-ink); box-shadow: inset 0 1px 0 color-mix(in srgb, var(--ink-inverse) 16%, transparent), 0 1px 2px color-mix(in srgb, var(--brand-deep) 30%, transparent); }
.tb-btn.price:hover { background: var(--brand-strong); }
[data-shell="bank"] .tb-btn.price { background: var(--bank); border-color: var(--bank); color: var(--ink-inverse); }
[data-shell="bank"] .tb-btn.price:hover { background: var(--bank-strong); }
.avatar { box-shadow: 0 0 0 2px var(--bg-panel), 0 0 0 3.5px color-mix(in srgb, var(--brand) 35%, transparent); }
[data-shell="bank"] .avatar { box-shadow: 0 0 0 2px var(--bg-panel), 0 0 0 3.5px color-mix(in srgb, var(--bank) 35%, transparent); }

/* ---------- سرصفحه ---------- */
.page-head h1 { font-size: 27px; font-weight: 850; letter-spacing: -.5px; }
.section-h h2 { font-weight: 800; letter-spacing: -.2px; }

/* ---------- کارت، KPI، جدول ---------- */
.card, .kpi, .tbl-wrap, .role-card { box-shadow: var(--shadow-card); }
.card.sunken, .card.brand, .card.bankc { box-shadow: none; }
.card-h h3 { font-weight: 750; letter-spacing: -.1px; }
.kpis { grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); }
/* شش KPI: سه‌در‌دو تا ردیف یتیم یا برچسب شکسته نماند */
.kpis:has(> :nth-child(6):last-child) { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (min-width: 1680px) { .kpis:has(> :nth-child(6):last-child) { grid-template-columns: repeat(6, minmax(0, 1fr)); } }
@media (max-width: 768px) { .kpis:has(> :nth-child(6):last-child) { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.kpi { transition: box-shadow .18s, transform .18s, border-color .18s; }
a.kpi:hover { background: var(--bg-panel); border-color: var(--line-strong); box-shadow: var(--shadow-raise); transform: translateY(-1px); }
.kpi .k-label { font-size: 12.5px; font-weight: 600; }
.kpi .k-value { font-weight: 850; letter-spacing: -.8px; }
.kpi .k-spark { top: auto; bottom: var(--s4); }
table.t th { background: color-mix(in srgb, var(--bg-sunken) 70%, var(--bg-panel)); color: var(--ink-3); font-weight: 650; letter-spacing: .1px; }
table.t td { border-bottom-color: color-mix(in srgb, var(--line) 75%, transparent); }
table.t tbody tr.click { transition: background .12s; }

/* ---------- دکمه ---------- */
.btn { border-color: var(--line-strong); box-shadow: 0 1px 1px color-mix(in srgb, var(--ink) 4%, transparent); transition: background .15s, border-color .15s, box-shadow .15s; }
.btn.ghost { box-shadow: none; }
.btn.primary, .btn.bank, .fab { box-shadow: inset 0 1px 0 color-mix(in srgb, var(--ink-inverse) 16%, transparent), 0 1px 2px color-mix(in srgb, var(--ink) 22%, transparent); }
.btn.primary:hover, .btn.bank:hover { box-shadow: inset 0 1px 0 color-mix(in srgb, var(--ink-inverse) 16%, transparent), 0 6px 16px -6px color-mix(in srgb, var(--ink) 45%, transparent); }
.fab { box-shadow: inset 0 1px 0 color-mix(in srgb, var(--ink-inverse) 16%, transparent), 0 12px 28px -8px color-mix(in srgb, var(--brand-deep) 70%, transparent); }
.seg { background: color-mix(in srgb, var(--bg-sunken) 85%, var(--line)); }
.seg button.on { box-shadow: 0 1px 2px color-mix(in srgb, var(--ink) 10%, transparent), 0 0 0 1px color-mix(in srgb, var(--ink) 4%, transparent); }
.tab.active { border-bottom-width: 2.5px; }

/* ---------- داشبورد ---------- */
.db-pulse { border-radius: var(--r-modal); box-shadow: var(--shadow-raise); }
.db-pulse-num { font-weight: 850; letter-spacing: -2px; }
.db-st i { background: var(--accent-bright); }
.db-st-cleaning i { background: color-mix(in srgb, var(--ink-inverse) 35%, transparent); }
.db-st-planned i { background: var(--warn); }

/* ---------- بانک ---------- */
.bk-hero { box-shadow: var(--shadow-raise); }
.bk-hero-u { background: color-mix(in srgb, var(--ink-inverse) 7%, transparent); border-color: color-mix(in srgb, var(--ink-inverse) 14%, transparent); backdrop-filter: blur(6px); }

/* ---------- مرغدار ---------- */
.fapp .f-top { box-shadow: 0 1px 0 color-mix(in srgb, var(--ink-inverse) 6%, transparent); }
.fapp .f-top button, .fapp .f-top a { background: color-mix(in srgb, var(--ink-inverse) 9%, transparent); }
.fm-cyc { box-shadow: var(--shadow-raise); }
.fm-stat { box-shadow: 0 1px 2px color-mix(in srgb, var(--ink) 12%, transparent); }
.fm-st { border-radius: 8px; padding: 3px 8px; line-height: 1.45; }
.f-nav { background: color-mix(in srgb, var(--bg-panel) 90%, transparent); backdrop-filter: saturate(1.5) blur(14px); -webkit-backdrop-filter: saturate(1.5) blur(14px); }
.f-nav a.active { position: relative; }
.f-nav a.active::before { content: ''; position: absolute; top: 0; width: 28px; height: 3px; border-radius: 0 0 3px 3px; background: var(--brand); }

/* ---------- ورود ---------- */
.login .l-art { gap: var(--s5); }
.login .l-art h1 { font-size: 42px; font-weight: 850; letter-spacing: -.8px; }
.login .l-art .logo { filter: drop-shadow(0 0 16px color-mix(in srgb, var(--accent-bright) 40%, transparent)); }
.login .l-art .l-scene { border-radius: var(--r-modal); box-shadow: 0 30px 60px -20px color-mix(in srgb, var(--brand-night) 90%, transparent); }
.login .l-roles { justify-content: center; max-width: 720px; }
.role-card { transition: border-color .15s, box-shadow .15s, transform .15s; }
.role-card:hover { background: var(--bg-panel); box-shadow: var(--shadow-raise); transform: translateY(-1px); }

/* ---------- پاپ‌آپ‌ها ---------- */
.menu, .modal, .hq-pop { box-shadow: var(--shadow-float); border-color: var(--line); }
.backdrop { background: color-mix(in srgb, var(--brand-night) 45%, transparent); backdrop-filter: blur(3px); }

@media (prefers-reduced-motion: reduce) { a.kpi:hover, .role-card:hover { transform: none; } }
@media (max-width: 900px) { .login .l-art h1 { font-size: 30px; } }
@media (max-width: 768px) { .tb-search input::placeholder { color: transparent; } }
/* نوار اعتماد داده: شش شاخص و خلاصه در یک ردیف بمانند */
@media (min-width: 1025px) { .bk-tr-i { flex-basis: 135px; } .bk-tr-sum { flex: 0 0 150px; } }