/* ============================================================================
   پوستهٔ «وب‌سرویس» برای صفحه‌های بی‌پوستهٔ پنل — ۱۴۰۵/۰۷/۱۸
   ============================================================================
   گفتگو، صفحهٔ اول، ورود، شرایط و بازگشت از بانک روی `theme-faraz.css` اند،
   نه روی پنلِ نو. همان کاری که `next/ws.css` با توکن‌های `--pn-*` می‌کند،
   این‌جا با توکن‌های `--fz-*`: رنگ، فونت، شعاع، سایه و جدولِ CRM.

   🔴 فقط روی `body.ws` اثر دارد و فقط وقتی بار می‌شود که `ws_legacy` روشن
   باشد (`_ws_legacy` در backend/main.py) — برگشت همان ثابتِ `UI_DEFAULT_SKIN`.

   رنگ‌ها همان‌اند که از webservice.ir اندازه گرفته شد (ws.css): سرمه‌ای
   ‎#0b2340، آبیِ تیره ‎#0f3b6e، آبی ‎#2487ce، فیروزه‌ای ‎#0ea5a4.
   ⚠️ دکمهٔ پُر با خودِ ‎#2487ce نیست (سفید رویش ۳٫۹)؛ پلهٔ ۶۰۰ ‎#1c6fa8 است.
*/

/* 🔴 ایران‌یکان با ارقامِ فارسی — ۱۴۰۵/۰۷/۲۶، همان فونتِ CRM و webservice.ir
   (فایل‌ها از `assets/fonts/iranyekan/` ِ مخزنِ webservice؛ لایسنسِ پروژه). نسخهٔ
   «fanum» رقم‌های لاتین را فارسی می‌کشد، پس دیگر خانوادهٔ دوتکه (وزیرمتن +
   ارقامِ ایران‌سنس) لازم نیست. نامِ `WSFont` عمداً ماند تا هیچ ارجاعی عوض نشود. */
@font-face {
  font-family: 'WSFont';
  src: url('/static/fonts/iranyekan/iranyekanweblightfanum.woff') format('woff');
  font-weight: 300; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'WSFont';
  src: url('/static/fonts/iranyekan/iranyekanwebregularfanum.woff') format('woff');
  font-weight: 400; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'WSFont';
  src: url('/static/fonts/iranyekan/iranyekanwebmediumfanum.woff') format('woff');
  font-weight: 500; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'WSFont';
  src: url('/static/fonts/iranyekan/iranyekanwebboldfanum.woff') format('woff');
  font-weight: 600; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'WSFont';
  src: url('/static/fonts/iranyekan/iranyekanwebboldfanum.woff') format('woff');
  font-weight: 700; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'WSFont';
  src: url('/static/fonts/iranyekan/iranyekanwebextraboldfanum.woff') format('woff');
  font-weight: 800; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'WSFont';
  src: url('/static/fonts/iranyekan/iranyekanwebblackfanum.woff') format('woff');
  font-weight: 900; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'WSLogo';
  src: url('/static/fonts/ws-logo.woff2') format('woff2');
  font-display: block;
}

