/* =========================================================
   فیش‌باز | style.css
   تم سیاه / سفید / طلایی — موبایل‌فرست، ریسپانسیو، راست‌چین
   ========================================================= */
:root{
  --bg:#ffffff;
  --bg-soft:#f5f6f7;
  --card:#ffffff;
  --ink:#0d0d0d;
  --ink-2:#3a3d44;
  --muted:#5f6166;
  --line:#e8e8ea;
  --line-2:#f1f1f3;
  --gold:#FDC92C;
  --gold-d:#8a6a00;
  --gold-soft:#fff6d8;
  --gold-grad:linear-gradient(135deg,#ffe27a,#FDC92C);
  --on-gold:#0d0d0d;
  --green:#1e9e6a; --green-soft:#e7f6ee;
  --red:#e23b3b; --red-soft:#fdeaea;
  --amber:#e0930c; --amber-soft:#fcefd6;
  --blue:#3b6fd4; --blue-soft:#e9f0fc;
  --radius:12px;
  --radius-sm:10px;
  --shadow:0 1px 2px rgba(13,13,13,.04), 0 6px 18px rgba(13,13,13,.06);
  --shadow-lg:0 8px 40px rgba(13,13,13,.16);
  --fast:.16s; --bez:cubic-bezier(.2,.9,.25,1);
  /* مقیاس فاصله 4pt: 4/8/12/16/20/24 */
  --space-1:4px; --space-2:8px; --space-3:12px; --space-4:16px; --space-5:20px; --space-6:24px;
  /* تایپوگرافی — مقیاس استاندارد 12/13/14/15/16/18/22 */
  --fs-12:0.75rem; --fs-13:0.8125rem; --fs-14:0.875rem; --fs-15:0.9375rem; --fs-16:1rem; --fs-18:1.125rem; --fs-22:1.375rem;
  --fs-xs:var(--fs-13); --fs-sm:var(--fs-14); --fs-base:var(--fs-15); --fs-md:var(--fs-16); --fs-lg:var(--fs-18); --fs-xl:var(--fs-22);
  /* وزن‌ها — فقط 400/500/600/700 */
  --fw-regular:400; --fw-medium:500; --fw-semibold:600; --fw-bold:700; --fw-extrabold:700; --lh-normal:1.55;
  /* ارتفاع کنترل‌ها */
  --h-btn-sm:32px; --h-btn:40px; --h-btn-lg:44px; --h-input:40px; --h-row:48px;
  /* اندازهٔ آیکن: inline/action/nav/glyph */
  --ic-inline:16px; --ic-action:18px; --ic-nav:20px; --ic-glyph:22px;
  /* حداقل سطح لمسی */
  --touch:44px;
}
*{ box-sizing:border-box; }
html,body{ margin:0; padding:0; width:100%; max-width:100%; overflow-x:hidden; }
/* رزرو جای اسکرول‌بار روی اسکرولر اصلی (html) تا ظاهر/مخفی‌شدن آن باعث پرش و جابه‌جایی Layout نشود */
/* overflow-x:hidden روی ریشه تضمین می‌کند هیچ المانی نتواند عرض صفحه را از 100vw بیشتر کند و باعث جابه‌جایی افقی هنگام سوییچ تب/تغییر روز شود */
html{ scrollbar-gutter:stable; overflow-x:hidden; }
body{
  font-family:'YekanBakhFaNum',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  background:var(--bg); color:var(--ink);
  font-size:var(--fs-base); line-height:var(--lh-normal);
  -webkit-tap-highlight-color:transparent;
  scrollbar-gutter:stable;
}
body.modal-open{ padding-right:0 !important; }
/* گارد سراسری: هیچ کانتینر اصلی از عرض دید بیرون نزند */
#appScreen, .app-screen, .app-main, #loginScreen{ max-width:100%; }
button{ font-family:inherit; }

/* حلقهٔ فوکوس فقط با کیبورد */
:focus-visible{ outline:2px solid var(--blue); outline-offset:2px; border-radius:inherit; }
b{ font-weight:700; }
small{ font-size:0.8125rem; }
.text-success{ color:var(--green)!important; }
.text-danger{ color:var(--red)!important; }
.text-muted{ color:var(--muted)!important; }
.d-none{ display:none!important; }
.opacity-50{ opacity:.5; }

/* ============ دکمه‌ها ============ */
.btn{
  border:none; border-radius:var(--radius-sm); font-weight:var(--fw-semibold); cursor:pointer;
  padding:.44rem .9rem; min-height:36px; font-size:var(--fs-sm); display:inline-flex; align-items:center; justify-content:center; gap:.4rem;
  transition:transform var(--fast) var(--bez), background var(--fast), box-shadow var(--fast), color var(--fast), border-color var(--fast), filter var(--fast); line-height:1;
}
.btn:active{ transform:scale(.97); }
/* انیمیشن نرم و سریع برای دکمه‌ها/باکس‌های هاوردار که ترنزیشن نداشتند */
.day-pill,.day-nav,.btn-logout,#settingsBtn,.btn-close,.kebab-btn,.kebab-menu button,.btn-remove-sheba,.jc-day,.bal-row,.pr-head,.rl-flag-ic,.flagged-item,.rs-more,.rl-more,.pdf-dl,.pass-toggle,.imper-back,.prof-back,.acc-receipt,.acc-check,.rs-item.rs-clickable,.prof-menu-item,.dev-more,.drill-close,.drill-back,.drill-crumb,.drill-row,.kpi-card{ transition:background-color .12s var(--bez), color .12s var(--bez), border-color .12s var(--bez), box-shadow .12s var(--bez), transform .12s var(--bez), filter .12s var(--bez), opacity .12s var(--bez); }
.btn i{ font-size:var(--ic-action); }
.btn-primary{ background:var(--gold-grad); color:var(--on-gold); box-shadow:0 4px 14px rgba(253,201,44,.30); transition:filter var(--fast), box-shadow var(--fast), transform var(--fast); --bs-btn-active-color:var(--on-gold); --bs-btn-hover-color:var(--on-gold); --bs-btn-active-bg:transparent; --bs-btn-active-border-color:transparent; }
.btn-primary:active,.btn-primary:focus,.btn-primary:focus-visible,.btn-primary.active,.btn-primary:active:focus,.btn-primary:not(:disabled):not(.disabled):active{ background:var(--gold-grad)!important; color:var(--on-gold)!important; border-color:transparent; }
@media (hover:hover){ .btn-primary:hover{ background:var(--gold-grad); color:var(--on-gold); filter:brightness(1.05); transform:translateY(-1px); box-shadow:0 8px 22px rgba(253,201,44,.45); } }
.btn-primary:active{ transform:translateY(0) scale(.98); }
.btn-secondary{ background:var(--bg-soft); color:var(--ink); border:1px solid var(--line); }
.btn-secondary:hover{ background:#eef0f1; color:var(--ink); }
.btn-ghost{ background:transparent; color:var(--ink-2); }
.btn-sm{ padding:.4rem .72rem; font-size:0.84rem; }
.btn:disabled{ opacity:.6; cursor:default; }
.auth-link.is-disabled{ opacity:.5; cursor:default; }
.w-100{ width:100%; }
.spinner-border{ box-sizing:border-box; width:1.05rem; height:1.05rem; border:2.5px solid rgba(0,0,0,.16); border-top-color:currentColor; border-radius:50%; display:inline-block; animation:spin .7s linear infinite; vertical-align:-2px; }
.spinner-border-sm{ width:.9rem; height:.9rem; border-width:2px; }
@keyframes spin{ to{ transform:rotate(360deg); } }
.btn-close{ background:none; border:none; width:32px; height:32px; min-width:44px; min-height:44px; border-radius:9px; cursor:pointer; position:relative; opacity:.7; }
.btn-close:hover{ opacity:1; background:var(--bg-soft); }
.btn-close::before,.btn-close::after{ content:""; position:absolute; inset:50% auto auto 50%; width:15px; height:2px; background:var(--ink); border-radius:2px; transform-origin:center; }
.btn-close::before{ transform:translate(-50%,-50%) rotate(45deg); }
.btn-close::after{ transform:translate(-50%,-50%) rotate(-45deg); }

/* ============ فرم‌ها ============ */
.form-label{ display:block; font-size:0.875rem; font-weight:600; color:var(--ink-2); margin-bottom:.4rem; }
.form-control,.form-select{
  width:100%; border:1.5px solid var(--line); background:var(--bg-soft); color:var(--ink);
  border-radius:var(--radius-sm); padding:.5rem .8rem; min-height:var(--h-input); font-size:var(--fs-sm); font-family:inherit;
  transition:border-color var(--fast), background var(--fast), box-shadow var(--fast);
}
.form-control:focus,.form-select:focus{ border-color:var(--gold); background:var(--card); box-shadow:0 0 0 3px rgba(253,201,44,.28); }
.form-control::placeholder{ color:var(--muted); font-weight:400; opacity:.5; }
.form-control,.form-select{ font-weight:500; }
.field-ic{ position:relative; }
.field-ic > i{ position:absolute; inset-inline-start:.7rem; top:50%; transform:translateY(-50%); color:var(--muted); font-size:1.05rem; pointer-events:none; }
.field-ic .form-control{ padding-inline-start:2.3rem; }
.hint-line{ color:var(--muted); font-size:0.8125rem; line-height:1.6; }
.input-group{ display:flex; }
.input-group-text{ display:flex; align-items:center; padding:0 .8rem; background:var(--gold-soft); color:var(--gold-d); border:1.5px solid var(--line); border-inline-end:none; border-radius:0 var(--radius-sm) var(--radius-sm) 0; }
.input-group .form-control{ border-radius:var(--radius-sm) 0 0 var(--radius-sm); }
.mb-1{ margin-bottom:.5rem; } .mb-3{ margin-bottom:1rem; } .mt-2{ margin-top:.6rem; }
.text-end{ text-align:end; } .d-block{ display:block; }

/* ============ صفحه ورود ============ */
.login-screen{ min-height:100vh; min-height:100dvh; display:flex; flex-direction:column; align-items:center; justify-content:center; padding:1.5rem; background:radial-gradient(1200px 600px at 50% -10%, var(--gold-soft), var(--bg) 60%); }
.login-card{ width:100%; max-width:380px; background:var(--card); border:1px solid var(--line); border-radius:24px; padding:2rem 1.6rem; box-shadow:var(--shadow-lg); text-align:center; }
.brand-title{ font-size:1.7rem; font-weight:800; margin:0 0 .25rem; letter-spacing:-.5px; }
.brand-sub{ color:var(--muted); font-size:.86rem; margin:0 0 1.6rem; }
.login-card form{ text-align:start; }
.admin-link{ display:inline-flex; align-items:center; gap:.35rem; margin-top:1.2rem; color:var(--muted); text-decoration:none; font-size:0.875rem; transition:color var(--fast); }
.admin-link:hover{ color:var(--gold-d); }
.login-foot{ margin-top:1.4rem; color:var(--muted); font-size:0.8125rem; }

/* ============ پوسته پنل ============ */
.app-screen{ min-height:100vh; min-height:100dvh; display:flex; flex-direction:column; padding-bottom:74px; }
.app-header{
  position:sticky; top:0; z-index:20; background:rgba(255,255,255,.92); backdrop-filter:blur(12px);
  border-bottom:1px solid var(--line); display:flex; align-items:center; gap:.9rem; padding:.7rem 1rem; overflow:hidden;
}
.hdr-right{ flex:1 1 0; display:flex;}
.hdr-brand{ font-weight:var(--fw-bold); font-size:var(--fs-md); display:inline-flex; align-items:center; gap:0; background:none; border:0; padding:0; cursor:default; font-family:inherit; color:var(--ink); }
.hdr-brand i{ color:var(--gold-d); }
.day-nav{ background:var(--bg-soft); border:1px solid var(--line); width:32px; height:40px; border-radius:10px; color:var(--ink-2); cursor:pointer; display:flex; align-items:center; justify-content:center; transition:background var(--fast), transform var(--fast), box-shadow var(--fast); flex-shrink:0; }
.day-nav:active,.day-pill:active,.btn-logout:active{ transform:scale(.92); }
.day-pill{ transition:background var(--fast), transform var(--fast), box-shadow var(--fast); }
@media (hover:hover){ .day-pill:hover{ box-shadow:var(--shadow); } .day-nav:hover{ box-shadow:var(--shadow); } }
.day-nav i{ font-size:1.05rem; }
.day-nav:hover{ background:#eceef0; }
.day-pill{ background:var(--bg-soft); border:1px solid var(--line); border-radius:10px; padding:0 .9rem; min-height:40px; height:40px; font-size:0.9rem; font-weight:600; color:var(--ink); cursor:pointer; display:inline-flex; align-items:center; justify-content:center; gap:.45rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:100%; min-width:0; flex-shrink:0; }
.day-pill i{ color:var(--gold-d); }
.hdr-left{ flex:1 1 0; display:flex; align-items:center; gap:.5rem; justify-content:flex-end; }
.hdr-user{ font-size:0.875rem; color:var(--ink-2); font-weight:600; }
.btn-logout{ background:var(--bg-soft); border:1px solid var(--line); width:36px; height:36px; border-radius:10px; color:var(--ink-2); cursor:pointer; display:flex; align-items:center; justify-content:center; transition:background var(--fast),color var(--fast),border-color var(--fast),transform var(--fast); }
.btn-logout:hover{ background:var(--gold-soft); color:var(--gold-d); border-color:var(--gold); }
#settingsBtn{ color:var(--muted); }
#settingsBtn:hover{ color:var(--gold-d); background:var(--gold-soft); border-color:var(--gold); }
#settingsBtn i{ font-size:var(--ic-nav); }

.app-main{ flex:1; width:100%; max-width:760px; margin:0 auto; padding:16px; }
.tab-pane{ animation:tabIn .3s var(--bez); }
@keyframes tabIn{ from{ opacity:0; transform:translateY(10px); } to{ opacity:1; transform:none; } }
.section-head{ display:flex; align-items:center; justify-content:space-between; gap:.6rem; margin-bottom:1rem; min-height:44px; }
.section-head h2{ font-size:var(--fs-18); font-weight:var(--fw-bold); margin:0; display:inline-flex; align-items:center; gap:.45rem; }
.section-head h2 i{ color:var(--gold-d); }
.stack{ display:flex; flex-direction:column; gap:.9rem; }

/* ============ کارت صاحب حساب / واریز‌کننده ============ */
.owner-card{ background:var(--card); border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow); overflow:hidden; transition:box-shadow var(--fast), border-color var(--fast); }
.owner-card.open{ border-color:#dcdde0; box-shadow:0 4px 22px rgba(16,18,29,.09); }
.owner-top{ display:flex; align-items:center; gap:.8rem; padding:12px; cursor:pointer; user-select:none; }
.owner-id{ flex:1; min-width:0; display:flex; align-items:center; gap:.7rem; }
.owner-avatar-ring{ flex-shrink:0; width:44px; height:44px; border-radius:13px; padding:2px; box-sizing:border-box; display:flex; align-items:center; justify-content:center; background:var(--line-2); transition:background .5s var(--bez); }
.owner-avatar{ width:100%; height:100%; flex-shrink:0; border-radius:10px; background:var(--gold-soft); color:var(--gold-d); display:flex; align-items:center; justify-content:center; font-size:1.1rem; }
.owner-avatar-ring > .owner-avatar{ border-radius:10px; }
.owner-id-txt{ min-width:0; flex:1; }
.owner-name{ font-weight:var(--fw-semibold); font-size:var(--fs-15); line-height:1.35; word-break:break-word; }
.owner-sub{ color:var(--muted); font-size:var(--fs-13); margin-top:.15rem; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; word-break:break-word; }
.owner-amount{ margin-inline-start:auto; text-align:end; flex-shrink:0; }
.oa-val{ font-weight:var(--fw-bold); font-size:var(--fs-md); letter-spacing:1px; }
.oa-lbl{ color:var(--muted); font-size:0.8125rem; margin-top:.1rem; }
.chev-wrap{ flex-shrink:0; width:24px; display:flex; align-items:center; justify-content:center; color:var(--muted); }
.chev{ transition:transform var(--fast) var(--bez); font-size:1.1rem; }
.owner-card.open .chev{ transform:rotate(180deg); }
.flag-over{ display:inline-flex; align-items:center; gap:.2rem; color:var(--red); font-size:0.8125rem; background:var(--red-soft); padding:.05rem .4rem; border-radius:7px; vertical-align:middle; }
.flag-over.sm{ padding:.05rem .25rem; }

/* نوار پیشرفت (پر شدن ��وسط JS) */
.prog-bar{ height:6px; background:var(--line-2); margin:0 1rem .9rem; border-radius:99px; overflow:hidden; }
.prog-bar.lg{ height:10px; margin:1rem 0; }
.bar-fill{ height:100%; width:0; border-radius:99px; background:var(--gold); transition:width .5s var(--bez); }

.owner-body{ display:none; padding:0 1rem 1rem; }

/* استایل فشردهٔ برچسب‌دار (جایگزین نمایش A / B) */
.mini-stats{ display:flex; flex-wrap:wrap; gap:.5rem; background:var(--bg-soft); border-radius:var(--radius-sm); padding:.6rem .7rem; }
.ms-i{ flex:1 1 0; min-width:74px; display:flex; flex-direction:column; gap:.18rem; }
.ms-l{ color:var(--muted); font-size:0.8125rem; }
.ms-i b{ font-size:.9rem; }

/* لیست شباها (داخل کارت صاحب حساب) */
.sheba-list{ display:flex; flex-direction:column; gap:.7rem; }
.sheba-item{ background:var(--bg-soft); border:1px solid var(--line); border-radius:var(--radius-sm); padding:.7rem .8rem; }
.sheba-head{ display:flex; align-items:center; justify-content:space-between; gap:.5rem; margin-bottom:.55rem; }
.sheba-name{ font-size:var(--fs-sm); word-break:break-word; }
.receipt-empty{ color:var(--muted); font-size:0.8125rem; text-align:center; padding:.5rem; margin-top:.55rem; }
.receipt-lines{ display:flex; flex-direction:column; gap:.3rem; margin-top:.55rem; }
.rl-name{ color:var(--ink-2); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; min-width:0; }
.rl-right{ display:inline-flex; align-items:center; gap:.4rem; flex-shrink:0; }
.rl-amt{ font-weight:700; }
.trk-chip{ display:inline-flex; align-items:center; gap:.25rem; background:var(--blue-soft); color:var(--blue); font-size:0.8125rem; padding:.1rem .45rem; border-radius:7px; font-weight:600; }
.mini-empty{ display:flex; align-items:center; justify-content:center; gap:.4rem; color:var(--muted); font-size:var(--fs-13); text-align:center; padding:1rem .8rem; background:transparent; border:1px dashed var(--line); border-radius:var(--radius-sm); }
.owner-actions{ display:flex; gap:.6rem; margin-top:.9rem; flex-wrap:wrap; }
.owner-actions .btn{ flex:1; }

/* ============ لیست شباهای واریز‌کننده ============ */
.buyer-receipt-form{ background:var(--gold-soft); border:1px solid #f4e6b5; border-radius:var(--radius-sm); padding:.8rem; margin-bottom:.9rem; }
.brf-title{ font-weight:700; font-size:0.875rem; margin-bottom:.6rem; display:flex; align-items:center; gap:.35rem; }
.brf-title i{ color:var(--gold-d); }
.brf-row{ display:grid; grid-template-columns:1fr 1fr; gap:.6rem; margin-bottom:.6rem; }
.brf-sheba{ margin-bottom:.6rem; }
.btn.brf-submit{ background:var(--ink); color:#fff; border:1px solid var(--ink); box-shadow:0 2px 10px rgba(13,13,13,.16); }
.btn.brf-submit:hover{ background:#000; color:#fff; border-color:#000; filter:none; transform:translateY(-2px); box-shadow:0 9px 24px rgba(13,13,13,.32); }
.btn.brf-submit:active{ background:#000; color:#fff; transform:translateY(0) scale(.98); }
.btn.brf-submit .label i{ color:#fff; }

.bsheba-list{ display:flex; flex-direction:column; gap:.7rem; }
.bsheba-item{ background:var(--bg-soft); border:1px solid var(--line); border-radius:var(--radius-sm); padding:.7rem .8rem; }
.bsi-head{ display:flex; align-items:center; gap:.5rem; cursor:pointer; margin-bottom:.55rem; }
.bsi-owner{ flex:1; min-width:0; font-size:.88rem; display:flex; align-items:center; gap:.35rem; flex-wrap:wrap; }
.bsi-owner b{ font-weight:700; word-break:break-word; }
.bsi-sheba{ color:var(--muted); font-size:var(--fs-13); word-break:break-word; }
.co-dot{ color:var(--muted); }
.bsi-actions{ display:flex; align-items:center; gap:.2rem; flex-shrink:0; }
.bsi-chev{ color:var(--muted); transition:transform var(--fast) var(--bez); }
.bsheba-item.open .bsi-chev{ transform:rotate(180deg); }

/* منوی کبابی */
.kebab{ position:relative; }
.kebab-btn{ background:transparent; border:none; width:28px; height:28px; min-width:34px; min-height:34px; border-radius:8px; color:var(--muted); cursor:pointer; display:flex; align-items:center; justify-content:center; font-size:1.1rem; transition:background var(--fast),color var(--fast); }
.kebab-btn:hover{ background:var(--card); color:var(--ink); }
.kebab-menu{ position:absolute; top:calc(100% + 4px); inset-inline-end:0; min-width:172px; background:var(--card); border:1px solid var(--line); border-radius:var(--radius-sm); box-shadow:var(--shadow-lg); padding:.3rem; z-index:4000; display:none; }
.kebab-menu.show{ display:block; animation:pop .14s var(--bez); }
.kebab-menu button{ display:flex; align-items:center; gap:.5rem; width:100%; background:none; border:none; text-align:start; padding:.5rem .6rem; border-radius:8px; font-size:0.875rem; color:var(--ink); cursor:pointer; white-space:nowrap; }
.kebab-menu button:hover{ background:var(--bg-soft); }
.kebab-menu .km-del{ color:var(--red); }

/* ویرایش مبلغ درون‌خطی */
.bsi-edit{ margin-top:.6rem; display:flex; flex-direction:column; gap:.5rem; background:var(--card); border:1px solid var(--line); border-radius:var(--radius-sm); padding:.6rem; }
.bsi-edit-actions{ display:flex; gap:.5rem; justify-content:flex-end; }
.bsi-receipts{ display:grid; grid-template-rows:0fr; transition:grid-template-rows .26s var(--bez); }
.bsi-receipts-inner{ min-height:0; overflow:hidden; display:flex; flex-direction:column; gap:.3rem; padding-top:.4rem; }
.bsheba-item.open .bsi-receipts{ grid-template-rows:1fr; }

/* ============ ردیف شبا در مودال‌ها ============ */
.group-head{ display:flex; align-items:center; justify-content:space-between; margin:.4rem 0 .7rem; font-weight:600; font-size:0.875rem; color:var(--ink-2); }
.sheba-row{ background:var(--bg-soft); border:1px solid var(--line); border-radius:var(--radius-sm); padding:.7rem; display:flex; flex-direction:column; gap:.55rem; margin-bottom:.7rem; transition:opacity var(--fast),transform var(--fast); }
.sheba-row.removing{ opacity:0; transform:translateY(-6px); }
.sr-line{ display:flex; align-items:center; gap:.55rem; }
.sr-line .form-control{ flex:1; }
.btn-remove-sheba{ flex-shrink:0; width:40px; height:40px; border-radius:11px; border:1px solid var(--line); background:var(--card); color:var(--red); cursor:pointer; display:flex; align-items:center; justify-content:center; font-size:1.05rem; transition:background var(--fast); }
.btn-remove-sheba:hover{ background:var(--red-soft); }

/* ============ کمبوی انتخاب شبا ============ */
.combo-field{ position:relative; }
.combo-list{ width:100%; max-height:min(320px,60vh); overflow-y:auto; box-shadow:0 14px 36px rgba(0,0,0,.18); }
.combo-opt{ padding:.55rem .65rem; border-radius:9px; cursor:pointer; transition:background var(--fast); }
.combo-opt:hover{ background:var(--gold-soft); }
.co-main{ display:flex; align-items:center; gap:.35rem; font-size:0.875rem; flex-wrap:wrap; }
.co-owner{ font-weight:700; word-break:break-word; }
.co-sheba{ color:var(--muted); direction:ltr; word-break:break-all; }
.co-sub{ margin-top:.2rem; font-size:0.8125rem; }
.co-rem{ color:var(--ink-2); }

/* ============ اطلاعات کامل حساب ============ */
.detail-head{ margin-bottom:1rem; }
.dh-name{ font-weight:var(--fw-bold); font-size:var(--fs-md); display:flex; align-items:center; gap:.5rem; flex-wrap:wrap; word-break:break-word; margin-bottom:.7rem; }
.dh-stats{ display:grid; grid-template-columns:repeat(3,1fr); gap:.6rem; }
.dh-card span{ display:block; font-size:0.8125rem; color:var(--muted); margin-bottom:.25rem; }
.dh-card{
  border-radius:var(--radius-sm);
  padding:.7rem;
  text-align:center;
  background:var(--bg-soft);
  border:1px solid var(--line);
}
.dh-card.c-gold,.dh-card.c-green,.dh-card.c-amber{ background:var(--bg-soft); }
.dh-card b{
  font-size:0.95rem;
  color:var(--ink);
}
.ds-head{ display:flex; align-items:center; justify-content:space-between; gap:.5rem; margin-bottom:.55rem; }
.ds-name{ font-weight:var(--fw-bold); font-size:var(--fs-sm); word-break:break-word; }
.ds-add{ margin-top:.7rem; }
.dep-top{ margin-bottom:.5rem; }
.dep-name{ font-weight:700; font-size:.88rem; word-break:break-word; }
.dep-receipts{ display:flex; flex-wrap:wrap; gap:.4rem; margin-top:.6rem; }
.dep-receipts.empty{ color:var(--muted); font-size:0.8125rem; }
.rchip{ display:inline-flex; align-items:center; gap:.3rem; background:var(--bg-soft); border:1px solid var(--line); border-radius:9px; padding:.28rem .5rem; font-size:0.8125rem; }
.rc-n{ color:var(--muted); }
.rchip small{ color:var(--muted); }

/* ============ خلاصه روز ============ */
.sum-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:.8rem; }
.sum-grid.sm{ grid-template-columns:repeat(4,1fr); margin-top:.5rem; }
.sum-card{ border-radius:var(--radius); padding:12px; text-align:center; border:1px solid var(--line); background:var(--card); box-shadow:var(--shadow); }
.sum-card i{ font-size:20px; }
.sum-card .sv{ font-weight:var(--fw-bold); font-size:var(--fs-18); margin:.4rem 0 .15rem; }
.sum-card .st{ color:var(--muted); font-size:0.8125rem; }
.sum-card.c-blue i{ color:var(--blue); } .sum-card.c-green i{ color:var(--green); } .sum-card.c-amber i{ color:var(--amber); } .sum-card.c-gold i{ color:var(--gold-d); }
.sum-mini{ background:var(--bg-soft); border-radius:var(--radius-sm); padding:.6rem .4rem; text-align:center; }
.sum-mini i{ color:var(--gold-d); font-size:1.1rem; }
.sum-mini b{ display:block; font-size:.95rem; margin:.2rem 0 .05rem; }
.sum-mini span{ color:var(--muted); font-size:0.8125rem; }

/* ============ افراد ============ */
.person-grid{ display:flex; flex-wrap:wrap; gap:.6rem; }
.person-chip{ background:var(--card); border:1px solid var(--line); border-radius:99px; padding:.5rem .9rem; font-size:.86rem; font-weight:600; display:inline-flex; align-items:center; gap:.4rem; box-shadow:var(--shadow); }
.person-chip i{ color:var(--gold-d); }

/* ============ ناوبری پایین ============ */
.bottom-nav{ position:fixed; bottom:0; left:0; right:0; z-index:20; background:rgba(255,255,255,.96); backdrop-filter:blur(12px); border-top:1px solid var(--line); display:flex; padding:.35rem .3rem calc(.35rem + env(safe-area-inset-bottom)); }
.nav-item.active{ color:var(--gold-d); }
.modal.show{ display:block; }
.modal-backdrop{ position:fixed; inset:0; background:rgba(16,18,29,.45); z-index:1040; }
.modal-backdrop.show{ opacity:1; }
.modal-dialog{ position:relative; z-index:1051; margin:1.2rem auto; max-width:480px; width:calc(100% - 2rem); }
.modal-dialog.modal-sm{ max-width:340px; } .modal-dialog.modal-lg{ max-width:680px; }
.modal-header{ display:flex; align-items:center; justify-content:space-between; gap:.5rem; padding:10px 14px; border-bottom:1px solid var(--line-2); }
.modal-title{ font-size:var(--fs-16); font-weight:var(--fw-bold); margin:0; }
.modal-footer .btn{ flex:1; }
.alloc-acc-info{ background:var(--gold-soft); border-radius:var(--radius-sm); padding:.6rem .8rem; font-size:0.875rem; }
/* انیمیشن دسکتاپ */
.modal.fade .modal-dialog{ transition:transform .24s var(--bez), opacity .24s; transform:translateY(-16px); opacity:0; }
.modal.show .modal-dialog{ transform:none; opacity:1; }

/* ============ اتوکامپلیت / لیست شناور ============ */
.ac-field{ position:relative; }
.ac-list{ position:absolute; top:calc(100% + 4px); inset-inline:0; background:var(--card); border:1px solid var(--line); border-radius:var(--radius-sm); box-shadow:var(--shadow-lg); padding:.3rem; z-index:50; display:none; max-height:240px; overflow-y:auto; }
.ac-list.show{ display:block; animation:pop .14s var(--bez); }
.ac-opt,.ac-new{ display:flex; align-items:center; gap:.45rem; padding:.55rem .65rem; border-radius:9px; cursor:pointer; font-size:0.875rem; }
.ac-opt:hover,.ac-new:hover{ background:var(--gold-soft); }
.ac-opt i{ color:var(--muted); }
.ac-new{ color:var(--gold-d); font-weight:600; }

/* ============ تقویم ============ */
.jc-head{ display:flex; align-items:center; justify-content:space-between; margin-bottom:.7rem; font-weight:700; }
.jc-nav{ background:var(--bg-soft); border:1px solid var(--line); width:34px; height:34px; border-radius:10px; cursor:pointer; color:var(--ink-2); }
.jc-grid{ display:grid; grid-template-columns:repeat(7,1fr); gap:.25rem; }
.jc-dow{ text-align:center; font-size:0.8125rem; color:var(--muted); padding:.3rem 0; font-weight:600; }
.jc-day{ aspect-ratio:1; border:none; background:var(--bg-soft); border-radius:10px; cursor:pointer; font-size:0.875rem; font-family:inherit; color:var(--ink); transition:background var(--fast); }
.jc-day:hover{ background:var(--gold-soft); }
.jc-day.today{ border:1.5px solid var(--gold); }
.jc-day.sel{ background:var(--gold-grad); color:var(--on-gold); font-weight:700; }

/* ============ Toast ============ */
.toast-host{ position:fixed; bottom:84px; left:0; right:0; z-index:1100; display:flex; flex-direction:column; align-items:center; gap:.5rem; pointer-events:none; padding:0 1rem; }
.toast-item.show{ opacity:1; transform:none; }
.toast-item.success i{ color:#4ade80; }
.toast-item.error i{ color:#fb7185; }
.toast-item.warn i{ color:#fbbf24; }
.empty-state i{ font-size:2.6rem; opacity:.5; }
.empty-state p{ margin:.7rem 0 0; font-size:.88rem; }
.loader{ display:flex; align-items:center; justify-content:center; padding:2.5rem; color:var(--gold-d); }
.loader.sm{ padding:1rem; }
/* لودینگ: لوگو حین چرخش پر و خالی می‌شود (مینیمال، مبتنی بر تغییر رنگ) */
.fb-spin{ position:relative; width:42px; height:42px; -webkit-mask:url("assets/logomark-loader.svg") center/contain no-repeat; mask:url("assets/logomark-loader.svg") center/contain no-repeat; background:var(--gold-d); animation:fbTurn 2.8s ease-in-out infinite; }
.fb-spin::after{ content:""; position:absolute; inset:0; top:auto; height:0; background:var(--gold); animation:fbFill 1.5s ease-in-out infinite; }
.loader.sm .fb-spin{ width:30px; height:30px; }
@keyframes fbTurn{ 0%,10%{ transform:rotate(0deg); } 30%,43%{ transform:rotate(120deg); } 63%,76%{ transform:rotate(240deg); } 96%,100%{ transform:rotate(360deg); } }
@keyframes fbFill{ 0%{ height:0; } 50%{ height:100%; } 100%{ height:0; } }

/* ============ انیمیشن ============ */
@keyframes fadein{ from{ opacity:0; transform:translateY(6px); } to{ opacity:1; transform:none; } }
@keyframes pop{ from{ opacity:0; transform:scale(.96); } to{ opacity:1; transform:none; } }
.fade-in{ animation:fadein .26s var(--bez); }

/* ============ مدیریت (admin.php) ============ */
.admin-wrap{ max-width:900px; margin:0 auto; padding:1.2rem 1rem 3rem; }
.admin-stat{ background:var(--card); border:1px solid var(--line); border-radius:var(--radius); padding:1rem; box-shadow:var(--shadow); text-align:center; }
.admin-stat b{ display:block; font-size:1.4rem; }
.admin-stat span{ color:var(--muted); font-size:0.8125rem; }
.user-row{ background:var(--card); border:1px solid var(--line); border-radius:var(--radius); padding:.9rem 1rem; display:flex; align-items:center; justify-content:space-between; gap:.7rem; box-shadow:var(--shadow); margin-bottom:.7rem; }
.u-info{ min-width:0; }
.u-info b{ word-break:break-word; }
.u-actions{ display:flex; gap:.5rem; flex-shrink:0; }
.badge-role{ font-size:0.8125rem; padding:.18rem .5rem; border-radius:7px; font-weight:600; }
.badge-admin{ background:var(--gold-soft); color:var(--gold-d); }
.badge-user{ background:var(--blue-soft); color:var(--blue); }
.badge-off{ background:var(--red-soft); color:var(--red); }

/* ============ ریسپانسیو ============ */
@media (min-width:768px){
  .sum-grid{ grid-template-columns:repeat(4,1fr); }
}

/* در حالت‌های غیرموبایل، هدر و ناوبری پایین هم‌عرض با app-main (حداکثر ۷۶۰ پیکسل و وسط‌چین) می‌شوند */
@media (min-width:621px){
  .app-header{ width:100%; max-width:760px; margin-left:auto; margin-right:auto; }
  .bottom-nav{ max-width:760px; margin-left:auto; margin-right:auto; }
  /* صفحهٔ اطلاعات کامل حساب (drill): هدر و نوار پایین هم‌عرض با محتوای drill-page */
  .drill-topbar{ width:100%; max-width:760px; margin-left:auto; margin-right:auto; }
  .drill-footer{ width:100%; max-width:760px; margin-left:auto; margin-right:auto; }
}

@media (max-width:620px){
  .app-main{ padding:12px; }
  .stack{ gap:12px; }
  .owner-top{ padding:12px; gap:.6rem; }
  .owner-avatar-ring{ width:40px; height:40px; border-radius:12px; }
  .owner-avatar{ font-size:1rem; }
  .oa-val{ font-size:.95rem; }
  .brf-row{ grid-template-columns:1fr; }
  .dh-stats{ gap:.45rem; }
  .dh-card{ padding:.55rem .4rem; }
  .dh-card b{ font-size:0.95rem; }
  .sum-grid.sm{ grid-template-columns:repeat(2,1fr); }
  .day-pill{ max-width:none; }

  /* مودال‌ها به سبک باتم‌شیت، چسبیده به کف صفحه */
  .modal{ padding:0 !important; }
  .modal-dialog.modal-sheet{ position:fixed !important; left:0 !important; right:0 !important; bottom:0 !important; top:auto !important; margin:0 !important; width:100% !important; max-width:100% !important; min-height:0 !important; display:block !important; }
  .modal-sheet .modal-content{ border-radius:20px 20px 0 0; max-height:90vh; padding-bottom:env(safe-area-inset-bottom); }
  .modal-sheet .modal-content::before{ content:""; display:block; width:42px; height:4px; border-radius:99px; background:var(--line); margin:.55rem auto -.2rem; flex-shrink:0; }
  .modal.fade .modal-dialog.modal-sheet{ transform:translateY(100%); opacity:1; transition:transform .3s var(--bez); }
  .modal.show .modal-dialog.modal-sheet{ transform:none; }
  .owner-actions .btn-destructive.btn-icon{ flex:0 0 auto; }
}

/* ============ اف��وده‌های نسخه جدید ============ */
/* وضعیت کلی صاحب حساب (هنگام باز کردن کارت) */
.owner-stats{ display:grid; grid-template-columns:repeat(4,1fr); gap:.5rem; background:var(--gold-soft); border-radius:var(--radius-sm); padding:.7rem .6rem; margin-bottom:.85rem; }
.os-i{ display:flex; flex-direction:column; gap:.18rem; min-width:0; }
.os-l{ color:var(--gold-d); font-size:0.8125rem; }
.os-i b{ font-size:.9rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
@media (max-width:620px){ .owner-stats{ grid-template-columns:repeat(2,1fr); } }

/* سربرگ بخش */
.section-sub{ display:flex; align-items:center; gap:.4rem; font-weight:700; color:var(--ink-2); margin:1.2rem .2rem .65rem; }
.section-sub i{ color:var(--gold-d); }

/* بدهکار/بستانکار */
.bal-wrap{ display:grid; grid-template-columns:1fr; gap:.85rem; }
@media (min-width:768px){ .bal-wrap{ grid-template-columns:1fr 1fr; align-items:start; } }
.bal-card{ background:var(--card); border:1px solid var(--line); border-radius:var(--radius); padding:.5rem; }
.bal-card-h{ display:flex; align-items:center; justify-content:space-between; gap:.5rem; font-weight:700; padding:.55rem .6rem .65rem; border-bottom:1px solid var(--line-2); margin-bottom:.25rem; }
.bal-card-h span{ display:flex; align-items:center; gap:.4rem; }
.bal-item{ border-radius:var(--radius-sm); overflow:hidden; }
.bal-row{ display:flex; align-items:center; gap:.5rem; padding:.6rem .55rem; cursor:pointer; border-radius:var(--radius-sm); }
.bal-row:hover{ background:var(--bg-soft); }
.bal-name{ flex:1; min-width:0; font-weight:600; word-break:break-word; }
.bal-amt{ font-weight:700; white-space:nowrap; }
.bal-chev{ color:var(--muted); transition:transform .2s var(--bez); }
.bal-item.open .bal-chev{ transform:rotate(180deg); }
.bal-detail{ display:none; padding:.1rem .35rem .5rem; }
.bal-line{ display:flex; align-items:center; justify-content:space-between; gap:.6rem; padding:.42rem .5rem; border-top:1px dashed var(--line-2); font-size:0.875rem; }
.bal-line span{ color:var(--ink-2); min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.bal-line b{ white-space:nowrap; }

.t-red{ color:var(--red); }
.t-green{ color:var(--green); }
.t-muted{ color:var(--muted); }

/* لیست اف��اد */
.person-list{ display:flex; flex-direction:column; gap:.6rem; }
.person-row{ background:var(--card); border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; }
.pr-head{ display:flex; align-items:center; gap:.55rem; padding:.75rem .8rem; cursor:pointer; }
.pr-head:hover{ background:var(--bg-soft); }
.pr-id{ display:flex; align-items:center; gap:.6rem; flex:1; min-width:0; }
.pr-avatar{ width:38px; height:38px; flex-shrink:0; display:grid; place-items:center; border-radius:11px; background:var(--gold-soft); color:var(--gold-d); font-size:1.25rem; }
.pr-txt{ min-width:0; flex:1; }
.pr-name{ font-weight:700; word-break:break-word; }
.pr-tags{ display:flex; flex-wrap:wrap; gap:.35rem; margin-top:.28rem; }
.pr-tag{ font-size:0.8125rem; font-weight:700; padding:.14rem .5rem; border-radius:99px; white-space:nowrap; }
.pr-tag.t-red{ background:var(--red-soft); color:var(--red); }
.pr-tag.t-green{ background:var(--green-soft); color:var(--green); }
.pr-tag.t-muted{ background:var(--line-2); color:var(--muted); }
.person-row .bsi-chev{ color:var(--muted); transition:transform .2s var(--bez); flex-shrink:0; }
.person-row.open .bsi-chev{ transform:rotate(180deg); }
.pr-detail{ display:none; padding:.1rem .8rem .8rem; }
.pr-block{ margin-top:.55rem; }
.pr-block-h{ display:flex; align-items:center; gap:.4rem; font-weight:700; font-size:0.875rem; margin-bottom:.25rem; }

/* آیکون بدون فیش */
.receipt-empty i, .dep-receipts.empty i{ margin-inline-end:.25rem; color:var(--muted); }

/* ===================== به‌روزرسانی: وضعیت فیش، کبابی، حسابدار ===================== */
.receipt-line{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.5rem;
  background:var(--card);
  border:1px solid var(--line);
  border-radius:9px;
  padding:.42rem .6rem;
  font-size:0.875rem;
  position:relative;
}
.receipt-line .rl-left{ display:flex; align-items:center; gap:.4rem; min-width:0; flex:1 1 auto; }
.receipt-line .rl-name{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.rl-st{ font-size:1rem; flex:0 0 auto; }
.rl-owner-tag{ display:inline-flex; align-items:center; gap:.25rem; flex:0 1 auto; min-width:0; max-width:60%; padding:2px .5rem; border-radius:999px; background:var(--bg-soft); color:var(--muted); font-size:var(--fs-xs); font-weight:var(--fw-medium); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.rl-owner-tag i{ flex:0 0 auto; font-size:.95em; }
/* تگ صاحب فیش با تم وضعیت همان فیش هماهنگ می‌شود (ملایم/خاکستری در حالت عادی، چیپ سفیدِ نیمه‌شفاف با متن هم‌رنگ وضعیت روی فیش‌های رنگی) */
.receipt-line.r-acc .rl-owner-tag{ background:rgba(255,255,255,.72); color:var(--green); }
.receipt-line.r-flag .rl-owner-tag,
.receipt-line.r-acc-flag .rl-owner-tag{ background:rgba(255,255,255,.72); color:var(--amber); }
/* متن توضیحی مودال خروجی PDF */
.pdf-opt-intro{ margin:0 0 .85rem; font-size:var(--fs-sm); color:var(--muted); line-height:1.7; }
.rl-st.ra{ color:var(--green); }
.rl-st.rf{ color:var(--amber); }
.rl-flag-ic{ cursor:pointer; transition:transform var(--fast); }
.rl-flag-ic:hover{ transform:scale(1.15); }
.receipt-line.r-acc{ background:var(--green-soft); border-color:#bfe6d2; }
.receipt-line.r-flag{ background:var(--amber-soft); border-color:#f3d79a; }
.receipt-line.r-acc-flag{
  background:repeating-linear-gradient(45deg, var(--green-soft) 0 10px, var(--amber-soft) 10px 20px);
  border-color:#e8d39a;
}
.rl-kebab{ flex:0 0 auto; }
.rl-kebab .kebab-btn{ width:26px; height:26px; }
.rl-kebab .kebab-menu{ top:auto; bottom:calc(100% + 6px); inset-inline-start:0; inset-inline-end:auto; }
.kebab-open{ overflow:visible !important; }
.acc-check:focus{ outline:none; box-shadow:0 0 0 3px var(--gold-soft); border-color:var(--gold); }
.acc-check:focus-visible{ outline:none; box-shadow:0 0 0 3px var(--gold-soft); border-color:var(--gold); }
.acc-info .trk-chip{ align-self:flex-start; }

/* خلاصه: فیش بر اساس وضعیت */
.rs-wrap{ display:flex; flex-direction:column; gap:.6rem; }
.rs-card{ border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; background:var(--card); }
.rs-head{ display:flex; justify-content:space-between; align-items:center; gap:.5rem; padding:.55rem .7rem; font-weight:600; font-size:0.875rem; }
.rs-head b{ font-size:0.8125rem; font-weight:700; }
.rs-card.rs-flag .rs-head{ background:var(--amber-soft); color:var(--amber); }
.rs-card.rs-acc .rs-head{ background:var(--green-soft); color:var(--green); }
.rs-card.rs-normal .rs-head{ background:var(--bg-soft); color:var(--ink-2); }
.rs-items{ display:flex; flex-direction:column; }
.rs-i-name{ color:var(--ink-2); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.rs-item b{ flex:0 0 auto; }

/* خلاصه: لیست فیش‌های مورد دار */
.flagged-list{ display:flex; flex-direction:column; gap:.5rem; }
.flagged-item{ border:1px solid #f3d79a; background:var(--amber-soft); border-radius:var(--radius); padding:.55rem .7rem; cursor:pointer; transition:filter var(--fast); }
.flagged-item:hover{ filter:brightness(.97); }
.fl-top{ display:flex; justify-content:space-between; align-items:center; gap:.5rem; font-size:0.875rem; font-weight:600; color:var(--amber); }
.fl-top b{ flex:0 0 auto; color:var(--ink); }
.fl-name{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; display:flex; align-items:center; gap:.3rem; min-width:0; }
.fl-note{ margin-top:.3rem; font-size:0.8125rem; color:var(--ink-2); line-height:1.7; white-space:pre-wrap; word-break:break-word; }
.fl-note-empty{ color:var(--muted); }

/* کارت زبرا: تینت طلایی به‌جای خاکستری */
.owner-card.zebra-alt{
  background:#fffdfa;
  border-color:#f3e8c6;
}

/* تمایز mini-stats داخل detail-sheba */
.detail-sheba .mini-stats{ background:var(--card); border:1px solid var(--line); }

/* پاپ‌آپ تأیید */
.confirm-msg{ margin:0; font-size:.92rem; color:var(--ink-2); line-height:1.8; }
.btn-destructive{ background:var(--red); border:none; color:var(--card); --bs-btn-hover-bg:var(--red); --bs-btn-hover-color:var(--card); --bs-btn-hover-border-color:transparent; --bs-btn-active-bg:var(--red); --bs-btn-active-color:var(--card); }
.btn.btn-destructive:hover,.btn.btn-destructive:focus,.btn.btn-destructive:active{ background:var(--red)!important; color:var(--card)!important; border-color:transparent; filter:brightness(.93); }

/* تاریخ سریع: وسط‌چین، بدون سال */
.hdr-day{
  flex:0 1 auto;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:.3rem;
  min-width:0;
}
#dayPill{ justify-content:center; text-align:center; }
#dayLabel{ text-align:center; }
.jcal-full{ display:flex; align-items:center; justify-content:center; gap:.5rem; background:var(--gold-soft); border-radius:var(--radius-sm); padding:.5rem; margin-bottom:.6rem; }
.jcal-full .jcf-lbl{ font-size:var(--fs-12); font-weight:var(--fw-semibold); color:var(--gold-d); background:rgba(255,255,255,.6); border-radius:99px; padding:.12rem .55rem; flex:0 0 auto; }
.jcal-full .jcf-val{ font-weight:700; color:var(--ink); font-size:var(--fs-sm); }
/* ============ باتم‌شیت: کشیدن برای بستن ============ */
@media (max-width:620px){
  .modal-dialog.modal-sheet.sheet-dragging{ transition:none !important; will-change:transform; }
  .modal-sheet .modal-content::before{ cursor:grab; }
}

/* ============ اصلاح اسکرول پاپ‌آپ‌ها (راهکار عمومی) ============ */
/* لایهٔ اطمینان: اگر به هر دلیل محتوا بزرگ‌تر شد، خود مودال هم اسکرول می‌خورد */
.modal{
  position:fixed;
  inset:0;
  z-index:1050;
  display:none;
  overflow:hidden;
  overflow-y:auto;
  overflow-x:hidden;
  -webkit-overflow-scrolling:touch;
}
.modal-header, .modal-footer{ flex-shrink:0; }
/* ارتفاع محتوا با کسر حاشیه‌های بالا/پایین دیالوگ (۱.۲rem×۲) محاسبه می‌شود
   تا فوتر (دکمهٔ بستن/ذخیره) هیچ‌وقت از کادر دید بیرون نزند */
.modal-content{
  background:var(--card);
  border-radius:16px;
  box-shadow:var(--shadow-lg);
  display:flex;
  flex-direction:column;
  max-height:calc(100dvh - 2.4rem);
  overflow:hidden;
}
.modal-body{
  padding:14px;
  overflow-y:auto;
  flex:1 1 auto;
  min-height:0;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
}
/* فوتر ثابت در پایین همهٔ مودال‌ها (مورد ۶: دکمهٔ بستن همیشه در دسترس) */
.modal-footer{
  display:flex;
  gap:.6rem;
  padding:10px 14px;
  border-top:1px solid var(--line-2);
  position:sticky;
  bottom:0;
  background:var(--card);
  z-index:2;
}
@media (max-width:620px){
  /* در حالت باتم‌شیت حاشیه‌ای نیست، ����س کل ارتفاع در دسترس است */
  .modal-sheet .modal-content{ max-height:92vh; max-height:92dvh; }
}

/* دکمهٔ آیکونی فشرده (حذف) */
.owner-actions .btn-icon{ flex:0 0 auto; width:44px; padding-inline:0; }

/* دکمهٔ اطلاعات بیشتر (متمایز از دکمهٔ طلایی «افزودن فیش») */
/* بوردر هنگام Hover با رنگ متن (آبی) هماهنگ؛ پس‌زمینه مشتق از همان رنگ پایه */

/* دکمهٔ مشاهده همه + مودال تمام‌قد لیست فیش‌ها */
.rs-more{ width:100%; border:none; background:var(--bg-soft); color:var(--ink-2); font-family:inherit; font-weight:600; font-size:0.875rem; padding:.55rem; cursor:pointer; border-top:1px solid var(--line-2); display:flex; align-items:center; justify-content:center; gap:.35rem; transition:background var(--fast); }
.rs-more:hover{ background:#eceef0; }
.rs-more i{ color:var(--gold-d); }
.rs-items-full .rs-item:first-child{ border-top:none; }
.modal-tall .modal-content{ height:90vh; height:90dvh; max-height:90vh; max-height:90dvh; }

/* ============ دکمهٔ نمایش تدریجی فیش‌ها (مورد ۳ و ۷) ============ */
.rl-more{ width:100%; border:1px dashed var(--line); background:var(--bg-soft); color:var(--ink-2); font-family:inherit; font-weight:600; font-size:0.875rem; padding:.5rem; margin-top:.4rem; border-radius:10px; cursor:pointer; display:flex; align-items:center; justify-content:center; gap:.35rem; transition:background var(--fast); }
.rl-more:hover{ background:#eceef0; }
.rl-more i{ color:var(--gold-d); }

/* ============ الگوی مشترک لودینگ دکمه‌ها (مورد ۵) ============ */
.btn .btn-ic-hidden{ display:none !important; }

/* ============ ساختار درختی صفحهٔ اطلاعات بیشتر (مورد ۷) ============ */
/* والد (شبا) با لبهٔ طلایی مشخص می‌شود */
.detail-sheba{
  background:var(--bg-soft);
  border:1px solid var(--line);
  border-radius:var(--radius-sm);
  padding:.8rem;
  margin-top:.9rem;
  border-inline-start:3px solid var(--gold);
}
.dep-list .depositor{ margin-top:0; }
@media (min-width:768px){ .modal-tall .modal-content{ height:80vh; } }

/* ============ رفع اسکرول مودال‌های دارای فرم (مدیریت شبا و …) ============ */
.modal-content > form{ display:flex; flex-direction:column; flex:1 1 auto; min-height:0; overflow:hidden; }

/* فاصله بین فیش‌های بازشده با دکمهٔ «مشاهده بیشتر» */
.rl-extra-wrap .receipt-line + .receipt-line{ margin-top:.3rem; }

/* ============ دکمه و خروجی PDF ============ */
.section-sub.has-dl{ display:flex; align-items:center; }
.pdf-dl{ margin-inline-start:auto; background:var(--gold-soft); color:var(--gold-d); border:1px solid #f0d98a; border-radius:9px; font-family:inherit; font-weight:700; font-size:0.875rem; padding:.32rem .62rem; cursor:pointer; display:inline-flex; align-items:center; gap:.32rem; transition:background var(--fast); }
.pdf-dl:hover{ background:#ffefb8; }
.pdf-dl .spinner-border{ width:.85rem; height:.85rem; border-width:.15em; }
.kebab-menu .pkm-pdf{ color:var(--gold-d); }

/* قفل خروجی PDF روی تم روشن: زیردرخت سند همیشه با توکن‌های روشن رندر می‌شود */
.pdf-stage, .pdf-doc{
  --bg:#ffffff; --bg-soft:#f5f6f7; --card:#ffffff; --ink:#0d0d0d; --ink-2:#3a3d44; --muted:#5f6166;
  --line:#e8e8ea; --line-2:#f1f1f3; --gold:#FDC92C; --gold-d:#8a6a00; --gold-soft:#fff6d8;
  --green:#1e9e6a; --green-soft:#e7f6ee; --red:#e23b3b; --red-soft:#fdeaea; --amber:#e0930c; --amber-soft:#fcefd6;
  --blue:#3b6fd4; --blue-soft:#e9f0fc; --shadow:0 1px 2px rgba(13,13,13,.04), 0 6px 18px rgba(13,13,13,.06);
}
.pdf-stage{ position:fixed; left:-10000px; top:0; width:794px; background:var(--card); }
.pdf-doc{ width:794px; box-sizing:border-box; padding:34px 30px; background:var(--card); color:#16181d; font-family:'YekanBakhFaNum',sans-serif; direction:rtl; }
.pdf-doc *{ box-sizing:border-box; }
.pdf-head{ display:flex; justify-content:space-between; align-items:flex-start; border-bottom:3px solid #f5b800; padding-bottom:var(--space-4); margin-bottom:22px; }
.pdf-brand{ display:flex; flex-direction:column; gap:5px; }
.pdf-logo{ font-size:26px; font-weight:800; color:#f5b800; line-height:1; }
.pdf-sub{ font-size:12px; color:#8b8f99; }
.pdf-meta{ text-align:left; }
.pdf-title{ font-size:18px; font-weight:800; margin-bottom:7px; color:#16181d; }
.pdf-date,.pdf-gen{ font-size:12px; color:#3c4049; line-height:1.95; }
.pdf-section{ margin-bottom:22px; }
.pdf-sec-h{ display:flex; justify-content:space-between; align-items:center; font-size:15px; font-weight:800; padding:10px 14px; border-radius:10px; margin-bottom:10px; }
.pdf-sec-h.deb{ background:var(--red-soft); color:#c0392b; }
.pdf-sec-h.cred{ background:var(--green-soft); color:#1e8e5a; }
.pdf-table{ width:100%; border-collapse:collapse; font-size:13px; }
.pdf-table th, .pdf-table td{ border:1px solid #e9eaec; padding:9px 11px; text-align:right; vertical-align:top; }
.pdf-table th{ background:var(--bg-soft); font-weight:700; color:#5b6168; }
.pdf-table td.amt{ font-weight:800; white-space:nowrap; text-align:left; }
.pdf-table .pdf-idx{ width:44px; text-align:center; color:#8b8f99; }
.pdf-lines{ margin:5px 0 0; padding:0; list-style:none; color:#5b6168; font-size:11.5px; line-height:1.9; }
.pdf-lines li{ display:flex; justify-content:space-between; gap:var(--space-3); }
.pdf-total-row td{ background:#fff6d6; font-weight:800; color:#16181d; }
.pdf-empty{ padding:14px; text-align:center; color:#8b8f99; font-size:13px; background:var(--bg-soft); border-radius:10px; }
.pdf-foot{ margin-top:26px; border-top:1px solid #e9eaec; padding-top:11px; text-align:center; font-size:11px; color:#9aa0a6; }


/* ===== اصلاحات و قابلیت‌های نسخهٔ جدید ===== */
/* دکمه‌های لودینگ: جلوگیری از شکستن متن به دو خط */
.btn.is-loading{
  cursor:default;
  white-space:nowrap;
}
.btn .label{ display:inline-flex; align-items:center; gap:.35rem; white-space:nowrap; }
.btn .btn-auto-spin{ flex:0 0 auto; }
.pdf-dl, .pdf-dl .label{ white-space:nowrap; }

/* توست: کلیک/کشیدن برای حذف */
.toast-item{
  background:var(--ink);
  color:var(--card);
  border-radius:var(--radius-sm);
  padding:.6rem .9rem;
  font-size:0.875rem;
  display:flex;
  align-items:center;
  gap:.5rem;
  box-shadow:var(--shadow-lg);
  opacity:0;
  transform:translateY(14px);
  transition:opacity .3s,transform .3s;
  max-width:92vw;
  pointer-events:auto;
  cursor:pointer;
  touch-action:pan-x;
  user-select:none;
}
.toast-item.t-hide{ pointer-events:none; }

/* انیمیشن حذف آیتم‌ها */
.fb-removing{ position:relative; }
.fb-removing > *{ opacity:.4; transition:opacity .2s; }
.fb-removing::after{ content:''; position:absolute; top:50%; inset-inline-start:14px; width:18px; height:18px; margin-top:-9px; border:2px solid var(--line); border-top-color:var(--gold-d); border-radius:50%; animation:fbspin .6s linear infinite; z-index:2; }
.fb-collapsing{ overflow:hidden !important; transition:height .3s var(--bez), opacity .3s, margin .3s, padding .3s; }
@keyframes fbspin{ to{ transform:rotate(360deg); } }

/* Empty state جدید */
.empty-state{
  text-align:center;
  padding:1.6rem;
  color:var(--muted);
  animation:esIn .4s var(--bez);
  min-height:48vh;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
}
.empty-state .es-ic{ position:relative; width:84px; height:84px; margin:0 auto 1.1rem; border-radius:24px; display:flex; align-items:center; justify-content:center; background:var(--gold-soft); color:var(--gold-d); border:2px dashed #ecd488; box-shadow:0 10px 26px rgba(253,201,44,.18); }
.empty-state .es-ic i{ font-size:2.4rem; opacity:.95; }
.empty-state .es-title{ margin:0; font-size:var(--fs-16); font-weight:var(--fw-bold); color:var(--ink-2); }
.empty-state .es-sub{ margin:.4rem auto 0; font-size:.83rem; color:var(--muted); max-width:290px; line-height:1.75; }
@keyframes esIn{ from{ opacity:0; transform:translateY(10px) scale(.97); } to{ opacity:1; transform:none; } }
.acc-owner{ font-size:var(--fs-15); font-weight:var(--fw-bold); color:var(--gold-d); }
.acc-meta{
  font-size:0.8125rem;
  color:var(--muted);
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

/* اکشن خروجی PDF در سربرگ جزئیات */
.dh-actions{ display:flex; justify-content:flex-start; margin-top:.7rem; }
.dh-actions .pdf-dl{ margin-inline-start:0; }

/* بخش‌های گزارش PDF جدید */
.pdf-sec-h.gold{ background:#fff6d6; color:#a87900; }
.pdf-sec-h.blue{ background:var(--blue-soft); color:#2f57a6; }
.pdf-sec-h.neutral{ background:#f1f2f3; color:#3c4049; }
.pdf-summary{ display:flex; gap:20px; flex-wrap:wrap; align-items:center; font-size:12.5px; color:#3c4049; margin:0 var(--space-1) var(--space-3); }
.pdf-summary b{ color:#16181d; font-weight:800; }
.pdf-res{ display:inline-block; font-size:11.5px; font-weight:800; padding:3px 10px; border-radius:7px; white-space:nowrap; }
.pdf-res.ok{ background:var(--green-soft); color:#1e8e5a; }
.pdf-res.rem{ background:#fff3cf; color:#a87900; }
.pdf-res.over{ background:var(--red-soft); color:#c0392b; }
.pdf-status{ display:flex; gap:var(--space-3); flex-wrap:wrap; margin-bottom:20px; }
.pdf-status .pdf-res{ font-size:13px; padding:7px var(--space-4); border-radius:9px; }
.pdf-trk{ font-size:10.5px; color:#8b8f99; margin-top:3px; }


/* ============ فاز ۲ · گام ۱: ورود/ثبت‌نام + Splash ============ */
/* صفحهٔ راه‌اندازی مدرن با موشن لوگو */
.boot-splash {
  position: fixed; inset: 0; z-index: 3000;
  overflow: hidden;
  display: flex; align-items: center; justify-content: center;
  background: radial-gradient(120% 120% at 50% 36%, #fff6e0 0%, #ffffff 55%, #f3f4f6 100%);
}
[data-theme="dark"] .boot-splash{ background: radial-gradient(120% 120% at 50% 36%, #20242c 0%, #16181d 58%, #101216 100%); }
[data-theme="dark"] .boot-type{ filter:none; }
[data-theme="dark"] .boot-progress{ background:rgba(255,255,255,.10); }
html[data-theme="dark"].boot-min .boot-splash:not(:has(.fb-conn-error))::after{ border-color:rgba(255,255,255,.14); }
.boot-stage{ display:flex; flex-direction:column; align-items:center; gap:20px; padding:24px; }
.boot-logo{ position:relative; width:94px; height:94px; display:flex; align-items:center; justify-content:center; animation:bootFloat 3s ease-in-out infinite; }
.boot-logo::after{ content:""; position:absolute; inset:-20%; border-radius:50%; background:radial-gradient(circle, rgba(253,201,44,.22), transparent 62%); animation:bootGlow 3s ease-in-out infinite; z-index:-1; }
.boot-mark{ width:100%; height:100%; object-fit:contain; transform-origin:50% 50%; animation:bootMarkIn .7s var(--bez) both, bootSpin 4s ease-in-out .7s infinite; filter:drop-shadow(0 6px 18px rgba(253,201,44,.30)); }
.boot-type{ height:30px; width:auto; opacity:0; animation:bootTypeIn .6s var(--bez) .45s forwards; filter:brightness(0); }
.boot-progress{ width:128px; height:3px; border-radius:99px; background:rgba(13,13,13,.10); overflow:hidden; }
.boot-progress > span{ display:block; height:100%; width:38%; border-radius:99px; background:linear-gradient(90deg, transparent, var(--gold), transparent); animation:bootBar 1.25s var(--bez) infinite; }
.boot-spin{ display:none; }
@keyframes bootMarkIn{ 0%{ opacity:0; transform:scale(.6) rotate(-14deg); } 60%{ opacity:1; } 100%{ opacity:1; transform:scale(1) rotate(0); } }
@keyframes bootFloat{ 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(-7px); } }
@keyframes bootGlow{ 0%,100%{ opacity:.5; transform:scale(.95); } 50%{ opacity:1; transform:scale(1.08); } }
@keyframes bootTypeIn{ from{ opacity:0; transform:translateY(8px); } to{ opacity:1; transform:translateY(0); } }
@keyframes bootBar{ 0%{ transform:translateX(-130%); } 100%{ transform:translateX(330%); } }
@keyframes bootSpin{ 0%,10%{ transform:rotate(0deg) scale(1); } 30%,43%{ transform:rotate(120deg) scale(1.05); } 63%,76%{ transform:rotate(240deg) scale(1.05); } 96%,100%{ transform:rotate(360deg) scale(1); } }
/* اسپلش کامل فقط در نخستین بارگذاری؛ دفعات بعد فقط اسپینر سبک (بدون فلش و جابه‌جایی صفحه) */
html.boot-min .boot-stage{ display:none; }
html.boot-min .boot-splash:not(:has(.fb-conn-error))::after{
  content:""; width:44px; height:44px; border-radius:50%;
  border:3px solid rgba(13,13,13,.14); border-top-color:var(--gold);
  animation:spin .8s linear infinite;
}

.auth-tabs {
  position: relative; display: flex; gap: 6px; background: var(--line); padding: 5px;
  border-radius: 14px; margin-bottom: 18px;
}
.auth-tabs::before {
  content: ""; position: absolute; top: 5px; bottom: 5px; right: 5px;
  width: calc(50% - 5px); border-radius: 10px; background: var(--card);
  box-shadow: 0 2px 8px rgba(0,0,0,.08);
  transition: transform .28s var(--bez); will-change: transform; z-index: 0;
}
.auth-tabs.show-register::before { transform: translateX(-100%); }
.auth-tab {
  position: relative; z-index: 1;
  flex: 1; border: none; background: transparent; padding: 9px 0; border-radius: 10px;
  font-family: inherit; font-weight: 700; font-size: .92rem; color: var(--muted);
  cursor: pointer; transition: color .2s var(--bez);
}
.auth-tab.active { color: var(--ink); }
.form-hint { font-size:0.8125rem; color: var(--muted); margin-top: 6px; text-align: right; }

.login-card .input-group { position: relative; }
.pass-toggle {
  position: absolute; left: 6px; top: 50%; transform: translateY(-50%); z-index: 5;
  border: none; background: transparent; color: var(--muted);
  width: 34px; height: 34px; border-radius: 10px;
  display: flex; align-items: center; justify-content: center; cursor: pointer; font-size: 1.1rem;
}
.pass-toggle:hover { color: var(--ink); background: var(--line); }
#loginPass, #regPass { padding-left: 42px; }

/* ===== پنل کاربری (گام ۲) ===== */
.prof-card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:14px;margin-bottom:var(--space-3)}
.prof-card-h{display:flex;align-items:center;gap:6px;font-weight:700;color:var(--ink);margin-bottom:10px;font-size:.95rem}
.prof-card-h i{color:var(--gold-d)}
.prof-danger{border-color:#f3c2c2;background:#fff8f8}
.prof-danger .prof-card-h i{color:var(--red)}
.cur-seg{display:flex;gap:var(--space-2)}
.cur-opt{flex:1;border:1.5px solid var(--line);background:var(--card);border-radius:var(--radius-sm);padding:10px;font-weight:700;color:var(--muted);cursor:pointer;transition:all .18s var(--bez)}
.cur-opt.active{border-color:var(--gold);background:var(--gold-soft);color:var(--gold-d)}
.dev-list{display:flex;flex-direction:column;gap:var(--space-2)}
.dev-item{display:flex;align-items:center;gap:10px;border:1px solid var(--line);border-radius:var(--radius-sm);padding:10px;background:var(--card);transition:opacity .3s var(--bez),transform .3s var(--bez)}
.dev-item.dev-cur{border-color:var(--gold);background:var(--gold-soft)}
.dev-item.removing{opacity:0;transform:translateX(-16px)}
.dev-ic{width:38px;height:38px;display:flex;align-items:center;justify-content:center;border-radius:10px;background:var(--bg-soft);color:var(--ink-2);font-size:1.25rem;flex:0 0 auto;border:1px solid var(--line)}
.dev-meta{flex:1;min-width:0}
.dev-name{font-weight:700;color:var(--ink);font-size:.9rem;display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.dev-badge{font-size:0.8125rem;background:var(--gold);color:var(--on-gold);border-radius:6px;padding:1px 7px;font-weight:var(--fw-bold)}
.dev-sub{font-size:0.8125rem;color:var(--muted);margin-top:2px}
.dev-end{border:none;background:transparent;color:var(--red);font-size:1.35rem;cursor:pointer;flex:0 0 auto;line-height:1;padding:0}
.dev-lock{color:var(--muted);font-size:1.15rem;flex:0 0 auto}
.dev-empty,.dev-load{color:var(--muted);font-size:.85rem;text-align:center;padding:10px}

/* ===== نوار مشاهده به‌جای کاربر (Impersonation) ===== */
.imper-bar{display:flex;align-items:center;justify-content:space-between;gap:10px;background:linear-gradient(90deg,#a87900,#f5b800);color:#1b1300;padding:var(--space-2) 14px;font-size:13px;font-weight:700;box-shadow:0 2px 8px rgba(168,121,0,.25)}
.imper-bar .imper-txt{display:flex;align-items:center;gap:6px;line-height:1.3}
.imper-bar .imper-txt i{font-size:16px}
.imper-back{display:inline-flex;align-items:center;gap:5px;background:#1b1300;color:var(--card);border:0;border-radius:999px;padding:5px var(--space-3);font-size:13px;font-weight:700;font-family:inherit;cursor:pointer;transition:opacity .15s;white-space:nowrap}
.imper-back:hover{opacity:.85}
.imper-back i{font-size:14px}

/* ===== صفحهٔ پنل کاربری ===== */
.prof-topbar{ display:flex; align-items:center; gap:.7rem; margin-bottom:1rem; }
.prof-back{ width:40px; height:40px; border:1px solid var(--line); background:var(--card); border-radius:var(--radius-sm); display:flex; align-items:center; justify-content:center; color:var(--ink); font-size:1.3rem; cursor:pointer; flex:0 0 auto; transition:background var(--fast); }
.prof-back:hover{ background:var(--bg-soft); }
.prof-head-title{ font-weight:var(--fw-bold); font-size:var(--fs-md); color:var(--ink); }
.prof-hero-av{ width:62px; height:62px; border-radius:50%; background:var(--gold-grad); color:var(--on-gold); display:flex; align-items:center; justify-content:center; font-size:1.9rem; flex:0 0 auto; box-shadow:0 6px 16px rgba(253,201,44,.35); }
.prof-hero-meta{ min-width:0; }
.prof-hero-name{ font-weight:var(--fw-bold); font-size:var(--fs-18); color:var(--ink); line-height:1.3; }
.prof-hero-phone{ color:var(--muted); font-size:.9rem; margin-top:3px; direction:ltr; text-align:right; }

/* ===== سوییچ سفارشی ===== */
.opt-row{ display:flex; align-items:center; justify-content:space-between; gap:14px; }
.opt-txt{ min-width:0; }
.opt-title{ font-weight:700; color:var(--ink); font-size:.95rem; }
.opt-sub{ color:var(--muted); font-size:0.8125rem; margin-top:var(--space-1); line-height:1.6; }
.fb-switch{ flex:0 0 auto; border:none; background:transparent; padding:0; cursor:pointer; min-width:44px; min-height:44px; display:inline-flex; align-items:center; justify-content:center; }
.fb-switch-track{ display:block; width:48px; height:28px; border-radius:999px; background:var(--line); position:relative; transition:background .22s var(--bez); }
.fb-switch-thumb{ position:absolute; top:3px; inset-inline-start:3px; width:22px; height:22px; border-radius:50%; background:var(--card); box-shadow:0 1px 4px rgba(0,0,0,.28); transition:inset-inline-start .22s var(--bez); }
.fb-switch.on .fb-switch-track{ background:var(--gold); }
.fb-switch.on .fb-switch-thumb{ inset-inline-start:23px; }

/* ===== اصلاحات لاگین/ثبت‌نام و پنل کاربری ===== */
/* راست‌چین کردن لیبل‌ها و مقدار ورودی‌ها (حتی شماره) */
.auth-pane .form-label, #profileForm .form-label, #passChangeForm .form-label{ text-align:right; }
.auth-pane .form-control, #profileForm .form-control, #passChangeForm .form-control{ text-align:right; direction:rtl; }
.auth-pane input[type="tel"], #profileForm input[type="tel"]{ direction:rtl; text-align:right; }

/* فاصله برای دکمهٔ چشم رمز عبور تا متن روی آن نیفتد */
.field-pass .form-control{ padding-inline-end:2.6rem; }
.field-pass .pass-toggle{ left:6px; right:auto; }

/* انیمیشن نرمِ جابه‌جایی فرم ورود/ثب��‌نام */
@keyframes authIn{ from{ opacity:0; transform:translateY(8px); } to{ opacity:1; transform:translateY(0); } }
.auth-pane:not(.d-none){ animation: authIn .28s var(--bez); }

/* فاصلهٔ بیشتر بین فیلدهای پنل کاربری */
#profileForm .field-ic{ margin-bottom:1rem; }
#profileForm .form-label{ margin-top:.2rem; }

/* انیمیشن نرمِ آیکون باتم‌نوبار هنگام فعال‌شدن (regular ↔ fill) */
.nav-item i{
  font-size:1.35rem;
  transition:transform .22s var(--bez), color var(--fast);
}
.nav-item.active i{
  animation: navPop .3s var(--bez);
}
@keyframes navPop{ 0%{ transform:scale(.9); } 55%{ transform:scale(1.08); } 100%{ transform:scale(1); } }

/* ===== تبدیل به PWA و لوگوی برند ===== */
/* لوگو طلایی (var(--gold)) است؛ پس‌زمینهٔ بج را تیره می‌کنیم تا کنتراست حفظ شود */
.brand-badge{
  width:72px;
  height:72px;
  margin:0 auto 1rem;
  border-radius:22px;
  background:var(--ink);
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:2rem;
  color:var(--on-gold);
  box-shadow:0 8px 22px rgba(0,0,0,.28);
}
.brand-logo{ width:62%; height:62%; object-fit:contain; display:block; }
/* ===== بنر نصب PWA ===== */
.fb-install-banner{ position:fixed; left:12px; right:12px; bottom:calc(12px + env(safe-area-inset-bottom)); z-index:2900; transform:translateY(170%); opacity:0; transition:transform .4s var(--bez), opacity .3s var(--bez); background:rgba(28,31,38,.96); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); color:#fff; border:1px solid rgba(253,201,44,.22); border-radius:16px; padding:13px 14px; box-shadow:0 14px 40px rgba(0,0,0,.42); display:flex; align-items:center; gap:12px; max-width:520px; margin-inline:auto; }
.fb-install-banner.show{ transform:translateY(0); opacity:1; }
.fb-install-banner .fib-icon{ width:46px; height:46px; border-radius:13px; object-fit:contain; flex-shrink:0; background:#16181d; border:1px solid rgba(253,201,44,.30); padding:6px; }
.fb-install-banner .fib-texts{ flex:1; min-width:0; }
.fb-install-banner .fib-title{ font-weight:700; font-size:14px; }
.fb-install-banner .fib-sub{ font-size:12.5px; opacity:.62; margin-top:2px; line-height:1.55; }
.fb-install-banner .fib-actions{ display:flex; align-items:center; gap:7px; flex-shrink:0; }
.fb-install-banner .fib-install{ background:var(--gold-grad); color:var(--on-gold); border:none; border-radius:10px; font-weight:700; font-size:13px; padding:9px 15px; cursor:pointer; white-space:nowrap; transition:filter .12s var(--bez), transform .12s var(--bez), box-shadow .12s var(--bez); }
.fb-install-banner .fib-install:hover{ filter:brightness(1.05); transform:translateY(-1px); box-shadow:0 6px 16px rgba(253,201,44,.32); }
.fb-install-banner .fib-install:active{ transform:translateY(0) scale(.97); }
.fb-install-banner .fib-dismiss{ background:none; border:none; color:#fff; font-size:22px; line-height:1; opacity:.5; cursor:pointer; padding:0 2px; flex-shrink:0; transition:opacity .15s; }
.fb-install-banner .fib-dismiss:hover{ opacity:1; }
/* ===== لوگو هدر اپ ===== */
.hdr-logo{ height:34px; width:auto; display:block; flex:0 0 auto; }
.hdr-brand .hdr-logo{ transition:transform .45s var(--bez); }
.hdr-brand-text{ display:inline-block; max-width:0; opacity:0; overflow:hidden; white-space:nowrap; transform:translateX(12px) scale(.82); transform-origin:right center; margin-inline-start:0; font-weight:var(--fw-bold); font-size:var(--fs-md); color:var(--ink); letter-spacing:-.3px; transition:max-width .55s var(--bez), opacity .4s var(--bez), transform .55s var(--bez), margin-inline-start .55s var(--bez); }
.hdr-brand.show-text .hdr-brand-text{ max-width:140px; opacity:1; transform:none; margin-inline-start:.5rem; }
.hdr-brand-text .hdr-logotype{ height:21px; width:auto; display:block; }
/* دسکتاپ: متن لوگو به‌صورت absolute کنار لوگو ظاهر می‌شود تا چیدمان هدر (تاریخ) جابه‌جا نشود */
@media (min-width:621px){
  .hdr-brand{ position:relative; }
  .hdr-brand-text{ position:absolute; top:50%; right:100%; margin:0 .5rem 0 0; max-width:none; opacity:0; transform:translateY(-50%) translateX(14px) scale(.9); transition:opacity .4s var(--bez), transform .55s var(--bez); }
  .hdr-brand.show-text .hdr-brand-text{ opacity:1; transform:translateY(-50%) translateX(0) scale(1); }
}
.hdr-brand.show-text .hdr-logo{ animation:logoPop .6s var(--bez); }
@keyframes logoPop{ 0%{ transform:rotate(0) scale(1); } 40%{ transform:rotate(-8deg) scale(1.12); } 75%{ transform:rotate(4deg) scale(1.04); } 100%{ transform:rotate(0) scale(1); } }

/* ===== صفحهٔ خطای قطع اتصال (Online-Only) ===== */
.fb-conn-error{max-width:360px;width:100%;margin:auto;text-align:center;padding:var(--space-6);}
.fb-conn-error>i{font-size:56px;color:var(--gold);display:block;margin-bottom:14px;}
.fb-conn-error h2{font-size:18px;font-weight:var(--fw-bold);margin:0 0 10px;}
.fb-conn-error p{font-size:14px;line-height:1.9;opacity:.85;margin:0 0 22px;}
.fb-conn-error .fb-conn-btn{background:var(--gold-grad,var(--gold));color:var(--on-gold,#16181d);border:0;border-radius:14px;padding:var(--space-3) 26px;font-size:15px;font-weight:700;font-family:inherit;cursor:pointer;transition:transform .12s var(--bez,ease);}
.fb-conn-error .fb-conn-btn:active{transform:scale(.97);}

/* ==================== بازطراحی نمای حسابدار (Accountant View Redesign) ==================== */
/* هدف: تشخیص سریع وضعیت، کاهش خطا، رنگ فقط برای وضعیت/هشدار. رنگ طلایی تزئینی حذف شد. */

/* —— نوار خلاصهٔ روز —— */
.acc-summary{ display:grid; grid-template-columns:repeat(4,1fr); gap:.5rem; margin-bottom:.5rem; }
.acc-sum-item{ display:flex; flex-direction:column; align-items:center; justify-content:center; gap:.15rem; padding:.6rem .3rem; background:var(--card); border:1px solid var(--line); border-radius:var(--radius-sm); box-shadow:var(--shadow); }
.acc-sum-item .asi-num{ font-size:var(--fs-22); font-weight:var(--fw-bold); line-height:1; color:var(--ink, #1f2430); }
.acc-sum-item .asi-lbl{ font-size:0.8125rem; color:var(--muted); }
.acc-sum-item.is-done .asi-num{ color:var(--green); }
.acc-sum-item.is-pending .asi-num{ color:var(--muted); }
.acc-sum-item.is-flag .asi-num{ color:var(--red); }
.acc-progress{ height:6px; width:100%; background:var(--line); border-radius:99px; overflow:hidden; margin-bottom:.85rem; }
.acc-progress-fill{ display:block; height:100%; width:0; background:var(--green); border-radius:99px; transition:width .4s var(--bez, ease); }

/* —— کارت واریز‌کننده —— */
.acc-card{
  background:var(--card);
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:.75rem;
  box-shadow:var(--shadow);
  margin-bottom:.7rem;
}
.acc-head{
  display:flex;
  align-items:center;
  gap:.55rem;
  margin-bottom:.6rem;
}
/* آواتار خنثی به‌جای پس‌زمینهٔ طلایی */
.acc-avatar{
  width:38px;
  height:38px;
  border-radius:50%;
  background:var(--bg-soft);
  color:var(--muted);
  display:grid;
  place-items:center;
  font-size:1.15rem;
  flex:0 0 auto;
  border:1px solid var(--line);
}
.acc-htxt{ flex:1 1 auto; min-width:0; }
.acc-name{
  font-weight:700;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.acc-sub{
  font-size:0.8125rem;
  color:var(--muted);
}
/* نشانگر تعداد کل — خنثی */
.acc-count-badge{ flex:0 0 auto; min-width:26px; height:24px; padding:0 .5rem; border-radius:99px; background:var(--bg-soft); border:1px solid var(--line); color:var(--muted); font-size:0.8125rem; font-weight:700; display:inline-flex; align-items:center; justify-content:center; }
.acc-receipts{
  display:flex;
  flex-direction:column;
  gap:.45rem;
}

/* —— سطر فیش: تراز چک + اطلاعات، با لبهٔ وضعیتی در ابتدا —— */
.acc-receipt{
  display:flex;
  align-items:flex-start;
  gap:.55rem;
  padding:.45rem .6rem;
  border:1px solid var(--line);
  border-radius:var(--radius-sm);
  background:var(--card);
  transition:background var(--fast,.15s) var(--bez,ease), border-color var(--fast,.15s);
  border-inline-start:4px solid var(--line-2);
  cursor:pointer;
}
.acc-receipt:hover{ border-color:var(--gold); }
/* در انتظار: لبهٔ خنثی (پیش‌فرض) */
.acc-receipt.done{
  background:var(--green-soft);
  border-color:#bfe6d2;
  border-inline-start-color:var(--green);
}
.acc-receipt.flagged{
  background:var(--red-soft);
  border-color:#f3c9c9;
  border-inline-start-color:var(--red);
}
/* تأییدشده + مورد دار: پس‌زمینهٔ تأیید، لبهٔ هشدار */
.acc-receipt.done.flagged{
  background:var(--green-soft);
  border-color:#bfe6d2;
  border-inline-start-color:var(--red);
}
.acc-check:hover{ border-color:var(--green); }
.acc-check:focus,.acc-check:focus-visible{ outline:none; box-shadow:0 0 0 3px var(--green-soft); border-color:var(--green); }
.acc-receipt.done .acc-check{
  background:var(--green);
  border-color:var(--green);
  color:var(--card);
}

/* —— اطلاعات فیش: سلسله‌مراتب بصری —— */
.acc-info{
  display:flex;
  flex-direction:column;
  gap:.25rem;
  min-width:0;
  flex:1 1 auto;
}
.acc-line1{
  display:flex;
  align-items:center;
  gap:.5rem;
  flex-wrap:wrap;
  justify-content:space-between;
}
/* مبلغ = مهم‌ترین داده → برجسته‌ترین */
.acc-amt{
  font-size:var(--fs-md);
  font-weight:var(--fw-bold);
  color:var(--ink);
  letter-spacing:-.1px;
}
/* چیپ وضعیت — متن و رنگ از ��وی کلاس والد (CSS-only) تا با منطق موجود هم‌خوان بماند */
/* خ۱: مبلغ در ردیف مستقل؛ نام صاحب حساب تمام‌عرض با ellipsis فقط روی نام */
.acc-line1{ flex-direction:row; align-items:center; gap:.6rem; flex-wrap:nowrap; justify-content:space-between; }
.acc-line1 .acc-amt{ flex:0 0 auto; }
.acc-line1 .acc-owner{ flex:1 1 auto; min-width:0; display:flex; justify-content:flex-end; align-items:center; gap:.25rem; font-size:var(--fs-sm); font-weight:var(--fw-semibold); color:var(--ink); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.acc-line1 .acc-owner i{ flex:0 0 auto; font-size:.95rem; opacity:.7; }
.acc-line2{ display:flex; flex-wrap:wrap; align-items:center; gap:.15rem .6rem; font-size:var(--fs-13); color:var(--muted); }
.acc-line2 .acc-owner{ color:var(--ink, #1f2430); font-weight:var(--fw-semibold); display:inline-flex; align-items:center; gap:.25rem; min-width:0; }
.acc-line2 .acc-owner i,.acc-line2 .acc-meta i{ font-size:.95rem; opacity:.7; }
/* چیپ وضعیت → نشانگر کوچک (نقطهٔ رنگی + متن کوتاه) تا نام بانک فضا بگیرد */
.acc-line2 .acc-status{ background:transparent; padding:0; margin-inline-end:0; gap:.3rem; font-size:var(--fs-12); font-weight:var(--fw-semibold); flex:0 0 auto; }
.acc-line2 .acc-status::before{ content:""; width:7px; height:7px; border-radius:50%; background:currentColor; flex:0 0 auto; }
.acc-line2 .acc-meta{ display:inline-flex; align-items:center; gap:.25rem; flex:1 1 auto; min-width:0; white-space:normal; word-break:break-word; }
.acc-line3{ display:flex; flex-wrap:wrap; align-items:center; gap:.4rem; }
.acc-flags{
  display:inline-flex;
  align-items:center;
  gap:.35rem;
}

/* —— واکنش‌گرایی (موبایل) —— */
@media (max-width:620px){
  .acc-summary{ gap:.4rem; }
  .acc-sum-item{ padding:.5rem .2rem; }
  .acc-sum-item .asi-num{ font-size:1.1rem; }
  .acc-sum-item .asi-lbl{ font-size:0.8125rem; }
  .acc-amt{ font-size:1rem; }
  .acc-line2{ gap:.1rem .5rem; font-size:0.8125rem; }
}

/* =========================================================
   بازطراحی UI/UX (نسخهٔ ۲) — سلسله‌مراتب، رنگ‌بندی برند جدید
   ========================================================= */

/* --- مودال «اطلاعات بیشتر»: ساختار درختی واضح‌تر --- */
/* والد (شبا) برجسته‌تر: فونت بزرگ‌تر و وزن بیشتر */
.detail-sheba .ds-name{
  display:flex;
  align-items:center;
  gap:.4rem;
  font-size:var(--fs-15);
  font-weight:var(--fw-bold);
  color:var(--ink);
}
.detail-sheba .ds-name i{
  color:var(--gold-d);
  font-size:1.05em;
}
/* خط اتصال درختی نرم‌تر و تورفتگی بیشتر برای تمایز زیرشاخه‌ها */
.dep-list{
  margin-top:.8rem;
  padding-inline-start:.85rem;
  border-inline-start:2px solid var(--line);
  display:flex;
  flex-direction:column;
  gap:.5rem;
  margin-inline-start:.25rem;
}
/* فرزند (واریزکننده) سبک‌تر و کوچک‌تر از والد */
.depositor{
  background:var(--card);
  border:1px solid var(--line);
  border-radius:var(--radius-sm);
  padding:.6rem .65rem;
  margin-top:.7rem;
}
.depositor .dep-name{
  display:flex;
  align-items:center;
  gap:.35rem;
  font-size:0.875rem;
  font-weight:700;
  color:var(--ink-2);
}
.depositor .dep-name i{
  color:var(--muted);
  font-size:.95em;
}
.detail-sheba .depositor .mini-stats{ background:var(--bg-soft); border-color:var(--line); }
.detail-sheba .depositor .mini-stats .ms-i b{
  font-size:0.875rem;
  font-weight:700;
}
.detail-sheba .depositor .mini-stats .ms-i span{ font-size:0.8125rem; }

/* --- صفحه خلاصه: آیتم فیش با ارتباط بصری واضح --- */
/* خلاصه روز: ردیف فیش دو‌خطی (خ۱: طرفین، خ۲: نام حساب + مبلغ) */
.rs-item{
  position:relative;
  display:flex;
  flex-direction:column;
  gap:.2rem;
  padding:.55rem .7rem;
  border-top:1px solid var(--line-2);
  font-size:var(--fs-sm);
}
.rs-item.rs-clickable{ cursor:pointer; transition:background var(--fast); }
.rs-item.rs-clickable:hover{ background:var(--bg-soft); }
.rs-item.rs-justmoved{ animation:rsFlash .7s var(--bez); }
@keyframes rsFlash{ 0%{ background:var(--gold-soft); } 100%{ background:transparent; } }
/* خط ۱: buyer ← supplier — تنها خط مجاز به ellipsis تک‌سطری */
.rs-rel{ display:flex; flex-direction:row; align-items:center; gap:.4rem; min-width:0; font-weight:var(--fw-semibold); }
.rs-party{ display:inline-flex; align-items:center; gap:.28rem; min-width:0; color:var(--ink); font-weight:var(--fw-semibold); }
.rs-party > span.rs-txt{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.rs-party i{ color:var(--muted); font-size:1em; flex:0 0 auto; }
.rs-arrow{ color:var(--muted); font-size:.95em; flex:0 0 auto; opacity:.8; }
.rs-dest{ color:var(--ink-2); font-weight:var(--fw-semibold); min-width:0; }
.rs-dest .rs-acc{ color:var(--muted); font-weight:var(--fw-medium); }
.rs-dest .rs-acc::before{ content:"·"; margin:0 .25rem; color:var(--line); }
/* خط ۲: نام حساب (راست، muted ۱۳px) + مبلغ (چپ) — بدون ellipsis */
.rs-line2{ display:flex; align-items:baseline; justify-content:space-between; gap:.6rem; }
.rs-acc-name{ flex:1 1 auto; min-width:0; font-size:var(--fs-12); color:var(--muted); font-weight:var(--fw-regular); opacity:.9; word-break:break-word; }
.rs-side{ display:flex; align-items:center; gap:.4rem; flex:0 0 auto; }
.rs-note-ic{ color:var(--amber); font-size:1rem; flex:0 0 auto; }
.rs-amt{ flex:0 0 auto; color:var(--ink); font-size:var(--fs-md); font-weight:var(--fw-bold); letter-spacing:-.1px; }

/* --- صفحه حسابدار: علامت تأیید به‌صورت SVG درون‌خطی (رفع تأخیر/Flicker فونت آیکونی) --- */
.acc-check svg{ width:16px; height:16px; display:block; stroke:currentColor; stroke-width:3; fill:none; pointer-events:none; }
.acc-check{
  width:28px;
  height:28px;
  flex:0 0 auto;
  border-radius:8px;
  border:2px solid var(--line-2);
  background:var(--card);
  display:grid;
  place-items:center;
  cursor:pointer;
  color:transparent;
  transition:all var(--fast,.15s) var(--bez,ease);
  margin-top:.1rem;
  font-size:1rem;
  -webkit-tap-highlight-color:transparent;
}

/* =========================================================
   پنل کاربری — معماری «مرکز دسترسی» (Hub + زیربخش‌ها)
   ========================================================= */
.prof-hero{
  display:flex;
  align-items:center;
  gap:14px;
  background:var(--card);
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:var(--space-4) 18px;
  margin-bottom:14px;
  box-shadow:0 4px 16px rgba(16,24,40,.05);
  position:relative;
}
.prof-hero-chips{ display:flex; flex-wrap:wrap; gap:.4rem; margin-top:.6rem; }
.prof-chip{ display:inline-flex; align-items:center; gap:.3rem; font-size:0.8125rem; font-weight:700; color:var(--ink-2); background:var(--bg-soft); border:1px solid var(--line); border-radius:99px; padding:.22rem .6rem; }
.prof-chip i{ color:var(--gold-d); font-size:.95em; }

/* لیست منوی دسترسی */
.prof-menu{ display:flex; flex-direction:column; gap:.55rem; margin-top:.2rem; }
.prof-menu-sec{ font-size:0.8125rem; font-weight:700; color:var(--muted); margin:.7rem .25rem .1rem; }
.prof-menu-item{ display:flex; align-items:center; gap:.8rem; width:100%; text-align:start; background:var(--card); border:1px solid var(--line); border-radius:14px; padding:.85rem .9rem; font-family:inherit; cursor:pointer; transition:background var(--fast), border-color var(--fast), transform var(--fast); }
.prof-menu-item:hover{ background:var(--bg-soft); }
.prof-menu-item:active{ transform:scale(.99); }
.prof-menu-ic{ width:40px; height:40px; flex:0 0 auto; border-radius:11px; background:var(--gold-soft); color:var(--gold-d); display:flex; align-items:center; justify-content:center; font-size:1.25rem; }
.prof-menu-txt{ flex:1 1 auto; min-width:0; display:flex; flex-direction:column; gap:2px; }
.prof-menu-title{ display:block; font-weight:700; font-size:.92rem; line-height:1.35; color:var(--ink); }
.prof-menu-sub{ display:block; font-size:0.8125rem; line-height:1.3; color:var(--muted); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.prof-menu-arrow{ color:var(--muted); font-size:1.2rem; flex:0 0 auto; }
.prof-menu-item.is-danger .prof-menu-ic{ background:var(--red-soft); color:var(--red); }
.prof-menu-item.is-danger .prof-menu-title{ color:var(--red); }

/* زیربخش‌ها */
.prof-view{ animation:profViewIn .22s var(--bez); }
.prof-view[hidden]{ display:none; }
.prof-home[hidden]{ display:none; }
@keyframes profViewIn{ from{ opacity:0; transform:translateX(12px); } to{ opacity:1; transform:none; } }

/* دکمهٔ نمایش بیشتر دستگاه‌ها */
.dev-more{ width:100%; border:1px dashed var(--line); background:var(--bg-soft); color:var(--ink-2); font-family:inherit; font-weight:700; font-size:0.875rem; padding:.55rem; margin-top:.5rem; border-radius:var(--radius-sm); cursor:pointer; display:flex; align-items:center; justify-content:center; gap:.35rem; transition:background var(--fast); }
.dev-more:hover{ background:#eceef0; }
.dev-more i{ color:var(--gold-d); }
.dev-ic.dev-os-apple{ color:var(--ink); }
.dev-ic.dev-os-android{ color:#2e7d46; }
.dev-ic.dev-os-windows{ color:#2b6cb0; }

/* ===== دسترس‌پذیری: حداقل اندازهٔ لمسی ۴۴×۴۴ برای دکمه‌های فقط‌آیکنی ===== */
.btn-sm,.day-nav,.prof-back,.btn-remove-sheba,.pass-toggle,.btn-logout,.cur-opt,.fb-install-banner .fib-dismiss,.dev-end{ min-width:40px; min-height:40px; }
.nav-item{
  flex:1;
  background:none;
  border:none;
  cursor:pointer;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:.15rem;
  padding:.45rem 0;
  color:var(--muted);
  font-size:0.8125rem;
  font-weight:600;
  border-radius:var(--radius-sm);
  transition:color var(--fast);
  min-height:40px;
}

/* ===== کاهش حر��ت سیستمی (Reduced Motion) ===== */
@media (prefers-reduced-motion: reduce){
  *{ animation:none !important; transition:none !important; }
}


/* =========================================================
   افزوده‌های بهبود (اعتبارسنجی inline، سگمنت حسابدار، منطقهٔ خطر)
   — همه با توکن‌های موجود
   ========================================================= */
.field-err{
  color:var(--red);
  font-size:var(--fs-xs);
  margin-top:var(--space-1);
  margin-inline-start:var(--space-1);
  line-height:1.5;
}
.fb-invalid{
  border-color:var(--red) !important;
  box-shadow:0 0 0 1px var(--red-soft) !important;
}

.acc-seg{
  display:flex;
  gap:var(--space-2);
  background:var(--bg-soft);
  border:1px solid var(--line);
  border-radius:var(--radius-sm);
  padding:var(--space-1);
  margin-bottom:var(--space-3);
}
.acc-seg-btn{
  flex:1 1 0;
  min-width:0;
  border:0;
  background:transparent;
  color:var(--muted);
  font-family:inherit;
  font-size:var(--fs-xs);
  font-weight:var(--fw-medium);
  letter-spacing:-.2px;
  padding:var(--space-2) var(--space-1);
  border-radius:var(--radius-sm);
  cursor:pointer;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  transition:background var(--fast),color var(--fast);
  min-height:40px;
}
.acc-seg-btn.active{
  background:var(--card);
  color:var(--ink);
  box-shadow:var(--shadow);
  animation:segPop .26s var(--bez);
}
@keyframes segPop{ 0%{ transform:scale(.95); } 60%{ transform:scale(1.03); } 100%{ transform:scale(1); } }
.acc-anim{ animation:accFade .32s var(--bez); }
@keyframes accFade{ from{ opacity:0; transform:translateY(6px); } to{ opacity:1; transform:none; } }
.acc-status{
  display:inline-flex;
  align-items:center;
  font-size:var(--fs-xs);
  font-weight:var(--fw-medium);
  padding:2px var(--space-2);
  border-radius:999px;
  white-space:nowrap;
  margin-inline-end:var(--space-2);
}
.acc-st-normal{ background:var(--bg-soft); color:var(--muted); }
.acc-st-acc{ background:var(--green-soft); color:var(--green); }
.acc-st-flag{ background:var(--red-soft); color:var(--red); }
.acc-hidden{ display:none !important; }
.acc-card-hidden{ display:none !important; }

.danger-zone{
  border:1.5px solid var(--red);
  background:var(--red-soft);
  border-radius:var(--radius);
  padding:var(--space-4);
  margin-top:var(--space-4);
}
.danger-zone-h{
  display:flex;
  align-items:center;
  gap:var(--space-2);
  color:var(--red);
  font-weight:var(--fw-bold);
  font-size:var(--fs-md);
  margin-bottom:var(--space-2);
}
.danger-zone-h i{ font-size:1.2em; }
.danger-zone-desc{
  color:var(--ink-2);
  font-size:var(--fs-sm);
  line-height:var(--lh-normal);
  margin:0 0 var(--space-3);
}


/* ============ سیستم یکپارچهٔ دکمه (نوع × اندازه) ============ */
.btn-primary:focus-visible,.btn-secondary:focus-visible,.btn-ghost:focus-visible,.btn-destructive:focus-visible{ outline:2px solid var(--gold-d); outline-offset:2px; }
.btn-secondary:focus-visible{ outline-color:var(--ink-2); }
.btn-ghost:hover{ background:var(--bg-soft); color:var(--ink-2); }
.btn-md{ padding:.62rem 1rem; font-size:.92rem; }
.btn-lg{ padding:.8rem 1.2rem; font-size:1.02rem; border-radius:var(--radius); }

/* ============ مسیر صفحه‌ای drill-down ============ */
body.drill-open{ overflow:hidden; }
.drill-view{ position:fixed; inset:0; z-index:1035; background:var(--bg); display:flex; flex-direction:column; animation:drillIn .22s var(--bez); }
@keyframes drillIn{ from{ opacity:0; transform:translateX(-12px); } to{ opacity:1; transform:none; } }
.drill-view.drill-closing{ animation:drillOut .2s var(--bez) forwards; }
@keyframes drillOut{ from{ opacity:1; transform:none; } to{ opacity:0; transform:translateX(-12px); } }
.drill-bar{ display:flex; align-items:center; gap:.5rem; padding:.7rem .9rem; border-bottom:1px solid var(--line); background:var(--card); position:sticky; top:0; }
.drill-topbar{ display:flex; align-items:center; justify-content:space-between; gap:.6rem; padding:.7rem .9rem; border-bottom:1px solid var(--line); background:var(--card); flex:0 0 auto; }
.drill-page-title{ font-size:var(--fs-md); font-weight:var(--fw-bold); color:var(--ink); min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.drill-title-wrap{ display:flex; align-items:center; gap:.5rem; flex-wrap:wrap; min-width:0; }
.drill-kind{ flex:0 0 auto; display:inline-flex; align-items:center; padding:2px .55rem; border-radius:999px; background:var(--bg-soft); border:1px solid var(--line); color:var(--muted); font-size:var(--fs-xs); font-weight:var(--fw-medium); white-space:nowrap; }
.drill-close{ flex:0 0 auto; width:40px; height:40px; border:1px solid var(--line); background:var(--bg-soft); color:var(--ink-2); border-radius:11px; cursor:pointer; display:inline-flex; align-items:center; justify-content:center; font-size:1.25rem; transition:background var(--fast),color var(--fast),border-color var(--fast); }
.drill-close:hover{ background:var(--red-soft); color:var(--red); border-color:#f3c9c9; }
.drill-footer{ flex:0 0 auto; position:sticky; bottom:0; top:auto; border-top:1px solid var(--line); border-bottom:none; }
.drill-back{ flex:0 0 auto; min-height:40px; height:40px; padding:0 .95rem 0 .8rem; border:none; border-radius:99px; background:var(--bg-soft); color:var(--ink); cursor:pointer; display:inline-flex; align-items:center; gap:.35rem; font:inherit; font-weight:var(--fw-semibold); font-size:var(--fs-sm); transition:background var(--fast); }
.drill-back i{ font-size:1.15rem; }
.drill-back:hover{ background:#e9ebed; }
.drill-back:focus-visible{ outline:2px solid var(--gold-d); outline-offset:2px; }
.drill-crumbs{ display:flex; align-items:center; gap:.25rem; flex-wrap:nowrap; font-size:var(--fs-sm); overflow-x:auto; overflow-y:hidden; -webkit-overflow-scrolling:touch; scrollbar-width:thin; scrollbar-color:var(--line) transparent; padding-bottom:4px; }
.drill-crumbs::-webkit-scrollbar{ height:4px; }
.drill-crumbs::-webkit-scrollbar-thumb{ background:var(--line); border-radius:99px; }
.drill-crumbs::-webkit-scrollbar-track{ background:transparent; }
.drill-crumbs > *{ flex:0 0 auto; }
.drill-crumb{ border:none; background:none; color:var(--muted); cursor:pointer; padding:.2rem .35rem; border-radius:8px; font:inherit; max-width:42vw; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; display:inline-flex; align-items:center; gap:.28rem; }
.drill-crumb i{ flex:0 0 auto; font-size:1rem; line-height:1; }
.drill-crumb.active{ max-width:none; }
.drill-crumb:hover{ background:var(--bg-soft); color:var(--ink-2); }
.drill-crumb.active{ color:var(--ink); font-weight:700; }
.drill-crumb i{ font-size:.95em; }
.drill-sep{ color:var(--line); font-size:.85em; }
.drill-body{ flex:1; overflow-y:auto; padding:1rem .9rem 2rem; -webkit-overflow-scrolling:touch; }
.drill-title{ font-size:var(--fs-lg); font-weight:var(--fw-bold); margin:0; display:flex; align-items:center; gap:.4rem; flex-wrap:wrap; }
.drill-head{ display:flex; align-items:center; justify-content:space-between; gap:.6rem .8rem; margin-bottom:.95rem; flex-wrap:wrap; }
.drill-head .drill-title{ flex:1 1 auto; min-width:0; }
.drill-head .btn{ flex:0 0 auto; }
.drill-page{ animation:drillPage .2s var(--bez); max-width:760px; margin-inline:auto; }
@keyframes drillPage{ from{ opacity:0; transform:translateX(14px); } to{ opacity:1; transform:none; } }
.drill-stats{ margin-bottom:1rem; }
.drill-list{ display:flex; flex-direction:column; gap:.55rem; }
.drill-row{ display:flex; align-items:center; gap:.7rem; width:100%; text-align:right; border:1px solid var(--line); background:var(--card); border-radius:var(--radius-sm); padding:.8rem .85rem; cursor:pointer; transition:transform var(--fast) var(--bez), box-shadow var(--fast), border-color var(--fast); }
.drill-row:hover{ border-color:var(--gold); box-shadow:var(--shadow); transform:translateY(-1px); }
.drill-row:focus-visible{ outline:2px solid var(--gold-d); outline-offset:2px; }
.dr-ic{ flex:0 0 auto; width:38px; height:38px; border-radius:10px; background:var(--bg-soft); display:flex; align-items:center; justify-content:center; font-size:1.15rem; color:var(--ink-2); }
.dr-main{ flex:1; min-width:0; display:flex; flex-direction:column; gap:.2rem; }
.dr-name{ font-weight:700; font-size:var(--fs-sm); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.dr-sub{ font-size:var(--fs-xs); color:var(--muted); }
.dr-end{ flex:0 0 auto; display:flex; align-items:center; gap:.4rem; }
.dr-chev{ color:var(--muted); font-size:1rem; }

/* ============ داشبورد اقدام‌محور (KPI) ============ */
.kpi-grid{ display:flex; flex-direction:column; gap:.7rem; margin-bottom:1.2rem; }
.kpi-card{ display:flex; align-items:center; gap:.8rem; width:100%; text-align:right; border:1px solid var(--line); background:var(--card); border-radius:var(--radius); padding:.95rem 1rem; cursor:pointer; transition:transform var(--fast) var(--bez), box-shadow var(--fast), border-color var(--fast); }
.kpi-card:hover{ box-shadow:var(--shadow); transform:translateY(-1px); }
.kpi-card:focus-visible{ outline:2px solid var(--gold-d); outline-offset:2px; }
.kpi-attn{ border-color:var(--amber); background:linear-gradient(0deg,var(--amber-soft),var(--card)); }
.kpi-ic{ flex:0 0 auto; width:46px; height:46px; border-radius:13px; background:var(--bg-soft); display:flex; align-items:center; justify-content:center; font-size:1.4rem; color:var(--ink-2); }
.kpi-attn .kpi-ic{ background:var(--amber-soft); color:var(--amber); }
.kpi-body{ flex:1; min-width:0; display:flex; flex-direction:column; gap:.15rem; }
.kpi-label{ font-size:var(--fs-sm); color:var(--muted); font-weight:600; }
.kpi-amt{ font-size:var(--fs-lg); font-weight:var(--fw-bold); }
.kpi-sub{ font-size:var(--fs-xs); color:var(--muted); }
.kpi-cta{ flex:0 0 auto; color:var(--muted); font-size:1.1rem; }

/* ============ فاز ۱ · کلاس کمکی مبلغ (وزن ۷۰۰ + ارقام جدولی) ============ */
.amount,
.rl-amt,.oa-val,.acc-amt,.kpi-amt,.rs-amt,.bal-amt{
  font-weight:var(--fw-bold);
  font-variant-numeric:tabular-nums;
}
/* خروجی PDF: فقط هم‌ترازی ارقام در ستون مبلغ (بدون تغییر دیگر) */
.pdf-table td.amt{ font-variant-numeric:tabular-nums; }

/* ============ فاز ۵ · رفتار موبایل ============ */
@media (max-width:620px){
  /* جلوگیری از زوم خودکار iOS در فوکوس: فونت ورودی ≥۱۶px */
  .form-control,.form-select{ font-size:16px; }
  /* مسیر drill: همهٔ کرامب‌ها نمایش داده می‌شوند و در صورت کمبود فضا افقی اسکرول می‌خورند (بدون شکستن به خط دوم) */
}

/* ===== ورود/ثبت‌نام با کد پیامکی (OTP) ===== */
.auth-alt { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: 12px; flex-wrap: wrap; }
.auth-link { background: none; border: none; color: var(--blue); font: inherit; font-size: 13px; cursor: pointer; padding: 4px 2px; }
.auth-link:hover { text-decoration: underline; }
.otp-timer { font-size: 12px; color: var(--muted); }
.otp-phone-row { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 14px; font-size: 13px; color: var(--muted); flex-wrap: wrap; }
.otp-phone-row b { color: var(--ink); direction: ltr; unicode-bidi: plaintext; }
.otp-code-input { text-align: center; letter-spacing: 0.5em; font-size: 20px; font-weight: 700; direction: ltr; }
.del-otp-row { display: flex; align-items: stretch; gap: 8px; }
.del-otp-row .field-ic { flex: 1; }
.del-otp-row .btn { white-space: nowrap; }

/* ===== OTP چندخانه‌��ی (۵ رقم) ===== */
.otp-boxes{ display:flex; gap:.5rem; justify-content:center; direction:ltr; margin:.2rem 0; }
.otp-box{ width:48px; height:56px; text-align:center; font-size:1.5rem; font-weight:700; color:var(--ink); background:var(--bg-soft); border:1.5px solid var(--line); border-radius:var(--radius-sm); font-variant-numeric:tabular-nums; transition:border-color var(--fast), background var(--fast), box-shadow var(--fast); }
.otp-box:focus{ outline:none; border-color:var(--gold); background:var(--card); box-shadow:0 0 0 3px rgba(253,201,44,.28); }
.otp-box:not(:placeholder-shown){ border-color:var(--gold); }
@media (max-width:620px){ .otp-box{ width:44px; height:52px; font-size:1.35rem; } }

/* ===== پیش‌نمایش واحد پولی ===== */
.cur-preview{ display:flex; align-items:center; justify-content:space-between; gap:.6rem; margin:.8rem 0 .4rem; padding:.7rem .9rem; border:1px dashed var(--line); border-radius:var(--radius-sm); background:var(--bg-soft); }
.cur-preview-cap{ font-size:.8125rem; color:var(--muted); }
.cur-preview-val{ font-weight:800; color:var(--gold-d); font-variant-numeric:tabular-nums; }

/* ===== جریان تغییر شماره همراه ===== */
.pc-pane{ margin-top:1rem; padding-top:1rem; border-top:1px dashed var(--line); animation: authIn .28s var(--bez); }
.pc-h{ display:flex; align-items:center; gap:6px; font-weight:700; color:var(--ink); margin-bottom:.7rem; font-size:.95rem; }
.pc-h i{ color:var(--gold-d); }
.pc-actions{ display:flex; align-items:center; gap:.5rem; flex-wrap:wrap; margin-top:.4rem; }

/* ===== Empty State — آیکون کلیک‌پذیر ===== */
.es-ic-action{ cursor:pointer; transition:transform var(--fast), background var(--fast), color var(--fast), box-shadow var(--fast); }
.es-ic-action:hover{ transform:translateY(-2px); background:var(--gold); color:var(--on-gold); border-color:var(--gold); box-shadow:0 12px 30px rgba(253,201,44,.30); }
.es-ic-action:active{ transform:translateY(0); }
.es-ic-action:focus-visible{ outline:2px solid var(--gold-d); outline-offset:3px; }

/* ===== مدیریت دستگاه‌ها — ریزه‌کاری‌ها ===== */
.dev-sub{ display:flex; align-items:center; gap:5px; }
.dev-sub i{ font-size:.9em; opacity:.85; color:var(--muted); }
.dev-last{ margin-top:3px; }
.dev-last i{ color:var(--green); opacity:1; }
.dev-badge{ display:inline-flex; align-items:center; gap:3px; }
.dev-badge i{ font-size:.95em; }

/* =========================================================
   دارک مود — بازتعریف متغیرها + اصلاح رنگ‌های ثابت + PDF
   با data-theme روی <html> کنترل می‌شود (localStorage یا ترجیح مرورگر)
   ========================================================= */
:root[data-theme="dark"]{
  --bg:#15171c;
  --bg-soft:#1e2128;
  --card:#21252e;
  --ink:#f2f4f7;
  --ink-2:#cdd2da;
  --muted:#969ca7;
  --line:#343a45;
  --line-2:#272b33;
  --gold:#FDC92C;
  --gold-d:#ffd75e;
  --gold-soft:#3a2f12;
  --gold-grad:linear-gradient(135deg,#ffe27a,#FDC92C);
  --on-gold:#0d0d0d;
  --green:#34c98a; --green-soft:#12281f;
  --red:#f26d6d; --red-soft:#2c1719;
  --amber:#eaa83c; --amber-soft:#2f2512;
  --blue:#6c97f0; --blue-soft:#172339;
  --shadow:0 1px 2px rgba(0,0,0,.22), 0 4px 14px rgba(0,0,0,.34);
  --shadow-lg:0 10px 34px rgba(0,0,0,.46);
}
/* رفع نامرئی‌بودن متن ورودی‌ها در دارک‌مود (آتوفیل + ویجت بومی) */
:root[data-theme="dark"]{ color-scheme:dark; }
[data-theme="dark"] .form-control,
[data-theme="dark"] .form-select,
[data-theme="dark"] textarea.form-control,
[data-theme="dark"] .otp-box{ color:var(--ink); -webkit-text-fill-color:var(--ink); background:var(--bg-soft); border-color:var(--line); }
[data-theme="dark"] .form-control:focus,
[data-theme="dark"] .form-select:focus,
[data-theme="dark"] .otp-box:focus{ background:var(--card); -webkit-text-fill-color:var(--ink); }
[data-theme="dark"] .form-control::placeholder{ color:var(--muted); -webkit-text-fill-color:var(--muted); }
[data-theme="dark"] input:-webkit-autofill,
[data-theme="dark"] input:-webkit-autofill:hover,
[data-theme="dark"] input:-webkit-autofill:focus,
[data-theme="dark"] textarea:-webkit-autofill{ -webkit-text-fill-color:var(--ink); caret-color:var(--ink); -webkit-box-shadow:0 0 0 1000px var(--bg-soft) inset; box-shadow:0 0 0 1000px var(--bg-soft) inset; }


/* دکمهٔ سوئیچ تم */
.theme-toggle i{ font-size:var(--ic-nav); }
.prof-menu-item.theme-toggle .prof-menu-ic i{ font-size:1.25rem; }
.login-card{ position:relative; }
.login-theme-toggle{ position:absolute; top:12px; inset-inline-end:12px; z-index:3; width:38px; height:38px; }

/* سطوح هاور/اکتیو با رنگ ثابت روشن ← تیره */
[data-theme="dark"] .btn-secondary:hover,
[data-theme="dark"] .day-nav:hover,
[data-theme="dark"] .rs-more:hover,
[data-theme="dark"] .rl-more:hover,
[data-theme="dark"] .dev-more:hover{ background:var(--line); color:var(--ink); }

/* کارت‌ها و لبه‌های روشن */
[data-theme="dark"] .owner-card.open{ border-color:var(--line); box-shadow:0 4px 18px rgba(0,0,0,.34); }
[data-theme="dark"] .owner-card.zebra-alt{ background:var(--bg-soft); border-color:var(--line); }
[data-theme="dark"] .buyer-receipt-form{ background:var(--bg-soft); border-color:var(--line); }
[data-theme="dark"] .empty-state .es-ic{ border-color:#5a4a1c; box-shadow:0 8px 20px rgba(0,0,0,.3); }
[data-theme="dark"] .prof-danger{ border-color:rgba(242,109,109,.4); background:rgba(242,109,109,.08); }

/* دکمهٔ ثبت فیش (در حالت روشن مشکی بود؛ در تیره طلایی می‌شود) */
[data-theme="dark"] .btn.brf-submit,
[data-theme="dark"] .btn.brf-submit:hover,
[data-theme="dark"] .btn.brf-submit:active{ background:var(--gold-grad); color:var(--on-gold); border-color:transparent; }
[data-theme="dark"] .btn.brf-submit .label i{ color:var(--on-gold); }

/* نوار مشاهده به‌جای کاربر */
[data-theme="dark"] .imper-back{ color:#fff; }

/* لبه‌های پاستلی فیش‌ها/تخصیص‌ها */
[data-theme="dark"] .receipt-line.r-acc{ border-color:rgba(52,201,138,.4); }
[data-theme="dark"] .receipt-line.r-flag,
[data-theme="dark"] .receipt-line.r-acc-flag,
[data-theme="dark"] .flagged-item{ border-color:rgba(234,168,60,.4); }
[data-theme="dark"] .acc-receipt.done,
[data-theme="dark"] .acc-receipt.done.flagged{ border-color:rgba(52,201,138,.4); }
[data-theme="dark"] .acc-receipt.flagged{ border-color:rgba(242,109,109,.4); }
[data-theme="dark"] .pdf-dl{ border-color:#5a4a1c; }
[data-theme="dark"] .pdf-dl:hover{ background:#3a2f12; }
[data-theme="dark"] .drill-close:hover{ border-color:rgba(242,109,109,.5); }

/* رفع موارد دارک‌مود: هدر/نوبار سفید، توست، بج برند، نام در صفحهٔ جزئیات */
[data-theme="dark"] .app-header{ background:rgba(21,23,28,.92); }
[data-theme="dark"] .bottom-nav{ background:rgba(21,23,28,.96); }
[data-theme="dark"] .toast-item{ background:#272b33; color:#f2f4f7; border:1px solid var(--line); }
[data-theme="dark"] .brand-badge{ background:var(--card); box-shadow:0 6px 18px rgba(0,0,0,.34); }
[data-theme="dark"] .drill-row{ color:var(--ink); }
[data-theme="dark"] .kpi-card{ color:var(--ink); }
[data-theme="dark"] .acc-receipt{ color:var(--ink); }

/* تگ‌های نیمه‌شفاف سفید روی فیش/تقویم رنگی → چیپ تیره با متن هم‌رنگ وضعیت */
[data-theme="dark"] .receipt-line.r-acc .rl-owner-tag{ background:rgba(52,201,138,.16); color:var(--green); }
[data-theme="dark"] .receipt-line.r-flag .rl-owner-tag,
[data-theme="dark"] .receipt-line.r-acc-flag .rl-owner-tag{ background:rgba(234,168,60,.16); color:var(--amber); }
[data-theme="dark"] .jcal-full .jcf-lbl{ background:rgba(0,0,0,.25); }

/* هاورها و آیکن‌های با رنگ ثابت روشن */
[data-theme="dark"] .drill-back:hover{ background:var(--line); }
[data-theme="dark"] .dev-ic.dev-os-android{ color:var(--green); }
[data-theme="dark"] .dev-ic.dev-os-windows{ color:var(--blue); }
[data-theme="dark"] .auth-link{ color:var(--blue); }
[data-theme="dark"] .combo-list{ box-shadow:var(--shadow-lg); }
[data-theme="dark"] .auth-tabs::before{ box-shadow:0 2px 8px rgba(0,0,0,.3); }

/* اسپینر: مسیر با rgba(0,0,0,.16) روی پس‌زمینهٔ تیره محو می‌شد؛ مسیر روشن می‌شود */
[data-theme="dark"] .spinner-border{ border-color:rgba(255,255,255,.18); border-top-color:currentColor; }

/* بک‌دراپ مودال: در تم تیره عمیق‌تر تا از سطوح تیره جدا بماند */
[data-theme="dark"] .modal-backdrop{ background:rgba(0,0,0,.6); }

/* بنر گیت اشتراک: پس‌زمینهٔ var(--ink) در تیره روشن می‌شد و متن سفید ناپدید؛ سطح کارت تیره */
[data-theme="dark"] .sub-gate-banner{ background:var(--card); border:1px solid var(--line); }

/* ===== خروجی PDF در حالت تیره (فقط استایل؛ ساختار/رندر pdf.js دست‌نخورده) ===== */

/* ===== مرحلهٔ ۷: رابط کاربری اشتراک ===== */
.sub-empty { text-align: center; padding: var(--space-5) var(--space-3); color: var(--muted); }
.sub-empty i { font-size: 40px; display: block; }
.sub-empty p { margin: 0; font-size: var(--fs-14); }
.sub-load { text-align: center; padding: var(--space-4); color: var(--muted); font-size: var(--fs-13); }
.sub-bdg { display: inline-flex; align-items: center; font-size: var(--fs-12); font-weight: var(--fw-semibold); padding: 2px 8px; border-radius: 999px; margin-inline-start: 6px; }
.sub-bdg-on { color: var(--green); background: var(--green-soft); }
.sub-bdg-off { color: var(--red); background: var(--red-soft); }
.sub-bdg-warn { color: var(--amber); background: var(--amber-soft); }
.sub-bdg-muted { color: var(--muted); background: var(--bg-soft); }

.sub-plan-grid { display: flex; flex-direction: column; gap: var(--space-3); }
.sub-plan-card { border: 1px solid var(--line); border-radius: var(--radius); background: var(--card); padding: var(--space-3); box-shadow: var(--shadow); }
.sub-plan-h { display: flex; align-items: center; justify-content: space-between; gap: var(--space-2); }
.sub-plan-name { font-weight: var(--fw-bold); font-size: var(--fs-16); color: var(--ink); }
.sub-plan-days { font-size: var(--fs-12); color: var(--muted); display: inline-flex; align-items: center; gap: 4px; }
.sub-plan-desc { font-size: var(--fs-13); color: var(--muted); margin-top: var(--space-1); }
.sub-plan-price { font-weight: var(--fw-extrabold); font-size: var(--fs-18); color: var(--gold-d); margin: var(--space-2) 0; }
.sub-feat-list { list-style: none; margin: 0 0 var(--space-3); padding: 0; display: flex; flex-direction: column; gap: 6px; }
.sub-feat-list li { font-size: var(--fs-13); color: var(--ink-2); display: flex; align-items: center; gap: 6px; }
.sub-feat-list li i { color: var(--green); font-size: var(--ic-inline); }

.sub-status-card { display: flex; align-items: center; gap: var(--space-3); padding: var(--space-3); border: 1px solid var(--line); border-radius: var(--radius); background: var(--gold-soft); }
.sub-status-card.sub-status-none { background: var(--bg-soft); }
.sub-status-ic { font-size: 32px; color: var(--gold-d); display: flex; }
.sub-status-none .sub-status-ic { color: var(--muted); }
.sub-status-meta { flex: 1; min-width: 0; }
.sub-status-title { font-weight: var(--fw-bold); font-size: var(--fs-15); color: var(--ink); }
.sub-status-sub { font-size: var(--fs-13); color: var(--muted); margin-top: 2px; display: flex; align-items: center; gap: 4px; }

.sub-order-list, .sub-tr-item + .sub-tr-item { display: flex; flex-direction: column; }
.sub-order-list { gap: var(--space-2); }
.sub-order-item { border: 1px solid var(--line); border-radius: var(--radius-sm); padding: var(--space-2) var(--space-3); }
.sub-order-main { display: flex; align-items: center; justify-content: space-between; gap: var(--space-2); }
.sub-order-plan { font-weight: var(--fw-semibold); color: var(--ink); font-size: var(--fs-14); }
.sub-order-sub { font-size: var(--fs-12); color: var(--muted); margin-top: 4px; }
.sub-order-amt { font-weight: var(--fw-semibold); color: var(--ink-2); }
.sub-order-disc { color: var(--green); }

.sub-tr-init { margin-bottom: var(--space-3); }
.sub-tr-sec { font-size: var(--fs-12); font-weight: var(--fw-semibold); color: var(--muted); margin: var(--space-3) 0 var(--space-2); }
.sub-tr-item { border: 1px solid var(--line); border-radius: var(--radius-sm); padding: var(--space-2) var(--space-3); margin-bottom: var(--space-2); }
.sub-tr-main { display: flex; align-items: center; justify-content: space-between; gap: var(--space-2); font-weight: var(--fw-semibold); color: var(--ink); font-size: var(--fs-14); }
.sub-tr-sub { font-size: var(--fs-12); color: var(--muted); margin-top: 4px; }

.sub-co-plan { display: flex; align-items: center; justify-content: space-between; gap: var(--space-2); padding: var(--space-2) var(--space-3); background: var(--bg-soft); border-radius: var(--radius-sm); margin-bottom: var(--space-3); }
.sub-co-name { font-weight: var(--fw-bold); color: var(--ink); }
.sub-co-days { font-size: var(--fs-12); color: var(--muted); }
.sub-co-code-row { display: flex; gap: var(--space-2); align-items: stretch; }
.sub-co-code-row .field-ic { flex: 1; }
.sub-co-note { font-size: var(--fs-12); color: var(--green); margin-top: var(--space-2); }
.sub-co-rows { margin-top: var(--space-3); border-top: 1px dashed var(--line); padding-top: var(--space-3); display: flex; flex-direction: column; gap: var(--space-2); }
.sub-co-line { display: flex; align-items: center; justify-content: space-between; font-size: var(--fs-14); color: var(--ink-2); }
.sub-co-total { font-weight: var(--fw-bold); font-size: var(--fs-16); color: var(--ink); }
.sub-co-total b { color: var(--gold-d); }

.sub-gate-banner { position: fixed; left: 50%; transform: translateX(-50%) translateY(120%); bottom: calc(var(--space-4) + env(safe-area-inset-bottom, 0px)); z-index: 1080; display: flex; align-items: center; gap: var(--space-2); max-width: 92vw; width: 420px; padding: var(--space-3); border-radius: var(--radius); background: var(--ink); color: #fff; box-shadow: var(--shadow-lg); transition: transform var(--fast) var(--bez); }
.sub-gate-banner.show { transform: translateX(-50%) translateY(0); }
.sub-gate-ic { font-size: 22px; color: var(--gold); flex: none; }
.sub-gate-msg { flex: 1; min-width: 0; font-size: var(--fs-13); line-height: var(--lh-normal); }
.sub-gate-btn { flex: none; border: none; background: var(--gold-grad); color: var(--on-gold); font-weight: var(--fw-bold); font-size: var(--fs-13); padding: 6px 12px; border-radius: var(--radius-sm); cursor: pointer; }
.sub-gate-x { flex: none; border: none; background: transparent; color: #fff; opacity: .7; cursor: pointer; font-size: 18px; display: flex; padding: 2px; }
.sub-gate-x:hover { opacity: 1; }


/* user-sub-redesign */
.sub-plan-card { position: relative; overflow: hidden; transition: transform var(--fast) var(--bez), box-shadow var(--fast) var(--bez), border-color var(--fast) var(--bez); }
.sub-plan-card:hover { transform: translateY(-2px); box-shadow: var(--shadow-lg); border-color: var(--gold); }
.sub-plan-top { display: flex; align-items: center; justify-content: space-between; gap: var(--space-2); }
.sub-plan-price-row { display: flex; align-items: baseline; gap: 6px; margin: var(--space-2) 0; }
.sub-plan-price-row .sub-plan-price { margin: 0; }
.sub-plan-per { font-size: var(--fs-12); color: var(--muted); }
.sub-plan-feat { border-color: var(--gold); box-shadow: 0 0 0 1px var(--gold) inset, var(--shadow); background: linear-gradient(180deg, var(--gold-soft), var(--card) 64%); }
.sub-plan-ribbon { position: absolute; inset-inline-start: -34px; top: 14px; transform: rotate(-45deg); background: var(--gold-grad); color: var(--on-gold); font-size: var(--fs-12); font-weight: var(--fw-bold); padding: 4px 36px; display: inline-flex; align-items: center; gap: 4px; box-shadow: var(--shadow); }
.sub-plan-ribbon i { font-size: 12px; }

.sub-hero { position: relative; border: 1px solid var(--line); border-radius: var(--radius); background: linear-gradient(150deg, var(--gold-soft), var(--card) 70%); padding: var(--space-4); text-align: center; }
.sub-hero-ic { width: 56px; height: 56px; margin: 0 auto var(--space-2); border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 30px; color: var(--gold-d); background: var(--card); box-shadow: var(--shadow); }
.sub-hero-none { background: var(--bg-soft); }
.sub-hero-none .sub-hero-ic { color: var(--muted); }
.sub-hero-title { font-weight: var(--fw-bold); font-size: var(--fs-16); color: var(--ink); }
.sub-hero-sub { font-size: var(--fs-13); color: var(--muted); margin-top: 4px; display: inline-flex; align-items: center; gap: 4px; }
.sub-hero-warn { background: linear-gradient(150deg, var(--amber-soft), var(--card) 70%); border-color: var(--amber); }
.sub-hero-warn .sub-hero-ic { color: var(--amber); }
.sub-hero-urgent { background: linear-gradient(150deg, var(--red-soft), var(--card) 70%); border-color: var(--red); }
.sub-hero-urgent .sub-hero-ic { color: var(--red); }

.sub-warn { display: flex; align-items: flex-start; gap: var(--space-2); margin-top: var(--space-2); padding: var(--space-2) var(--space-3); border-radius: var(--radius-sm); background: var(--amber-soft); color: var(--amber); border: 1px solid var(--amber); }
.sub-warn i { font-size: 20px; flex: none; margin-top: 1px; }
.sub-warn b { display: block; font-size: var(--fs-13); color: var(--ink); }
.sub-warn span { display: block; font-size: var(--fs-12); color: var(--muted); margin-top: 2px; }
.sub-warn-urgent { background: var(--red-soft); color: var(--red); border-color: var(--red); animation: subPulse 1.6s ease-in-out infinite; }
@keyframes subPulse { 0%, 100% { box-shadow: 0 0 0 0 rgba(226,59,59,.0); } 50% { box-shadow: 0 0 0 4px rgba(226,59,59,.16); } }

.sub-order-item { position: relative; }
.sub-trk { margin-top: var(--space-2); display: inline-flex; align-items: center; gap: 6px; max-width: 100%; border: 1px dashed var(--line); background: var(--bg-soft); color: var(--ink-2); border-radius: 999px; padding: 4px 10px; font-size: var(--fs-12); font-weight: var(--fw-semibold); cursor: pointer; font-family: inherit; transition: border-color var(--fast) var(--bez), color var(--fast) var(--bez); }
.sub-trk:hover { border-color: var(--gold); color: var(--gold-d); }
.sub-trk > span { direction: ltr; unicode-bidi: plaintext; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sub-trk i { font-size: 13px; flex: none; }
.sub-trk .sub-trk-cp { opacity: .7; }

.sub-ord-filters { display: flex; gap: var(--space-2); margin-bottom: var(--space-3); }
.sub-ord-filters .field-ic { flex: 1; }
.sub-ord-filters .form-select { flex: none; width: auto; min-width: 122px; }

.sub-empty-lg { padding: var(--space-6) var(--space-4); }
.sub-empty-ic { width: 68px; height: 68px; margin: 0 auto var(--space-3); border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 34px; color: var(--muted); background: var(--bg-soft); }
.sub-empty-title { font-weight: var(--fw-bold); font-size: var(--fs-16); color: var(--ink); }
.sub-empty-sub { font-size: var(--fs-13); color: var(--muted); margin-top: 6px; line-height: var(--lh-normal); max-width: 320px; margin-inline: auto; }

.sub-link-row { margin-top: var(--space-1); }