/* ==========================================================================
   سینک‌یار — هویت بصری «نخ» (v9.9.2)
   --------------------------------------------------------------------------
   این فایل آخرین لایه‌ی استایل است و دو سیستم قبلی (app.css «Meridian» و
   app-enhancements.css «v5») را که توکن‌های متضاد داشتند، یکدست می‌کند.

   مفهوم: پنل دو فروشگاه را به هم وصل می‌کند؛ پس دو رشته‌ی رنگی داریم
     لاجورد  = فروشگاه مبدأ (x.com، مرجع داده)
     زعفران  = فروشگاه مقصد (x.ir، ویترین فروش)
   این دو رشته در لوگو، نوار وضعیت بالا، پنل جریان داشبورد و مسیر منو در هم
   تنیده می‌شوند و فقط وقتی واقعاً همگام‌سازی در جریان است حرکت می‌کنند.
   بقیه‌ی رابط عمداً آرام است: سطوح تخت، خط‌های ظریف، بدون سایه‌ی تزئینی.

   رنگ دلخواه کاربر (صفحه‌ی «تم‌ها») همچنان کار می‌کند چون از --xs-brand
   می‌آید و inline style آن را بر این فایل مقدم می‌کند.
   ========================================================================== */

/* ---------- ۰. فونت: Vazirmatn متغیر، محلی (بدون CDN) ---------- */
@font-face{
  font-family:'Vazirmatn';font-style:normal;font-weight:100 900;font-display:swap;
  src:url('fonts/Vazirmatn-variable.woff2') format('woff2');
}

/* ---------- ۱. توکن‌ها (برای هر دو نام‌گذاری قدیمی) ---------- */
html[data-bs-theme]{
  --lapis:#1d3fa8;
  --saffron:#e8890c;

  --xs-brand:#1d3fa8;
  --xs-brand-2:#2c52c9;
  --xs-brand-soft:#e4eaf8;
  --xs-brand-glow:rgba(29,63,168,.18);
  --xs-xcom:var(--xs-brand);
  --xs-xcom-soft:var(--xs-brand-soft);
  --xs-xcom-hover:#15327f;
  --xs-xir:#854700;                 /* زعفران برای متن (کنتراست بالای ۵:۱) */
  --xs-xir-fill:#e8890c;            /* زعفران برای سطح و خط */
  --xs-xir-soft:#fdeed5;
  --xs-xir-hover:#653500;
  --xs-primary:var(--xs-brand);
  --xs-primary-hover:#15327f;
  --xs-on-primary:#fff;

  --xs-bg:#e9eeeb;
  --xs-bg-2:#dfe6e2;
  --xs-paper:#e9eeeb;
  --xs-surface:#fbfcfb;
  --xs-surface-2:#f1f5f3;
  --xs-surface-3:#e8eeeb;
  --xs-surface-hover:#dde5e1;
  --xs-line:#d3dcd7;
  --xs-line-strong:#b6c3bc;
  --xs-border:#d3dcd7;
  --xs-border-hover:#b6c3bc;
  --xs-border-strong:#8fa198;

  --xs-text:#13212b;
  --xs-text-2:#22343f;
  --xs-text-3:#33464f;
  --xs-muted:#586a73;
  --xs-muted-2:#475860;
  --xs-ink:#102a4c;
  --xs-ink-2:#183861;

  --xs-ok:#0b6b52;    --xs-ok-soft:#dcf1ea;
  --xs-warn:#8a5a00;  --xs-warn-soft:#fbefcf;
  --xs-bad:#b02f25;   --xs-bad-soft:#f9e1de;
  --xs-info:#0c6784;  --xs-info-soft:#dbeff6;

  /* سطوح تخت: سایه فقط برای چیزهایی که روی صفحه شناورند */
  --xs-shadow-1:none;
  --xs-shadow-sm:none;
  --xs-shadow-2:0 1px 0 var(--xs-line);
  --xs-shadow:0 1px 0 var(--xs-line);
  --xs-shadow-3:0 14px 32px -10px rgba(19,33,43,.28);
  --xs-shadow-lg:0 14px 32px -10px rgba(19,33,43,.28);
  --xs-shadow-4:0 28px 56px -14px rgba(19,33,43,.38);

  /* شعاع‌ها بر اساس نقش: کنترل < کاشی < پنل */
  --xs-r-xs:.3rem; --xs-r-sm:.45rem; --xs-r:.55rem; --xs-r-lg:.8rem; --xs-r-xl:.9rem;
  --xs-sb-w:252px; --xs-sb-mini:68px; --xs-top-h:60px;
  --xs-ease:cubic-bezier(.22,1,.36,1);

  --bs-body-bg:var(--xs-bg);
  --bs-body-color:var(--xs-text);
  --bs-border-color:var(--xs-line);
  --bs-primary:var(--xs-brand);
  --bs-primary-rgb:29,63,168;
  --bs-link-color:var(--xs-brand);
  --bs-link-hover-color:var(--xs-primary-hover);
  --bs-body-font-family:'Vazirmatn',Tahoma,system-ui,sans-serif;
  --bs-body-font-size:.9rem;
  --bs-border-radius:.55rem;
  --bs-border-radius-sm:.45rem;
  --bs-border-radius-lg:.8rem;
  --bs-border-radius-xl:.9rem;
  --bs-secondary-color:var(--xs-muted);
  --bs-emphasis-color:var(--xs-text);
  --bs-heading-color:var(--xs-text);

  /* نخ: دو رشته‌ی در هم تنیده (SVG، دوره‌ی ۱۸۰ پیکسل) */
  --braid:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 180 60'%3E%3Cpath d='M0 30C30-2 60-2 90 30S150 62 180 30' fill='none' stroke='%231d3fa8' stroke-width='3.5' stroke-linecap='round'/%3E%3Cpath d='M0 30C30 62 60 62 90 30S150-2 180 30' fill='none' stroke='%23e8890c' stroke-width='3.5' stroke-linecap='round'/%3E%3C/svg%3E");
  --braid-on-dark:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 180 60'%3E%3Cpath d='M0 30C30-2 60-2 90 30S150 62 180 30' fill='none' stroke='%239db3f7' stroke-width='3.5' stroke-linecap='round'/%3E%3Cpath d='M0 30C30 62 60 62 90 30S150-2 180 30' fill='none' stroke='%23f5a94a' stroke-width='3.5' stroke-linecap='round'/%3E%3C/svg%3E");
  --hero-bg:#1d3fa8;
}