/* ---------- توکن‌ها ---------- */
body.ws {
  --ws-navy: #0b2340;
  --ws-deep: #0f3b6e;
  --ws-blue: #2487ce;
  --ws-teal: #0ea5a4;
  --ws-hero: linear-gradient(135deg, #0b2340 0%, #0f3b6e 50%, #0e6f86 100%);

  --fz-font: 'WSFont', system-ui, sans-serif;

  --fz-bg: #f2f7fc;
  --fz-bg-deep: #e9f1f9;
  --fz-surface: #ffffff;
  --fz-surface-2: #f5f9fd;
  --fz-border: #e3eaf2;
  --fz-border-strong: #cfdae6;
  --fz-field-border: #6f8197;
  --fz-text: #1b2b44;
  --fz-text-soft: #4f5f75;
  --fz-text-faint: #56677d;

  --fz-brand-50: #eef6fd;
  --fz-brand-100: #d8eaf8;
  --fz-brand-200: #b3d6f1;
  --fz-brand-300: #82bce6;
  --fz-brand-400: #4f9ed9;
  --fz-brand-500: #2487ce;
  --fz-brand-600: #1c6fa8;
  --fz-brand-700: #175b8b;
  --fz-brand-800: #134a72;
  --fz-brand-900: #0f3b6e;
  --fz-brand-950: #0b2340;

  --fz-radius: .625rem;
  --fz-radius-lg: .75rem;
  --fz-radius-xl: 1rem;

  --fz-shadow-sm: 0 1px 2px rgba(18, 66, 101, .06);
  --fz-shadow: 0 2px 15px rgba(18, 66, 101, .08);
  --fz-shadow-lg: 0 14px 36px rgba(11, 35, 64, .22);

  --fz-sidebar-bg: #ffffff;
  --fz-header-bg: #f5f9fd;

  font-size: 14px;
}
html.dark body.ws {
  --fz-bg: #0b1626;
  --fz-bg-deep: #08111e;
  --fz-surface: #12233a;
  --fz-surface-2: #172b45;
  --fz-border: #22344d;
  --fz-border-strong: #33496a;
  --fz-text: #e8eef6;
  --fz-text-soft: #a9b8cc;
  --fz-text-faint: #8fa1b8;
  --fz-brand-400: #6fb3e6;
  --fz-brand-500: #4fa3e0;
  --fz-brand-600: #6fb3e6;
  --fz-brand-700: #8cc3ec;
  --fz-brand-800: #a9d2f1;
  --fz-sidebar-bg: #0e1d31;
  --fz-header-bg: #0e1d31;
}

/* فونتِ بدنه: theme-faraz آن را مستقیم روی body می‌نویسد، نه با توکن */
body.ws, body.ws button, body.ws input, body.ws select, body.ws textarea {
  font-family: var(--fz-font);
}

/* ---------- نوارِ بالا: همان گرادیانِ سرمه‌ای ِ سایدبارِ پنل ---------- */
body.ws .fz-topbar {
  background: linear-gradient(100deg, #0b2340 0%, #0f3b6e 70%, #0e4a6e 100%);
  border-bottom: 0;
  color: #fff;
}
body.ws .fz-topbar .fz-brand-mark {
  background: linear-gradient(135deg, var(--ws-blue), var(--ws-teal));
  color: #fff;
}
body.ws .fz-brand-name {
  font-family: 'WSLogo', var(--fz-font);
  font-weight: 400;
  font-size: 1.55rem;
  line-height: 1.05;
  letter-spacing: 0;
}
body.ws .fz-topbar .fz-brand-name { color: #fff; }
body.ws .fz-topbar .topnav-link { color: rgba(255, 255, 255, .8); }
body.ws .fz-topbar .topnav-link:hover { background: rgba(255, 255, 255, .08); color: #fff; }
body.ws .fz-topbar .topnav-link.active {
  background: rgba(255, 255, 255, .14); color: #fff;
  box-shadow: inset 0 -2px 0 var(--ws-teal);
}
body.ws .fz-topbar .fz-icon-btn { color: rgba(255, 255, 255, .85); background: transparent; border-color: rgba(255, 255, 255, .18); }
body.ws .fz-topbar .fz-icon-btn:hover { background: rgba(255, 255, 255, .1); color: #fff; }
body.ws .fz-topbar .fz-topbar-user { color: #fff; }
body.ws .fz-topbar .user-mark { background: #0a7c7b; color: #fff; }
body.ws .fz-topbar .credit-chip {
  background: rgba(255, 255, 255, .12); color: #fff; border-color: rgba(255, 255, 255, .22);
}

/* ---------- دکمه و کارت ---------- */
body.ws .fz-btn-primary {
  background: var(--fz-brand-600); border-color: var(--fz-brand-600); color: #fff;
  background-image: none; box-shadow: none;
}
body.ws .fz-btn-primary:hover { background: var(--fz-brand-700); border-color: var(--fz-brand-700); color: #fff; }
html.dark body.ws .fz-btn-primary { background: #1c6fa8; border-color: #1c6fa8; color: #fff; }
body.ws .fz-card { box-shadow: var(--fz-shadow); border-color: #e5e7eb; }
html.dark body.ws .fz-card { border-color: var(--fz-border); }

/* ---------- جدول — عینِ CRM (‎.table و ‎.wk-table در window.css) ---------- */
body.ws .fz-table { font-size: 13px; line-height: 1.5; }
body.ws .fz-table th, body.ws .fz-table td { text-align: right; }
body.ws .fz-table thead th {
  padding: 8px 12px;
  background: #fbfcfe;
  border-bottom: 1px solid rgba(15, 23, 42, .10);
  font-size: 12px; font-weight: 500; color: #64748b;
}
body.ws .fz-table tbody td { padding: 8px 12px; border-bottom-color: #eef1f5; }
body.ws .fz-table tbody tr:hover > td { background: #f5f8fd; }
html.dark body.ws .fz-table thead th { background: var(--fz-surface-2); color: var(--fz-text-soft); border-bottom-color: var(--fz-border); }
html.dark body.ws .fz-table tbody td { border-bottom-color: var(--fz-border); }
html.dark body.ws .fz-table tbody tr:hover > td { background: var(--fz-surface-2); }

/* ---------- گفتگو ---------- */
body.ws .chat-list { background: #f6f9fc; border-inline-end-color: var(--fz-border); }
html.dark body.ws .chat-list { background: var(--fz-sidebar-bg); }
body.ws .new-chat-ico { background: linear-gradient(135deg, var(--ws-blue), var(--ws-teal)); }
body.ws .conv-item.active { background: #e3eefa; color: var(--ws-deep); box-shadow: inset -3px 0 0 var(--ws-blue); }
html.dark body.ws .conv-item.active,
html.dark body.ws .drawer-link.active { background: rgba(79, 163, 224, .16); color: #8cc3ec; }
html.dark body.ws .new-chat:hover { background: rgba(79, 163, 224, .14); }
body.ws .md a { color: var(--fz-brand-600); }

/* ---------- صفحهٔ اول: هیروی webservice.ir ---------- */
body.ws .landing { max-width: none; padding: 0 0 4rem; }
body.ws .hero {
  background: var(--ws-hero);
  color: #fff;
  padding: 4.5rem 1.25rem 6.5rem;
}
body.ws .hero h1 { color: #fff; }
body.ws .hero .lede { color: rgba(255, 255, 255, .85); }
body.ws .hero .fz-sub { color: rgba(255, 255, 255, .75); }
body.ws .hero .fz-btn-primary { background: #fff; border-color: #fff; color: var(--ws-deep); }
body.ws .hero .fz-btn-primary:hover { background: var(--ws-teal); border-color: var(--ws-teal); color: #fff; }
body.ws .hero .fz-btn-soft { background: rgba(255, 255, 255, .12); border-color: rgba(255, 255, 255, .3); color: #fff; }
body.ws .hero .fz-btn-soft:hover { background: rgba(255, 255, 255, .2); color: #fff; }
/* کارت‌ها روی لبهٔ هیرو، هرکدام با لبهٔ پایینِ رنگی — مثلِ چهار کارتِ سایت */
body.ws .landing > .cards,
body.ws .landing > .landing-foot { max-width: 62rem; margin-inline: auto; padding-inline: 1.25rem; }
body.ws .landing > .cards { margin-top: -3.5rem; position: relative; }
/* ⚠️ کارتِ یادداشت padding ِ خودش (p-5) را دارد؛ پس فقط عرض، نه padding */
body.ws .landing > .note { max-width: 59.5rem; width: calc(100% - 2.5rem); margin-inline: auto; }
body.ws .cards .fz-card { border-bottom: 3px solid var(--ws-blue); box-shadow: var(--fz-shadow-lg); }
body.ws .cards .fz-card:nth-child(2) { border-bottom-color: var(--ws-teal); }
body.ws .cards .fz-card:nth-child(3) { border-bottom-color: #16a34a; }
body.ws .cards h2, body.ws .note h2 { color: var(--ws-deep); }
html.dark body.ws .cards h2, html.dark body.ws .note h2 { color: var(--fz-text); }

/* ---------- ورود: قابِ کناری با همان گرادیان ---------- */
body.ws .login-art { background: var(--ws-hero) !important; }

/* ---------- فرم ---------- */
/* 🔴 حاشیهٔ ورودی تنها نشانهٔ «این‌جا بنویس» است (زمینه‌اش همان سفیدِ کارت)؛
   theme-faraz آن را با `--fz-border` می‌کشید و فقط ۱٫۲ می‌داد — در پوستهٔ
   قبلی هم همین بود (panel_probe روی /login گرفت). */
body.ws .fz-input { border-color: var(--fz-field-border); border-radius: .5rem; }
body.ws .fz-input:focus { border-color: var(--ws-blue); box-shadow: 0 0 0 3px rgba(36, 135, 206, .18); }
/* قرمزِ خطا روی سفید ۳٫۸ می‌داد (ستارهٔ «الزامی» و پیامِ خطای ورود) */
body.ws { --fz-danger: #c62f38; }
html.dark body.ws { --fz-danger: #ff8a90; }
/* تراشهٔ «انتخابِ مدل» در حالتِ تاریک: ته‌رنگِ فیروزه‌ایِ ثابتِ chat.css زیرِ
   مرزِ آبی فقط ۲٫۸۴ می‌داد (کمینهٔ مرزِ کنترل ۳) */
html.dark body.ws .model-pick.needs { background-color: rgba(79, 163, 224, .12); border-color: #a9d2f1; color: #cfe5f7; }
body.ws .send-btn { background: linear-gradient(135deg, var(--ws-blue), var(--fz-brand-700)); box-shadow: 0 8px 18px -10px rgba(36, 135, 206, .9); }