html[data-bs-theme=dark]{
  --lapis:#9db3f7;
  --saffron:#f5a94a;

  --xs-brand:#9db3f7;
  --xs-brand-2:#b7c7fa;
  --xs-brand-soft:#1b2a52;
  --xs-brand-glow:rgba(157,179,247,.2);
  --xs-xcom-hover:#bccbfa;
  --xs-xir:#f5a94a;
  --xs-xir-fill:#f5a94a;
  --xs-xir-soft:#3a2a10;
  --xs-xir-hover:#f8c079;
  --xs-primary-hover:#bccbfa;
  --xs-on-primary:#0e1613;

  --xs-bg:#0d1512;
  --xs-bg-2:#121c18;
  --xs-paper:#0d1512;
  --xs-surface:#131d19;
  --xs-surface-2:#18251f;
  --xs-surface-3:#1e2d26;
  --xs-surface-hover:#243630;
  --xs-line:#26372f;
  --xs-line-strong:#374c43;
  --xs-border:#26372f;
  --xs-border-hover:#374c43;
  --xs-border-strong:#4d665b;

  --xs-text:#e6efea;
  --xs-text-2:#d3dfd9;
  --xs-text-3:#bccac3;
  --xs-muted:#93a69d;
  --xs-muted-2:#a7b8b0;
  --xs-ink:#0a1a30;
  --xs-ink-2:#10294a;

  --xs-ok:#4ccb9f;    --xs-ok-soft:#0f3328;
  --xs-warn:#e9b04a;  --xs-warn-soft:#3a2b0c;
  --xs-bad:#ff8c7d;   --xs-bad-soft:#3d1713;
  --xs-info:#5cc3de;  --xs-info-soft:#0e3140;

  --xs-shadow-3:0 14px 32px -10px rgba(0,0,0,.6);
  --xs-shadow-lg:0 14px 32px -10px rgba(0,0,0,.6);
  --xs-shadow-4:0 28px 56px -14px rgba(0,0,0,.75);

  --bs-primary-rgb:157,179,247;
  --braid:var(--braid-on-dark);
  --hero-bg:#16306f;
}

/* ---------- ۲. پایه ---------- */
html body{background:var(--xs-bg);color:var(--xs-text);font-family:var(--bs-body-font-family);line-height:1.7}
html body h1,
html body h2,
html body h3,
html body h4,
html body h5,
html body h6{letter-spacing:0;font-weight:800}
html body ::selection{background:color-mix(in srgb,var(--xs-xir-fill) 35%,transparent)}
html body :focus-visible{outline:2px solid var(--xs-brand);outline-offset:2px;border-radius:.35rem}
html body a:not(.btn):not(.nav-link):not(.dropdown-item):not(.list-group-item):not(.chip){text-underline-offset:4px}
html body a:not(.btn):not(.nav-link):not(.dropdown-item):not(.list-group-item):not(.chip):hover{text-decoration:underline}
html body .text-muted,
html body .text-body-secondary{color:var(--xs-muted)!important}

/* ---------- ۳. قاب اصلی ---------- */
html body .sidebar{background:var(--xs-surface);border-inline-end:1px solid var(--xs-line);box-shadow:none}
html body .brand{height:var(--xs-top-h);padding:0 1.1rem;border-bottom:1px solid var(--xs-line);font-size:1rem;letter-spacing:0}
html body .brand small{letter-spacing:0;font-weight:500}
html body .brand-mark{
  width:36px;height:36px;border-radius:.6rem;background:var(--xs-brand);box-shadow:none;
}
html body .brand-mark i:first-child{width:19px;height:19px;top:8.5px;inset-inline-start:6px;border:2.5px solid #fff;background:transparent}
html body .brand-mark i:last-child{width:19px;height:19px;top:8.5px;inset-inline-end:6px;background:var(--xs-xir-fill);box-shadow:none;mix-blend-mode:normal}
html[data-bs-theme=dark] body .brand-mark{background:#2a4396}
html[data-bs-theme=dark] body .brand-mark i:first-child{border-color:#e9eefd}

/* گروه‌های منو: جمله‌ای، بدون حروف بزرگ و بدون پس‌زمینه‌ی گرادیانی */
html body .nav-accordion{border-radius:.5rem;margin-bottom:.1rem}
html body .nav-accordion:hover{background:transparent}
html body .sidebar .nav-group-toggle{
  padding:.55rem .6rem;font-size:.78rem;font-weight:700;letter-spacing:0;text-transform:none;
  color:var(--xs-muted-2);border-radius:.5rem;background:transparent;
}
html body .sidebar .nav-group-toggle:hover{background:var(--xs-surface-2);color:var(--xs-text)}
html body .nav-accordion.open .nav-group-toggle{background:transparent;color:var(--xs-text)}
html body .nav-accordion.open .nav-group-toggle::before{display:none}

/* مسیر منو: یک رشته‌ی لاجوردی کنار آیتم‌ها؛ گره‌ی زعفرانی روی صفحه‌ی فعلی می‌نشیند */
html body .sidebar .nav-accordion.open .nav-collapse{
  padding:.1rem .2rem .4rem 0;padding-inline-start:1.1rem;
  background:linear-gradient(var(--xs-brand),var(--xs-brand)) no-repeat right .4rem top .35rem / 2px calc(100% - .7rem);
}
html body .sidebar .nav-link{
  padding:.5rem .65rem;border-radius:.5rem;font-size:.84rem;font-weight:500;gap:.65rem;
  color:var(--xs-text-2);margin-bottom:0;
}
html body .sidebar .nav-link i{font-size:1rem;width:1.15rem;color:var(--xs-muted)}
html body .sidebar .nav-link:hover{background:var(--xs-surface-2);transform:none;color:var(--xs-text)}
html body .sidebar .nav-link:hover i{color:var(--xs-brand)}
html body .sidebar .nav-link.active{background:var(--xs-brand-soft);color:var(--xs-brand);font-weight:700}
html[data-bs-theme=dark] body .sidebar .nav-link.active{color:#d3defc}
html body .sidebar .nav-link.active i{color:var(--xs-brand)}
html body .sidebar .nav-link.active::before{
  content:'';position:absolute;inset-inline-start:calc(-.7rem - 4px);top:50%;bottom:auto;
  width:10px;height:10px;border-radius:50%;transform:translateY(-50%);
  background:var(--xs-xir-fill);box-shadow:0 0 0 3px var(--xs-surface);
}
html body .nav-link .nav-count{background:var(--xs-bad-soft);color:var(--xs-bad)}

html body .sidebar-foot{border-top:1px solid var(--xs-line)}
html body .sf-user .avatar{background:var(--xs-brand);color:var(--xs-on-primary)}
html body .sidebar-foot .btn:hover{background:var(--xs-bad-soft);color:var(--xs-bad)}
html body .sb-toggle{background:var(--xs-surface);border:1px solid var(--xs-line-strong);box-shadow:none}
html body .sb-toggle:hover{color:var(--xs-brand);border-color:var(--xs-brand)}

/* حالت جمع‌شده: فلای‌اوت قبلی توسط overflow بریده می‌شد؛ حالا همه‌ی آیتم‌ها به‌صورت آیکن دیده می‌شوند */
@media(min-width:992px){
  html[data-sb=mini] body .nav-accordion{overflow:visible;padding:0}
  html[data-sb=mini] body .sidebar .nav-group-toggle{height:1.1rem;padding:0;position:relative;font-size:0;background:transparent}
  html[data-sb=mini] body .sidebar .nav-group-toggle::after{content:'';position:absolute;inset-inline:1.2rem;top:50%;border-top:1px solid var(--xs-line)}
  html[data-sb=mini] body .sidebar .nav-group-toggle .chev{display:none}
  html[data-sb=mini] body .sidebar .nav-collapse,
html[data-sb=mini] body .sidebar .nav-accordion.open .nav-collapse{
    display:block;position:static;max-height:none;min-width:0;padding:0;margin:0;
    background:none;border:0;box-shadow:none;overflow:visible;
  }
  html[data-sb=mini] body .sidebar .nav-link{justify-content:center;padding:.6rem 0}
  html[data-sb=mini] body .sidebar .nav-link.active::before{inset-inline-start:-.2rem;width:3px;height:55%;border-radius:3px;box-shadow:none}
}

/* ---------- ۴. نوار بالا و پل وضعیت ---------- */
html body .topbar{height:var(--xs-top-h);background:color-mix(in srgb,var(--xs-bg) 86%,transparent);border-bottom:1px solid var(--xs-line)}
html body .topbar h1{font-size:1.1rem;font-weight:800;letter-spacing:0}
html body .topbar .tb-crumb{color:var(--xs-muted);font-weight:500}
html body .tb-search,
html body .icon-btn{border-radius:.55rem;background:var(--xs-surface);border:1px solid var(--xs-line-strong)}
html body .tb-search{height:38px;border-color:var(--xs-line)}
html body .icon-btn{width:38px;height:38px}
html body .icon-btn:hover,
html body .tb-search:hover{background:var(--xs-surface-2);border-color:var(--xs-border-strong)}
html body .icon-btn .badge{border-color:var(--xs-bg)}
html body .avatar{background:var(--xs-brand);color:var(--xs-on-primary);box-shadow:0 0 0 2px var(--xs-bg),0 0 0 3px var(--xs-line-strong)}
html[data-bs-theme=dark] body .avatar{color:#0d1512}

html body .bridge{background:var(--xs-surface);border:1px solid var(--xs-line);border-radius:.55rem;height:38px;padding:.2rem;gap:.1rem}
html body .site{border-radius:.4rem;padding:.25rem .65rem}
html body .site.xcom{background:var(--xs-brand-soft);color:var(--xs-brand)!important}
html body .site.xir{background:var(--xs-xir-soft);color:var(--xs-xir)!important}
html body .site.off{box-shadow:inset 0 0 0 1px var(--xs-line-strong)}
/* آیکن فلش، جایش را به نخِ در هم تنیده می‌دهد؛ وقتی هر دو سایت وصل‌اند نخ حرکت می‌کند */
html body .bridge .arrows{
  font-size:0;display:inline-block;width:38px;height:14px;padding:0;margin-inline:.1rem;
  background:var(--braid) 0 center / 38px 13px repeat-x;opacity:.45;
}
html body .bridge:not(:has(.site.off)) .arrows{opacity:1;animation:xs-thread 2.4s linear infinite}
@keyframes xs-thread{from{background-position-x:0}to{background-position-x:-38px}}
html body .bridge-meta{color:var(--xs-muted)}

html body .page{padding:1.5rem 1.6rem}
html body .page-head h2{font-size:1.3rem;letter-spacing:0}

/* ---------- ۵. سطوح ---------- */
html body .card{background:var(--xs-surface);border:1px solid var(--xs-line);border-radius:var(--xs-r-lg);box-shadow:none}
html body .card-header{border-bottom:1px solid var(--xs-line);font-weight:700;padding:.85rem 1.15rem;border-radius:var(--xs-r-lg) var(--xs-r-lg) 0 0!important}
html body .list-group-item{border-color:var(--xs-line)}
html body .dropdown-menu,
html body .modal-content,
html body .popover{
  background:var(--xs-surface);border:1px solid var(--xs-line-strong);border-radius:var(--xs-r-lg);box-shadow:var(--xs-shadow-3);
}
html body .dropdown-item{border-radius:.4rem}
html body .dropdown-item:hover,
html body .dropdown-item:focus{background:var(--xs-surface-2);color:var(--xs-text)}
html body .modal-header,
html body .modal-footer{border-color:var(--xs-line)}

/* ---------- ۶. جدول: ظاهر دفتر حساب ---------- */
html body .table{--bs-table-hover-bg:color-mix(in srgb,var(--xs-brand) 6%,transparent);--bs-table-striped-bg:transparent}
html body .table thead th{
  background:var(--xs-surface-2);color:var(--xs-text-3);font-size:.78rem;font-weight:700;
  letter-spacing:0;text-transform:none;
  border-bottom:3px double var(--xs-line-strong);
}
html body .table>:not(caption)>*>*{padding:.7rem 1rem}
html body .table-hover>tbody>tr:hover>*{background:color-mix(in srgb,var(--xs-brand) 6%,transparent)}
html body .table td,
html body .table th{font-variant-numeric:tabular-nums}

/* ---------- ۷. دکمه‌ها و فرم‌ها ---------- */
html body .btn{--bs-btn-border-radius:.55rem;font-weight:600;letter-spacing:0}
html body .btn-sm{--bs-btn-border-radius:.45rem}
html body .btn-lg{--bs-btn-border-radius:.65rem}
html body .btn-primary{
  --bs-btn-bg:var(--xs-brand);--bs-btn-border-color:var(--xs-brand);--bs-btn-color:var(--xs-on-primary);
  --bs-btn-hover-bg:var(--xs-primary-hover);--bs-btn-hover-border-color:var(--xs-primary-hover);--bs-btn-hover-color:var(--xs-on-primary);
  --bs-btn-active-bg:var(--xs-primary-hover);--bs-btn-active-border-color:var(--xs-primary-hover);--bs-btn-active-color:var(--xs-on-primary);
  --bs-btn-disabled-bg:var(--xs-brand);--bs-btn-disabled-border-color:var(--xs-brand);--bs-btn-disabled-color:var(--xs-on-primary);
  --bs-btn-focus-shadow-rgb:29,63,168;box-shadow:none;
}
html[data-bs-theme=dark] body .btn-primary{--bs-btn-color:#0d1512;--bs-btn-hover-color:#0d1512;--bs-btn-active-color:#0d1512;--bs-btn-disabled-color:#0d1512}
html body .btn-outline-primary{--bs-btn-color:var(--xs-brand);--bs-btn-border-color:var(--xs-line-strong);--bs-btn-hover-bg:var(--xs-brand-soft);--bs-btn-hover-color:var(--xs-brand);--bs-btn-hover-border-color:var(--xs-brand);--bs-btn-active-bg:var(--xs-brand-soft);--bs-btn-active-color:var(--xs-brand);--bs-btn-active-border-color:var(--xs-brand)}
html body .btn-site-xcom{background:var(--xs-brand);border-color:var(--xs-brand);color:var(--xs-on-primary)}
html body .form-control,
html body .form-select{border-radius:.55rem;background-color:var(--xs-surface);border-color:var(--xs-line-strong)}
html body .form-control:focus,
html body .form-select:focus{border-color:var(--xs-brand);box-shadow:0 0 0 3px var(--xs-brand-glow)}
html body .form-control-sm,
html body .form-select-sm{border-radius:.45rem}
html body .form-check-input:checked{background-color:var(--xs-brand);border-color:var(--xs-brand)}
html body .nav-tabs .nav-link.active{color:var(--xs-brand);border-bottom-color:var(--xs-xir-fill);border-bottom-width:3px}
html body .nav-pills{border-radius:.6rem}
html body .range-pills .btn{border-radius:.5rem}
html body .badge{letter-spacing:0}

/* ---------- ۸. کاشی‌های آمار: لبه‌ی رنگی نشان می‌دهد این عدد از کجاست ---------- */
html body .kpi,
html body .stat-card,
html body .ss-stat,
html body .wr-tile{
  border-radius:var(--xs-r);box-shadow:none;background:var(--xs-surface);
  padding:1rem 1.15rem 1rem 1.15rem;padding-inline-start:1.35rem;
}
html body .kpi:hover,
html body .stat-card:hover{transform:none;box-shadow:none;border-color:var(--xs-border-strong)}
html body .kpi::before{content:'';position:absolute;inset-inline-start:0;top:14px;bottom:14px;width:4px;border-radius:0 4px 4px 0;background:var(--xs-brand)}
html body [dir=rtl] .kpi::before{border-radius:4px 0 0 4px}
html body .kpi.xir::before{background:var(--xs-xir-fill)}
html body .kpi.ok::before{background:var(--xs-ok)}
html body .kpi.warn::before{background:var(--xs-warn)}
html body .kpi.bad::before{background:var(--xs-bad)}
html body .stat-card::before{width:4px;top:14px;bottom:14px;border-radius:4px}
html body .kpi .k-ico{width:auto;height:auto;background:transparent!important;font-size:1.05rem;border-radius:0}
html body .kpi .k-label{color:var(--xs-muted-2);font-weight:600}
html body .kpi .k-val{font-size:2rem;font-weight:500;letter-spacing:0;line-height:1.15}
html body .stat-card .value,
html body .sp-node .count,
html body .report-kpi .kpi .num{letter-spacing:0;font-weight:500}
html body .kpi .k-foot a{color:var(--xs-brand)}

/* ---------- ۹. بنر اصلی و پنل جریان: جای اصلی نخ ---------- */
html body .hero,
html body .ss-hero,
html body .wr-hero,
html body .ord-hero{
  background:var(--hero-bg);border-radius:var(--xs-r-lg);color:#fff;overflow:hidden;
}
html body .hero{padding:1.6rem 1.7rem 3.4rem}
html body .hero::after{
  content:'';position:absolute;inset:auto 0 0 0;height:46px;background:var(--braid-on-dark) 0 center / 180px 46px repeat-x;
  opacity:.9;mask-image:none;-webkit-mask-image:none;pointer-events:none;
}
html body .hero h2{font-size:1.45rem;letter-spacing:0;font-weight:800}
html body .hero p{color:rgba(255,255,255,.8)}
html body .hero .btn-solid{background:#f5a94a;color:#1c1203;border:0}
html body .hero .btn-solid:hover{background:#f8bd72;color:#1c1203}
html body .hero .btn-light-glass{background:transparent;border:1px solid rgba(255,255,255,.45);color:#fff;backdrop-filter:none}
html body .hero .btn-light-glass:hover{background:rgba(255,255,255,.12);color:#fff}

html body .sp-node.xcom{background:linear-gradient(to left,transparent,var(--xs-brand-soft) 140%)}
html body .sp-node.xir{background:linear-gradient(to right,transparent,var(--xs-xir-soft) 140%)}
html body .sp-node .count{font-size:2.1rem}
html body .sp-lane{border-inline:1px solid var(--xs-line);gap:.4rem}
html body .sp-lane .rail{
  max-width:none;width:100%;height:28px;border-radius:0;overflow:visible;opacity:.4;
  background:var(--braid) 0 center / 90px 28px repeat-x;
}
html body .sp-lane.live .rail{opacity:1;animation:xs-thread-lane 1.8s linear infinite}
html body .sp-lane.live .rail::after{display:none}
@keyframes xs-thread-lane{from{background-position-x:0}to{background-position-x:-90px}}
html body .sp-foot{background:var(--xs-surface-2)}

/* ---------- ۱۰. صفحه‌ی ورود ---------- */
html body .login-side{background:var(--hero-bg)}
html body .login-side::before{
  inset:auto 0 22% 0;height:120px;background:var(--braid-on-dark) 0 center / 360px 120px repeat-x;
  mask-image:none;-webkit-mask-image:none;opacity:.55;
}
html body .login-mid h1{letter-spacing:0;font-weight:800}
html body .bridge-art .c{backdrop-filter:none}
html body .bridge-art .c.a{background:#2d4fc0;border:2px solid #fff;box-shadow:none}
html body .bridge-art .c.b{background:#e8890c;border:2px solid #fff;box-shadow:none;color:#1c1203}
html body .login-perks i{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.22);border-radius:.5rem}
html body .login-form{background:var(--xs-bg)}
html body .login-card{border-radius:var(--xs-r-xl);box-shadow:none;border:1px solid var(--xs-line-strong)}
html body .login-card .lc-head h2{letter-spacing:0}

/* ---------- ۱۱. موبایل ---------- */
html body .mobile-nav{background:color-mix(in srgb,var(--xs-surface) 94%,transparent);border-top:1px solid var(--xs-line)}
html body .mobile-nav .nav-item.active{color:var(--xs-brand)!important}
html body .mobile-nav .nav-item.active::before{background:var(--xs-xir-fill);height:3px}
@media(max-width:991px){
  html body .page{padding:1rem}
  html body .hero{padding:1.2rem 1.2rem 3rem}
}


/* ---------- ۱۳. خنثی‌سازی تضادهای لایه‌های قبلی ---------- */
html body .sidebar .brand{margin:0;padding:0 1.1rem;border-radius:0;background:transparent;border:0;border-bottom:1px solid var(--xs-line);gap:.75rem}
html body .sidebar .brand:hover{background:var(--xs-surface-2)}
html body .sidebar .brand span{font-size:1rem;font-weight:800;line-height:1.3}
html body .sidebar .brand small{color:var(--xs-muted);font-size:.7rem;font-weight:500;margin-top:.1rem}
html body .brand-mark i{margin:0;display:block}
html body .page>.card,
html body .page>.row,
html body .page>.alert,
html body .page>.hero,
html body .page>.ss-hero,
html body .page>.wr-hero,
html body .page>.kpi-grid,
html body .page>.page-head,
html body .dash-widget{animation:none}
html body .card:hover{box-shadow:none;border-color:var(--xs-line)}
html body .hero{border:0;box-shadow:none;color:#fff}
html body .hero h2{color:#fff}
html body .hero .muted{color:rgba(255,255,255,.75)}
html body .kpi-grid{grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:.85rem}

html body .sync-panel{grid-template-columns:1fr minmax(130px,190px) 1fr;gap:0;padding:0;align-items:stretch}
html body .sp-node{text-align:start;padding:1.35rem 1.5rem;border:0;border-radius:0;transition:none}
html body .sp-node.xcom,
html body .sp-node.xir{border:0}
html body .sp-node:hover{box-shadow:none}
html body .sp-node .site{border-radius:.4rem;font-size:.76rem;padding:.25rem .65rem}
html body .sp-lane,
html body .sp-lane.live{background:var(--xs-surface);border:0;border-radius:0;border-inline:1px solid var(--xs-line);padding:1rem .5rem}
html body .sp-lane .rail,
html body .sp-lane.live .rail{
  height:28px;margin:0;border-radius:0;background:var(--braid) 0 center / 90px 28px repeat-x;
}
html body .sp-lane .rail{opacity:.4}
html body .sp-lane.live .rail{opacity:1;animation:xs-thread-lane 1.8s linear infinite}
html body .sp-foot{display:grid;grid-template-columns:repeat(4,1fr);padding:0;border:0;border-top:1px solid var(--xs-line);border-radius:0;margin-top:0;background:var(--xs-surface-2)}
html body .sp-foot span{border-inline-end:1px solid var(--xs-line);padding:.8rem 1rem;font-size:.76rem}
html body .sp-foot span:last-child{border-inline-end:0}
html body .sp-foot b{font-size:1rem;margin-top:.1rem}
@media(max-width:767px){
  html body .sync-panel{grid-template-columns:1fr}
  html body .sp-lane,
html body .sp-lane.live{border-inline:0;border-block:1px solid var(--xs-line)}
  html body .sp-foot{grid-template-columns:repeat(2,1fr)}
}

/* ---------- ۱۲. حرکت: فقط وقتی کاربر اجازه داده ---------- */
@media(prefers-reduced-motion:reduce){
  html body .bridge:not(:has(.site.off)) .arrows,
html body .sp-lane.live .rail{animation:none}
}

/* ---------- ۱۴. اصلاحات نهایی (پس از بررسی تصویری) ---------- */
html body .brand-mark i{border-radius:50%}
html body .sp-node .site{display:inline-flex;align-items:center;margin-bottom:.4rem}
html body .sb-scroll::after{display:none}
html body .sb-toggle{top:50%;transform:translateY(-50%);width:26px;height:26px;border-radius:.45rem}

/* ورود: نخ فقط یک نوار پایین پنل است و روی متن نمی‌افتد */
html body .login-side{padding-bottom:7rem}
html body .login-side::before{inset:auto 0 0 0;height:72px;background:var(--braid-on-dark) 0 center / 216px 72px repeat-x;opacity:1}
html body .login-top .brand-mark{background:rgba(255,255,255,.16)}
html body .login-mid h1{max-width:none;font-size:2.15rem;line-height:1.5;text-wrap:balance}
html body .login-mid p{text-wrap:pretty}
html body .bridge-art .c{width:104px;height:104px;font-size:.86rem}
html body .bridge-art .c.b{margin-inline-start:-16px}

/* ==========================================================================
   پالایش v9.9.3 — کم‌کردن تزئین، نگه‌داشتن اطلاعات
   • نوار نخِ هیرو باریک‌تر شد: نخ فقط امضاست، نه کاغذدیواری.
   • حاشیه‌ی رنگیِ کنار کاشی‌ها حذف شد؛ وضعیت با یک نقطه‌ی کوچک کنار عنوان می‌آید.
   • گره‌های پنل همگام‌سازی رنگ تخت دارند، نه گرادیان.
   ========================================================================== */
html body .hero{padding:1.5rem 1.7rem 3rem}
html body .hero::after{height:26px;background-size:104px 26px;opacity:.9}
@media(max-width:767.98px){html body .hero{padding:1.2rem 1.2rem 2.6rem}}

html body .kpi::before{content:none}
html body .kpi .k-label{display:inline-flex;align-items:center;gap:.45rem}
html body .kpi .k-label::before{
  content:'';width:8px;height:8px;border-radius:50%;flex-shrink:0;background:var(--xs-brand);
}
html body .kpi.xir .k-label::before{background:var(--xs-xir-fill)}
html body .kpi.ok .k-label::before{background:var(--xs-ok)}
html body .kpi.warn .k-label::before{background:var(--xs-warn)}
html body .kpi.bad .k-label::before{background:var(--xs-bad)}
html body .kpi .k-ico{color:var(--xs-muted)!important}

html body .sp-node.xcom{background:color-mix(in srgb,var(--xs-brand-soft) 55%,var(--xs-surface))}
html body .sp-node.xir{background:color-mix(in srgb,var(--xs-xir-soft) 55%,var(--xs-surface))}