/* WS Clinic Booking Core — پورتال فرانت پرسنل (دکتر/اپتومتر/منشی)
   زبان بصری از پلاگین رزرو پیلاتس الگو گرفته شده. این پوسته زیر قالب سایت خودش رندر می‌شود
   (portal-template.php هیچ header.php/footer.php ای صدا نمی‌زند، ولی wp_head() هنوز استایل‌شیت خود
   قالب را لود می‌کند) — خیلی از قالب‌ها روی تگ‌های عمومی مثل table/td/button/input/a استایل اختصاصی
   خودشان را می‌گذارند و چون بارگذاری‌شان می‌تواند بعد از این فایل باشد روی همه‌چیز اینجا غالب می‌شوند؛
   دقیقا به همین دلیل (هم‌الگوی pilates-booking-core/assets/css/portal.css) تقریبا همه‌جای این فایل
   !important دارد. کامپوننت‌های پایه (کارت/فیلد/دکمه/pill/سوییچ/تقویم شمسی) هم‌نام متغیرها و هم‌نام
   کلاس‌های assets/css/admin.css اند — چون همان توابع PHP رندر بدنه بدون هیچ تغییری اینجا هم صدا زده
   می‌شوند. رنگ‌ها/فونت قابل‌تنظیم فرانت با یک <style> درون‌خطی بعد از این فایل اضافه می‌شود
   (wsc_build_frontend_theme_css). */

/* از وقتی /panel/ با قالب مستقل خودش رندر می‌شود، این حاشیه روی خود body باید فاصله‌ی لازم را از
   لبه‌های واقعی صفحه تامین کند — وگرنه نوار بالا (که گوشه‌های بالایی گرد دارد) دقیقا چسبیده به لبه‌ی
   مرورگر/گوشی دیده می‌شود و آن گردی اصلا به چشم نمی‌آید. */
body.wsc-portal-page-body {
    margin: 0 !important;
    padding: 20px !important;
    background-image: radial-gradient(circle at top right, rgba(96, 165, 250, .2), transparent 32%), radial-gradient(circle at bottom left, rgba(129, 140, 248, .18), transparent 30%), linear-gradient(180deg, #f8fbff, #eef4ff) !important;
    background-attachment: fixed !important;
    box-sizing: border-box;
}
/* صفحه‌ی ویزیت پزشک/سایر صفحات بلند، یک اسکرول‌بار عمودی واقعی روی خود صفحه (نه فقط داخل
   .wsc-portal-wrap) دارند؛ چون سند dir="rtl" است، مرورگر (بسته به موتور) این اسکرول‌بار پیش‌فرض
   ضخیم را سمت فیزیکی چپ می‌گذارد — دقیقا همان «فاصله‌ی الکی سمت چپ» که کارفرما با DevTools نشان
   داد، نه یک باگ margin/padding. راه‌حل: همان اسکرول‌بار باریک سفارشی داخل .wsc-portal-wrap را
   روی خود ریشه‌ی سند هم اعمال می‌کنیم. */
/* margin:0 صریح لازم است — وردپرس (حتی با اینکه نوار ادمین با show_admin_bar غیرفعال شده) گاهی
   همچنان html.wp-toolbar { margin-top:32px !important; } کور خودش را تحمیل می‌کند؛ چون خودمان
   با پدینگ استاندارد روی body فاصله را تامین کرده‌ایم، این مارجین اضافه‌ی هسته‌ی وردپرس در همه‌ی
   حالات (نه فقط موبایل) باید صفر شود. */
html:has(body.wsc-portal-page-body) { margin: 0 !important; }
html:has(body.wsc-portal-page-body), body.wsc-portal-page-body {
    scrollbar-width: thin !important; scrollbar-color: #cbd5e1 transparent !important;
}
html:has(body.wsc-portal-page-body)::-webkit-scrollbar, body.wsc-portal-page-body::-webkit-scrollbar { width: 6px !important; }
html:has(body.wsc-portal-page-body)::-webkit-scrollbar-track, body.wsc-portal-page-body::-webkit-scrollbar-track { background: transparent !important; }
html:has(body.wsc-portal-page-body)::-webkit-scrollbar-thumb, body.wsc-portal-page-body::-webkit-scrollbar-thumb { background-color: #cbd5e1 !important; border-radius: 999px !important; }
@media (max-width: 900px) {
    body.wsc-portal-page-body { padding: 0 !important; }
}

/* توکن‌های طراحی — نسخه‌ی 1.0.0 (WS CIS)، عینا هم‌خانواده با admin.css (رجوع کنید به توضیح آنجا). */
.wsc-portal-wrap {
    direction: rtl;
    text-align: right;
    /* طبق گزارش کارفرما («توی جدول اپتومتری اعداد باید انگلیسی باشه، الان فارسیه») — خود رشته‌ی
       ذخیره‌شده/چاپ‌شده همیشه رقم لاتین (ASCII 0-9) بوده؛ این فقط یک ویژگی فونت فارسی سایت
       (locl/substituted forms) است که رقم‌های لاتین را با گلیف فارسی جایگزین می‌کند، صرف‌نظر از
       کد یونیکد واقعی. غیرفعال‌کردن locl این جایگزینی را متوقف می‌کند، بدون اینکه به تاریخ‌ها/شمارش‌های
       دیگری که عمدا با wsc_to_persian_digits() به رقم واقعی فارسی تبدیل شده‌اند آسیبی بزند (آن‌ها
       از قبل کاراکتر یونیکد فارسی واقعی‌اند، نه لاتین جایگزین‌شده). */
    font-feature-settings: "locl" 0;
    --wsc-primary: var(--wsc-fe-primary, #2f86ff);
    --wsc-primary-dark: var(--wsc-fe-primary-dark, #1e6fe0);
    --wsc-ink: var(--wsc-fe-text, #0f172a);
    --wsc-muted: #64748b;
    --wsc-text-strong: #334155;
    --wsc-border: var(--wsc-fe-border, #e2e8f0);
    --wsc-border-soft: #f1f5f9;
    --wsc-form-border: #cbd5e1;
    --wsc-bg: #eef4ff;
    --wsc-surface: var(--wsc-fe-bg, #ffffff);
    --wsc-success: var(--wsc-fe-success, #059669);
    --wsc-success-bg: #ecfdf5;
    --wsc-danger: var(--wsc-fe-danger, #e11d48);
    --wsc-danger-bg: #fff1f2;
    --wsc-warning: #d97706;
    --wsc-warning-bg: #fffbeb;
    --wsc-empty-bg: #ecfdf5;
    --wsc-empty-border: #a7f3d0;
    --wsc-held-bg: #fffbeb;
    --wsc-held-border: #fcd34d;
    --wsc-held-text: #b45309;
    --wsc-noshow-bg: #fff1f2;
    /* عمدا مقدار ثابت نیست — اگر رنگ اصلی فرانت از تنظیمات عوض شود، این هاور باید هم‌خانواده بماند
       وگرنه متن رنگی رویش کم‌کنتراست می‌شود (باگی که در نسخه‌ی خواهر کشف شد). */
    --wsc-hover-bg: color-mix(in srgb, var(--wsc-primary) 15%, var(--wsc-surface));
    --wsc-radius-lg: 30px;
    --wsc-radius-md: 22px;
    --wsc-radius-sm: 12px;
    --wsc-radius-btn: 16px;
    --wsc-shadow-card: 0 10px 30px rgba(15, 23, 42, .08);
    --wsc-shadow-card-hover: 0 20px 40px rgba(15, 23, 42, .12);
    /* شیشه‌ای/Glassmorphism — دقیقا هم‌خانواده با admin.css (رجوع کنید به توضیح آنجا). */
    --wsc-glass-bg: hsla(0, 0%, 100%, .85);
    --wsc-glass-border: rgba(226, 232, 240, .7);
    --wsc-glass-blur: blur(24px);
    --wsc-ghost-bg: hsla(0, 0%, 100%, .7);
    --wsc-field-bg: rgba(248, 250, 252, .85);
    font-family: var(--wsc-fe-font-family, inherit) !important;
    font-size: var(--wsc-fe-font-size, 15px) !important;
    font-weight: var(--wsc-fe-font-weight, 400) !important;
    color: var(--wsc-ink) !important;
    background: var(--wsc-bg) !important;
    min-height: calc(100vh - 40px);
    padding: 24px !important; border-radius: 30px !important;
}
@media (max-width: 900px) {
    /* پدینگ ۲۴px+رادیوس ۳۰px برای دسکتاپ حساب شده بود — روی یک گوشی ۳۷۵-۴۱۴px، همین یک پدینگ به‌تنهایی
       (هر طرف ۲۴px، جمعا نزدیک ۵۰px) عرض واقعی محتوا را به‌شکل محسوسی می‌خورد. کارفرما هم دقیقا
       همین را با اسکرین‌شات موبایل گزارش داد.
       نکته‌ی مهم: این رول باید بعد رول پایه‌ی .wsc-portal-wrap (که padding:24px !important دارد) در
       فایل بیاید — قبلا این override قبل از رول پایه بود و چون specificity هر دو یکسان است (هر دو
       !important)، برنده‌ی cascade فقط با ترتیب منبع تعیین می‌شود، پس رول پایه (که بعدا می‌آمد) همیشه
       می‌برد و این override هیچ‌وقت واقعا اعمال نمی‌شد (دقیقا همون چیزی که در DevTools به‌صورت
       خط‌خورده دیده می‌شد). */
    .wsc-portal-wrap { min-height: 100vh; padding: 0 !important; border-radius: 16px !important; }
}
.wsc-portal-wrap * { box-sizing: border-box; font-family: inherit !important; }

/* اسکرول‌بار سفارشی — عینا هم‌خانواده با admin.css. */
.wsc-portal-wrap, .wsc-portal-wrap * {
    scrollbar-width: thin !important; scrollbar-color: var(--wsc-border) transparent !important;
}
.wsc-portal-wrap ::-webkit-scrollbar { width: 6px !important; height: 6px !important; }
.wsc-portal-wrap ::-webkit-scrollbar-track { background: transparent !important; }
/* border:2px solid transparent + background-clip:padding-box یعنی رنگ تیوپ از لبه‌های بالا/پایین ریل
   اسکرول فاصله می‌گیرد (به‌جای چسبیدن کامل راست‌گوشه‌اش) — دقیقا همان حس «کوتاه‌تر/توی خود باکس»
   که کارفرما خواست، نه یک نوار کشیده‌ی سرتاسری که انگار از گوشه‌ی گرد کارت بیرون زده. */
.wsc-portal-wrap ::-webkit-scrollbar-thumb {
    background-color: var(--wsc-border) !important; background-clip: padding-box !important;
    border: 2px solid transparent !important; border-radius: 999px !important;
}
.wsc-portal-wrap ::-webkit-scrollbar-thumb:hover { background-color: var(--wsc-muted) !important; }
/* عمدا بدون !important: این فقط رنگ پیش‌فرض لینک‌های بدون کلاس خاص (مثلا داخل متن راهنما) است.
   اگر !important می‌داشت، چون (کلاس+تگ) از (تک‌کلاس) خیلی از کامپوننت‌های دیگر (nav-link/logout/
   date-list a/week-day و ...) specificity ی بالاتری دارد، رنگ آن‌ها را هم می‌بلعید — دقیقا همون باگی
   که دکمه‌ی خروج را آبی‌روی‌آبی (ناخوانا) و تیترهای سایدبار را به‌جای مشکی، آبی نشان می‌داد. */
.wsc-portal-wrap a { color: var(--wsc-primary); }

/* حالت شب برای پورتال — قبلا اصلا وجود نداشت (فقط ادمین داشت)؛ عینا هم‌خانواده با admin.css. */
body.wsc-dark-mode .wsc-portal-wrap {
    --wsc-ink: #e4e6ea !important; --wsc-muted: #a0a6ad !important; --wsc-text-strong: #d8dade !important;
    --wsc-border: #262c38 !important; --wsc-border-soft: #1c212b !important; --wsc-form-border: #333a47 !important;
    --wsc-bg: #0d1117 !important; --wsc-surface: #161b24 !important;
    --wsc-success: #34d399 !important; --wsc-success-bg: #10281f !important;
    --wsc-danger: #fb7185 !important; --wsc-danger-bg: #3a1520 !important;
    --wsc-warning: #fbbf24 !important; --wsc-warning-bg: #3a2f10 !important;
    --wsc-empty-bg: #10281f !important; --wsc-empty-border: #2e6b3f !important;
    --wsc-held-bg: #3a2f10 !important; --wsc-held-border: #8a6a10 !important; --wsc-held-text: #e0b04a !important;
    --wsc-noshow-bg: #3a1520 !important;
    --wsc-glass-bg: hsla(220, 22%, 10%, .75) !important; --wsc-glass-border: rgba(255, 255, 255, .08) !important;
    --wsc-ghost-bg: hsla(220, 20%, 16%, .6) !important; --wsc-field-bg: rgba(22, 27, 36, .85) !important;
    --wsc-shadow-card: 0 10px 30px rgba(0, 0, 0, .35) !important;
}
body.wsc-dark-mode.wsc-portal-page-body { background: #0d1117 !important; }

/* ---------- نوار بالا ---------- */

/* برند کلینیک + دکمه‌ی جمع/بازکردن سایدبار — طبق خواسته‌ی صریح کارفرما («تیتر و دکمه‌ی جمع‌وبازشو
   رو بیار بالای منو») از یک نوار جداگانه‌ی تمام‌عرض، به بالای خود سایدبار منتقل شد (دقیقا مثل
   «بیمارستان نگاه / Eye Imaging SaaS Panel» در رأس سایدبار رفرنس). */
.wsc-portal-wrap .wsc-portal-sidebar-header {
    display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 10px !important;
    padding: 0 4px 16px !important; margin-bottom: 10px !important; border-bottom: 1px solid var(--wsc-border-soft) !important;
}
.wsc-portal-wrap .wsc-portal-brand-logo { color: var(--wsc-primary) !important; display: flex !important; flex-shrink: 0; }
.wsc-portal-wrap .wsc-portal-brand-logo .wsc-icon svg { width: 22px; height: 22px; }
.wsc-portal-wrap .wsc-portal-brand-name { font-weight: 800 !important; font-size: 13.5px !important; color: var(--wsc-ink) !important; flex: 1; }
/* لوگوی واقعی آپلودشده — عمدا بدون قاب دایره‌ای/بک‌گراند (برخلاف آیکون پیش‌فرض)، چون خود لوگو
   می‌تواند هر نسبت ابعادی داشته باشد (عریض/مربعی/مستطیلی) و یک قاب دایره‌ای ثابت آن را می‌برید. */
.wsc-portal-wrap .wsc-portal-brand-logo-wide { display: flex !important; align-items: center !important; justify-content: flex-start !important; flex: 1; min-width: 0; height: 46px; }
.wsc-portal-wrap .wsc-portal-brand-logo-wide img { max-height: 100% !important; max-width: 100% !important; width: auto !important; object-fit: contain !important; }
/* روی دسکتاپ هم این دکمه لازم است — نه فقط برای موبایل — چون کلیک رویش سایدبار را کاملا جمع می‌کند
   تا فضای کاری محتوا بزرگ‌تر شود (کلاس wsc-portal-collapsed پایین‌تر)؛ رفتار کشویی موبایل
   (wsc-open) کاملا جدا و فقط زیر همون مدیاکوئری فعال است، پس یک دکمه هر دو نقش را بدون تداخل بازی می‌کند. */
/* box-sizing:border-box + padding:0 صریح لازم است — بدون این، پدینگ افقی پیش‌فرض تم سایت روی
   تگ خام button به عرض ۳۰px اضافه می‌شد (چون content-box بود) ولی به ارتفاع کمتر، پس یک دایره به
   بیضی کشیده می‌شد — دقیقا همان چیزی که کارفرما با اسکرین‌شات نشان داد. */
.wsc-portal-wrap .wsc-portal-menu-toggle {
    display: inline-flex !important; align-items: center !important; justify-content: center !important;
    background: var(--wsc-border-soft) !important; border: 1px solid var(--wsc-border) !important; color: var(--wsc-text-strong) !important;
    width: 30px !important; height: 30px !important; padding: 0 !important; box-sizing: border-box !important;
    border-radius: 50% !important; cursor: pointer !important; flex-shrink: 0;
}
/* هاور/فوکوس/کلیک عینا هم‌الگوی .wsc-icon-btn (بک‌گراند توپر آبی + آیکون سفید) — نه یک تینت
   کم‌رنگ که آیکون تیره رویش کم‌کنتراست/ناخوانا بماند. :focus/:active هم صریحا پوشش داده شدند چون
   روی موبایل بعد تپ‌کردن، :hover معمولا می‌چسبد ولی بعضی مرورگرها بجایش :focus را نگه می‌دارند. */
.wsc-portal-wrap .wsc-portal-menu-toggle:hover, .wsc-portal-wrap .wsc-portal-menu-toggle:focus, .wsc-portal-wrap .wsc-portal-menu-toggle:active {
    background: var(--wsc-primary) !important; border-color: var(--wsc-primary) !important; color: #fff !important; outline: none !important;
}
.wsc-portal-wrap .wsc-portal-menu-toggle svg { width: 15px; height: 15px; }

/* کارت واحد نوار بالا (هویت+تیتر فشرده+جستجو+KPI) — طبق خواسته‌ی کارفرما («اون قسمت‌های دیگرو ببر
   داخل یک کانتینر عین همون باکس‌های زیرش») دقیقا هم‌سبک .wsc-panel-card است، نه چند ردیف شناور جدا. */
/* position:relative + z-index لازم است — backdrop-filter خودش یک stacking context جدید می‌سازد؛
   بدون z-index صریح بالاتر از کارت هدر/داشبورد زیرش (که آن هم backdrop-filter دارد)، دراپ‌داون
   جستجو همیشه زیر آن کارت می‌رفت. */
.wsc-portal-wrap .wsc-topbar-card {
    background: var(--wsc-glass-bg) !important; border: 1px solid var(--wsc-glass-border) !important;
    backdrop-filter: var(--wsc-glass-blur) !important; -webkit-backdrop-filter: var(--wsc-glass-blur) !important;
    border-radius: var(--wsc-radius-lg) !important; padding: 22px !important; margin-bottom: 18px !important;
    box-shadow: var(--wsc-shadow-card) !important;
    position: relative; z-index: 60;
}

/* ---------- بدنه: سایدبار + محتوا ---------- */

.wsc-portal-wrap .wsc-portal-body { display: flex !important; align-items: flex-start !important; gap: 4px; max-width: 1320px; margin: 0 auto !important; }
/* سایدبار خودش یک کارت سفید گرد مستقل است (مثل بقیه‌ی کارت‌های Negah)، نه فقط چند لینک شناور
   روی پس‌زمینه‌ی صفحه — دقیقا چیزی که در اسکرین‌شات مشخص شد که جا افتاده بود. */
/* عمدا خود سایدبار دیگر overflow-y ندارد — طبق رفرنس، فقط لیست لینک‌ها (wsc-portal-nav-links)
   اسکرول می‌گیرد، نه کل کارت؛ یعنی هدر برند/دکمه‌ی جمع‌وبازشو (wsc-portal-sidebar-header) همیشه
   بالای سایدبار ثابت می‌ماند و با اسکرول‌کردن منو جابه‌جا نمی‌شود. */
.wsc-portal-wrap .wsc-portal-sidebar {
    width: 240px !important; flex-shrink: 0; padding: 20px 14px !important; position: sticky !important; top: 16px;
    max-height: calc(100vh - 32px); overflow: hidden !important; display: flex !important; flex-direction: column !important; gap: 2px !important;
    background: var(--wsc-glass-bg) !important; border: 1px solid var(--wsc-glass-border) !important;
    backdrop-filter: var(--wsc-glass-blur) !important; -webkit-backdrop-filter: var(--wsc-glass-blur) !important;
    border-radius: var(--wsc-radius-lg) !important; box-shadow: var(--wsc-shadow-card) !important;
}
.wsc-portal-wrap .wsc-portal-sidebar-header { flex-shrink: 0; }
.wsc-portal-wrap .wsc-portal-nav-links {
    flex: 1; min-height: 0; overflow-y: auto !important; display: flex !important; flex-direction: column !important; gap: 2px !important;
    /* کمی فاصله از بالا/پایین خود ناحیه‌ی اسکرول‌شونده — همان درخواست «اسکرول‌بار کمی کوتاه‌تر باشد،
       انگار داخل خود سکشن است» را هم به‌طور طبیعی برآورده می‌کند. */
    padding: 4px 0;
}
.wsc-portal-wrap .wsc-portal-nav-link {
    display: flex !important; align-items: center !important; gap: 12px !important; padding: 8px 10px !important; border-radius: var(--wsc-radius-md) !important;
    color: var(--wsc-ink) !important; text-decoration: none !important; font-size: 13px !important; font-weight: 700 !important;
    transition: background .15s ease, box-shadow .15s ease;
}
.wsc-portal-wrap .wsc-portal-nav-icon {
    display: flex !important; align-items: center !important; justify-content: center !important;
    width: 36px !important; height: 36px !important; border-radius: var(--wsc-radius-sm) !important;
    background: var(--wsc-border-soft) !important; flex-shrink: 0; color: var(--wsc-muted) !important;
    transition: background .15s ease, color .15s ease;
}
.wsc-portal-wrap .wsc-portal-nav-icon .wsc-icon svg { width: 18px !important; height: 18px !important; }
.wsc-portal-wrap .wsc-portal-nav-link:hover { background: var(--wsc-border-soft) !important; }
.wsc-portal-wrap .wsc-portal-nav-link.active {
    background: linear-gradient(135deg, var(--wsc-primary), var(--wsc-primary-dark)) !important; color: #fff !important;
    box-shadow: 0 8px 20px color-mix(in srgb, var(--wsc-primary) 35%, transparent) !important;
}
.wsc-portal-wrap .wsc-portal-nav-link.active .wsc-portal-nav-icon { background: rgba(255, 255, 255, .2) !important; color: #fff !important; }
/* آیتم خروج — عمدا قرمز و با یک خط جداکننده از بقیه‌ی منو، ته‌ته‌ی سایدبار.
   padding-top:14px قبلی روی خود ردیف باعث می‌شد پیل خروج بلندتر/بزرگ‌تر از بقیه‌ی آیتم‌ها دیده
   شود («سایزش با بقیه یکی نیست») — فاصله‌ی جداکننده الان فقط با margin-top تامین می‌شود، نه پدینگ
   خود ردیف، پس پدینگ ردیف دقیقا هم‌اندازه‌ی بقیه‌ی آیتم‌ها (۸px ۱۰px، ارثی از .wsc-portal-nav-link)
   می‌ماند. */
.wsc-portal-wrap .wsc-portal-nav-logout,
.wsc-portal-wrap .wsc-portal-nav-logout .wsc-portal-nav-icon { background: var(--wsc-danger-bg) !important; }
.wsc-portal-wrap .wsc-portal-nav-logout { margin-top: 16px !important; padding-top: 8px !important; border-top: 1px solid var(--wsc-border-soft) !important; color: var(--wsc-danger) !important; }
/* هاله‌ی قرمز کم‌رنگ دور آیکون — هم‌الگوی سایه‌ی گلویی آیتم فعال (که آبی است)، اینجا فقط با رنگ
   قرمز، تا خروج هم مثل بقیه‌ی موارد یک هاله داشته باشد اما هم‌رنگ خودش. */
.wsc-portal-wrap .wsc-portal-nav-logout .wsc-portal-nav-icon { color: var(--wsc-danger) !important; box-shadow: 0 0 0 4px color-mix(in srgb, var(--wsc-danger) 12%, transparent) !important; }
/* روی هاور عمدا یک قرمز میان‌رنگ (نه کاملا توپر/تیره) — طبق نظر کارفرما که قرمز کاملا پررنگ
   «خوب نشسته» نبود. */
.wsc-portal-wrap .wsc-portal-nav-logout:hover,
.wsc-portal-wrap .wsc-portal-nav-logout:hover .wsc-portal-nav-icon { background: color-mix(in srgb, var(--wsc-danger) 65%, white) !important; color: #fff !important; box-shadow: none !important; }
.wsc-portal-wrap .wsc-portal-sidebar.wsc-portal-collapsed .wsc-portal-nav-logout { margin-top: 10px !important; padding-top: 14px !important; }
.wsc-portal-wrap .wsc-portal-profile { display:flex !important; align-items:center !important; gap:10px !important; flex-shrink:0 !important; padding:12px 4px 0 !important; margin-top:8px !important; border-top:1px solid var(--wsc-border-soft) !important; }
.wsc-portal-wrap .wsc-portal-profile-avatar { flex-shrink:0 !important; }
.wsc-portal-wrap .wsc-portal-profile-text { flex:1 !important; min-width:0 !important; }
.wsc-portal-wrap .wsc-portal-profile-logout { display:flex !important; align-items:center !important; justify-content:center !important; flex-shrink:0 !important; width:36px !important; height:36px !important; border-radius:var(--wsc-radius-sm) !important; color:var(--wsc-danger) !important; background:var(--wsc-danger-bg) !important; text-decoration:none !important; transition:background .15s ease,color .15s ease !important; }
.wsc-portal-wrap .wsc-portal-profile-logout:hover { color:#fff !important; background:var(--wsc-danger) !important; }
.wsc-portal-wrap .wsc-portal-profile-logout .wsc-icon svg { width:18px !important; height:18px !important; }
.wsc-portal-wrap .wsc-portal-sidebar.wsc-portal-collapsed .wsc-portal-profile { flex-direction:column !important; padding-inline:0 !important; }
/* overflow-x:hidden یک شبکه‌ی امنیتی دوم است: اگر بچه‌ی دیگری هم در آینده از عرض بزند بیرون، فقط همان
   بخش کلیپ می‌شود نه اینکه کل صفحه اسکرول افقی بگیرد. برای position:sticky نوار بالا بی‌خطر است چون
   .wsc-portal-topbar یک sibling است، نه فرزند .wsc-portal-content. */
/* پدینگ بالا عمدا صفر است — طبق خواسته‌ی کارفرما، تا لبه‌ی بالایی محتوا با لبه‌ی بالایی سایدبار
   هم‌راستا/هم‌تراز بماند (نه چند پیکسل پایین‌تر). */
/* طبق خواسته‌ی صریح کارفرما («پدینگ چپ/راست رو صفر کن») — فقط پدینگ عمودی (برای فاصله از نوار
   بالا/پایین صفحه) می‌ماند؛ خود کارت‌های داخل (.wsc-panel-card) پدینگ خودشان را دارند، پس محتوا
   بی‌فاصله به لبه نمی‌چسبد. box-shadow ای هم اصلا روی خود این wrapper نبود (فقط روی خود کارت‌ها)،
   پس چیزی برای حذف نبود؛ اگر بعدا یکی اضافه شد باید همزمان با این تغییر حذف شود. */
.wsc-portal-wrap .wsc-portal-content { flex: 1; min-width: 0; overflow-x: hidden; padding: 0 6px 60px !important; border-radius: 30px !important; margin-right: 10px !important; box-shadow: none !important; }
.wsc-portal-wrap .wsc-portal-overlay { display: none; }

/* نوار بارگذاری pjax — چون دیگر صفحه واقعا reload نمی‌شود، اسپینر خود مرورگر هرگز دیده نمی‌شود؛
   این نوار نازک بالای صفحه (الگوی گیت‌هاب/یوتیوب) تنها بازخورد بصری «در حال عوض‌شدن تب» است. */
#wsc-pjax-bar {
    position: fixed !important; top: 0 !important; inset-inline-start: 0 !important; height: 3px !important; width: 0%;
    background: linear-gradient(90deg, var(--wsc-primary, #2f86ff), var(--wsc-primary-dark, #1e6fe0)) !important;
    z-index: 9999 !important; transition: width .25s ease, opacity .25s ease; display: none;
}
#wsc-pjax-bar.wsc-pjax-bar-done { opacity: 0; }

.wsc-portal-wrap .wsc-eyebrow { display: block !important; color: var(--wsc-primary) !important; font-size: 11px !important; font-weight: 800 !important; letter-spacing: 1.5px !important; text-transform: uppercase !important; margin: 0 0 4px !important; }
.wsc-portal-wrap .wsc-topbar-page-title { display: flex !important; align-items: center !important; gap: 12px !important; min-width: 0; }
.wsc-portal-wrap .wsc-topbar-page-icon {
    width: 38px !important; height: 38px !important; flex-shrink: 0; border-radius: var(--wsc-radius-sm) !important;
    background: var(--wsc-border-soft) !important; border: 1px solid var(--wsc-border) !important;
    display: flex !important; align-items: center !important; justify-content: center !important;
    color: var(--wsc-primary) !important;
}
.wsc-portal-wrap .wsc-topbar-page-icon .wsc-icon svg { width: 19px !important; height: 19px !important; }
.wsc-portal-wrap .wsc-topbar-page-title h1 { margin: 0 !important; font-size: 17px !important; font-weight: 800 !important; color: var(--wsc-ink) !important; }
/* عینا هم‌خانواده با admin.css — تاریخ/زیرتیتر کنار eyebrow، نه خط جداگانه‌ی زیر h1. */
.wsc-portal-wrap .wsc-topbar-page-title-meta { display: flex !important; align-items: center !important; gap: 6px !important; margin: 0 0 2px !important; }
.wsc-portal-wrap .wsc-topbar-page-title-meta .wsc-eyebrow { margin: 0 !important; }
.wsc-portal-wrap .wsc-topbar-page-title-subtitle { color: var(--wsc-muted) !important; font-size: 11px !important; font-weight: 600 !important; }
.wsc-portal-wrap .wsc-topbar-page-title-meta .wsc-eyebrow:not(:only-child)::after { content: "·"; margin-inline-start: 6px; color: var(--wsc-muted); font-weight: 400; }
.wsc-portal-wrap .wsc-header-cta { flex-shrink: 0; }
/* ردیف دوم — جستجو (راست، منعطف) + پیل‌های KPI (چپ) کنار هم، به‌جای دو ردیف جداگانه. */
.wsc-portal-wrap .wsc-topbar-row2 { display: flex !important; align-items: center !important; gap: 14px !important; flex-wrap: wrap !important; }
.wsc-portal-wrap .wsc-topbar-row2 .wsc-searchbar { flex: 1; min-width: 220px; margin-bottom: 0 !important; }
.wsc-portal-wrap .wsc-topbar-row2 .wsc-kpi-row { margin-bottom: 0 !important; flex-shrink: 0; }

/* حالت فشرده */
.wsc-compact-header .wsc-topbar-card { padding: 10px 14px !important; margin-bottom: 10px !important; }
.wsc-compact-header .wsc-topbar-page-icon { width: 30px !important; height: 30px !important; }
.wsc-compact-header .wsc-topbar-page-icon .wsc-icon svg { width: 15px !important; height: 15px !important; }
.wsc-compact-header .wsc-topbar-page-title h1 { font-size: 14px !important; }
.wsc-compact-header .wsc-eyebrow { font-size: 9.5px !important; margin: 0 0 2px !important; }

/* ---------- آیکون خطی SVG (سبک Feather/Lucide) — رجوع کنید به wsc_icon_svg() ---------- */
.wsc-portal-wrap .wsc-icon { display: inline-flex !important; align-items: center !important; justify-content: center !important; line-height: 0 !important; flex-shrink: 0; }
.wsc-portal-wrap .wsc-icon svg { width: 20px; height: 20px; display: block; }

/* ---------- نوار بالا: هویت/زنگ اعلان/جستجوی سراسری/پیل‌های KPI — عینا هم‌خانواده با admin.css ---------- */

/* عمدا flex-end نه space-between: با تک‌فرزند wsc-topbar-identity، در RTL یعنی سمت چپ فیزیکی صفحه. */
.wsc-portal-wrap .wsc-topbar { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 12px !important; flex-wrap: wrap !important; margin: 0 0 14px !important; }
.wsc-portal-wrap .wsc-topbar-identity { display: flex !important; align-items: center !important; gap: 10px !important; }
.wsc-portal-wrap .wsc-user-avatar {
    width: 36px !important; height: 36px !important; border-radius: 50% !important; flex-shrink: 0;
    display: flex !important; align-items: center !important; justify-content: center !important;
    background: linear-gradient(135deg, var(--wsc-primary), var(--wsc-primary-dark)) !important; color: #fff !important;
    font-size: 12.5px !important; font-weight: 800 !important;
}
.wsc-portal-wrap .wsc-topbar-user-info { display: flex !important; flex-direction: column !important; line-height: 1.4 !important; }
.wsc-portal-wrap .wsc-topbar-user-name { font-size: 12.5px !important; font-weight: 800 !important; color: var(--wsc-ink) !important; }
.wsc-portal-wrap .wsc-topbar-user-role { font-size: 10.5px !important; color: var(--wsc-muted) !important; }
.wsc-portal-wrap .wsc-user-menu { position: relative; }
.wsc-portal-wrap .wsc-user-menu-trigger {
    display: flex !important; align-items: center !important; gap: 10px !important; background: transparent !important; border: none !important; padding: 4px !important; margin: 0 !important;
    cursor: pointer !important; border-radius: var(--wsc-radius-sm) !important;
}
.wsc-portal-wrap .wsc-user-menu-trigger:hover { background: var(--wsc-hover-bg) !important; }
.wsc-portal-wrap .wsc-user-menu-dropdown {
    display: none; position: absolute !important; top: calc(100% + 6px) !important; inset-inline-end: 0 !important; z-index: 50 !important; min-width: 140px;
    background: var(--wsc-surface) !important; border: 1px solid var(--wsc-border) !important; border-radius: var(--wsc-radius-md) !important;
    box-shadow: var(--wsc-shadow-card-hover) !important; padding: 6px !important;
}
.wsc-portal-wrap .wsc-user-menu:hover .wsc-user-menu-dropdown { display: block; }
.wsc-portal-wrap .wsc-user-menu-dropdown a, .wsc-portal-wrap .wsc-user-menu-dropdown button {
    display: flex !important; align-items: center !important; gap: 8px !important; padding: 8px 10px !important; border-radius: var(--wsc-radius-sm) !important; width: 100% !important;
    font-size: 12.5px !important; font-weight: 700 !important; text-decoration: none !important; background: none !important; border: none !important; cursor: pointer !important; text-align: right !important; font-family: inherit !important;
}
.wsc-portal-wrap .wsc-user-menu-dropdown a { color: var(--wsc-danger) !important; }
.wsc-portal-wrap .wsc-user-menu-dropdown a:hover { background: var(--wsc-danger-bg) !important; }
.wsc-portal-wrap .wsc-user-menu-dropdown button { color: var(--wsc-ink) !important; }
.wsc-portal-wrap .wsc-user-menu-dropdown button:hover { background: var(--wsc-hover-bg) !important; }
.wsc-portal-wrap .wsc-user-menu-dropdown .wsc-icon svg { width: 15px; height: 15px; }
.wsc-portal-wrap .wsc-user-avatar-photo { padding: 0 !important; overflow: hidden !important; }
.wsc-portal-wrap .wsc-user-avatar-photo img { width: 100% !important; height: 100% !important; object-fit: cover !important; border-radius: 50% !important; }
.wsc-portal-wrap .wsc-icon-btn {
    width: 36px !important; height: 36px !important; border-radius: 50% !important; border: 1px solid var(--wsc-border) !important;
    background: var(--wsc-glass-bg) !important; color: var(--wsc-text-strong) !important; display: inline-flex !important; align-items: center !important; justify-content: center !important;
    cursor: pointer !important; position: relative; transition: background .12s ease, color .12s ease; flex-shrink: 0;
}
/* طبق گزارش کارفرما («حالت اکتیو رنگش مشکیه، سفید نیست») — قبلا فقط :hover پوشش داشت؛ وقتی
   دکمه بعد کلیک هنوز focus دارد (مثلا بعد کلیک ماوس روی خیلی از مرورگرها)، تم سایت روی
   button:focus سراسری یک بک‌گراند آبی می‌گذارد ولی رنگ آیکون را سفید نمی‌کند — پس :focus و
   :focus-visible هم صریحا همان استایل :hover را می‌گیرند تا آیکون همیشه خوانا بماند. */
.wsc-portal-wrap .wsc-icon-btn:hover,
.wsc-portal-wrap .wsc-icon-btn:focus,
.wsc-portal-wrap .wsc-icon-btn:focus-visible { background: var(--wsc-primary) !important; border-color: var(--wsc-primary) !important; color: #fff !important; outline: none !important; }
.wsc-portal-wrap .wsc-icon-btn:hover .wsc-icon,
.wsc-portal-wrap .wsc-icon-btn:focus .wsc-icon,
.wsc-portal-wrap .wsc-icon-btn:focus-visible .wsc-icon { color: #fff !important; }
.wsc-portal-wrap .wsc-icon-btn .wsc-icon svg { width: 18px; height: 18px; }

.wsc-portal-wrap .wsc-notif-wrap { position: relative; }
.wsc-portal-wrap .wsc-notif-badge {
    position: absolute !important; top: -4px !important; inset-inline-end: -4px !important; min-width: 16px !important; height: 16px !important; padding: 0 3px !important;
    background: var(--wsc-danger) !important; color: #fff !important; border-radius: 999px !important; font-size: 10px !important; font-weight: 800 !important;
    display: flex !important; align-items: center !important; justify-content: center !important; line-height: 1 !important;
}
.wsc-portal-wrap .wsc-notif-dropdown, .wsc-portal-wrap .wsc-global-search-dropdown {
    position: absolute !important; z-index: 50 !important; top: calc(100% + 8px) !important; background: var(--wsc-surface) !important; border: 1px solid var(--wsc-border) !important;
    border-radius: var(--wsc-radius-md) !important; box-shadow: var(--wsc-shadow-card-hover) !important; padding: 14px !important; min-width: 260px;
}
.wsc-portal-wrap .wsc-notif-dropdown { inset-inline-end: 0 !important; }
.wsc-portal-wrap .wsc-notif-section + .wsc-notif-section { margin-top: 12px !important; padding-top: 12px !important; border-top: 1px solid var(--wsc-border-soft) !important; }
.wsc-portal-wrap .wsc-notif-section h4 { margin: 0 0 6px !important; font-size: 12.5px !important; font-weight: 800 !important; color: var(--wsc-ink) !important; }
.wsc-portal-wrap .wsc-notif-link { font-size: 12px !important; font-weight: 700 !important; color: var(--wsc-primary) !important; text-decoration: none !important; }

.wsc-portal-wrap .wsc-searchbar {
    display: flex !important; align-items: center !important; gap: 10px !important; background: var(--wsc-field-bg) !important; border: 1px solid var(--wsc-border) !important;
    border-radius: var(--wsc-radius-btn) !important; padding: 0 16px !important; margin: 0 0 14px !important; position: relative;
    width: 100% !important; box-sizing: border-box !important;
    transition: border-color .12s ease, background .12s ease, box-shadow .12s ease;
}
/* عینا هم‌خانواده با admin.css — رجوع کنید به توضیح آنجا (رفع حس «دوگانگی»). */
.wsc-portal-wrap .wsc-searchbar:focus-within { border-color: var(--wsc-primary) !important; background: var(--wsc-surface) !important; box-shadow: 0 0 0 3px var(--wsc-hover-bg) !important; }
.wsc-portal-wrap .wsc-searchbar .wsc-icon { color: var(--wsc-muted) !important; }
.wsc-portal-wrap .wsc-searchbar .wsc-icon svg { width: 18px; height: 18px; }
.wsc-portal-wrap .wsc-global-search-input, .wsc-portal-wrap .wsc-global-search-input:focus {
    appearance: none !important; -webkit-appearance: none !important;
    flex: 1 !important; width: 100% !important; min-width: 0 !important; box-sizing: border-box !important;
    border: none !important; background: transparent !important; padding: 12px 0 !important; font-size: 13.5px !important;
    color: var(--wsc-ink) !important; outline: none !important; box-shadow: none !important;
}
.wsc-portal-wrap .wsc-global-search-dropdown { inset-inline-start: 0 !important; inset-inline-end: 0 !important; width: 100% !important; top: calc(100% + 6px) !important; }
.wsc-portal-wrap .wsc-global-search-group + .wsc-global-search-group { margin-top: 10px !important; padding-top: 10px !important; border-top: 1px solid var(--wsc-border-soft) !important; }
.wsc-portal-wrap .wsc-global-search-group h5 { margin: 0 0 6px !important; font-size: 11px !important; font-weight: 800 !important; color: var(--wsc-muted) !important; text-transform: uppercase !important; letter-spacing: .5px !important; }
.wsc-portal-wrap .wsc-global-search-row { display: block !important; padding: 8px 10px !important; border-radius: var(--wsc-radius-sm) !important; text-decoration: none !important; color: var(--wsc-ink) !important; font-size: 12.5px !important; }
.wsc-portal-wrap .wsc-global-search-row:hover { background: var(--wsc-hover-bg) !important; }
.wsc-portal-wrap .wsc-global-search-row span { display: block !important; color: var(--wsc-muted) !important; font-size: 11px !important; }
.wsc-portal-wrap .wsc-global-search-empty { padding: 10px !important; font-size: 12px !important; color: var(--wsc-muted) !important; text-align: center !important; }

.wsc-portal-wrap .wsc-kpi-row { display: flex !important; justify-content: flex-end !important; gap: 10px !important; flex-wrap: wrap !important; margin: 0 !important; }
.wsc-portal-wrap .wsc-kpi-pill {
    display: inline-flex !important; align-items: center !important; gap: 6px !important; padding: 6px 14px !important; border-radius: 999px !important;
    font-size: 11.5px !important; font-weight: 700 !important; text-decoration: none !important; border: 1px solid transparent !important;
}
.wsc-portal-wrap .wsc-kpi-pill::before { content: ""; width: 6px; height: 6px; border-radius: 999px; background: currentColor; }
.wsc-portal-wrap .wsc-kpi-pill-danger { color: var(--wsc-danger) !important; background: var(--wsc-danger-bg) !important; }
.wsc-portal-wrap .wsc-kpi-pill-success { color: var(--wsc-success) !important; background: var(--wsc-success-bg) !important; }

/* حالت «تمام‌عرض» — عینا هم‌الگو با admin.css. */
body.wsc-full-width .wsc-portal-body { max-width: none !important; }

/* ---------- دیوار ورود / عدم‌دسترسی ---------- */

/* عمدا بدون فاصله (compound، نه descendant) — wsc-portal-guest روی همون خود .wsc-portal-wrap
   می‌نشیند (هر دو کلاس روی یک div)، نه یک فرزندش؛ اسکریپت خودکار rescope که این‌همه سلکتور
   بی‌پیشوند را با «.wsc-portal-wrap »ی با فاصله جلو انداخت، این یکی را اشتباه به descendant تبدیل
   کرده بود و از آن پس هیچ‌وقت مچ نمی‌شد — دقیقا همون دلیل وسط‌نبودن صفحه‌ی ورود. */
.wsc-portal-wrap.wsc-portal-guest {
    display: flex !important; align-items: center !important; justify-content: center !important; min-height: 100vh; padding: 20px !important;
}

/* ---------- بنر/راهنمای نصب PWA ---------- */
/* عمدا یک کارت کوچک گوشه‌ای (نه کشیده/وسط‌چین کل عرض صفحه) — inset-inline قبلی هر دو طرف را
   ۱۶px می‌گذاشت که با max-width:420px و margin:auto روی خیلی از عرض‌ها به‌جای «کارت گوشه»، یک
   نوار کج نیمه‌کشیده/بی‌قاعده می‌ساخت. */
/* دلیل باگ «ضربدر نصب کار نمی‌کند»: قبلا display:block با !important بود، یعنی حتی وقتی
   pwa-install.js با کلیک ضربدر banner.style.display='none' ست می‌کرد، این قانون !important
   همیشه برنده می‌شد و بنر دوباره ظاهر می‌ماند. حالا پیش‌فرض مخفی است و فقط با کلاس wsc-visible
   (که JS اضافه/حذف می‌کند) نمایش داده می‌شود — همان الگوی باز/بسته‌شدن مودال‌ها در این پروژه. */
.wsc-portal-wrap .wsc-install-banner {
    display: none !important; position: fixed !important; bottom: 16px !important;
    inset-inline-start: 16px !important; inset-inline-end: auto !important;
    width: 320px !important; max-width: calc(100vw - 32px) !important; z-index: 200 !important;
    background: var(--wsc-surface) !important; border: 1px solid var(--wsc-border-soft) !important; border-radius: var(--wsc-radius-md) !important;
    box-shadow: var(--wsc-shadow-card-hover) !important; padding: 14px 16px !important; box-sizing: border-box !important;
}
.wsc-portal-wrap .wsc-install-banner.wsc-visible { display: block !important; }
.wsc-portal-wrap .wsc-install-banner-row { display: flex !important; align-items: center !important; gap: 8px !important; }
.wsc-portal-wrap .wsc-install-banner-icon { color: var(--wsc-primary) !important; display: flex !important; flex-shrink: 0; }
.wsc-portal-wrap .wsc-install-banner-icon .wsc-icon svg { width: 18px; height: 18px; }
.wsc-portal-wrap .wsc-install-banner-title { flex: 1; font-size: 13px !important; color: var(--wsc-ink) !important; }
.wsc-portal-wrap .wsc-install-banner-close {
    display: inline-flex !important; align-items: center !important; justify-content: center !important;
    background: none !important; border: none !important; cursor: pointer !important; color: var(--wsc-muted) !important; flex-shrink: 0; padding: 2px !important;
}
.wsc-portal-wrap .wsc-install-banner-close .wsc-icon svg { width: 14px; height: 14px; }
.wsc-portal-wrap .wsc-install-banner-desc { margin: 8px 0 10px !important; font-size: 12px !important; color: var(--wsc-muted) !important; line-height: 1.7; }
.wsc-portal-wrap .wsc-install-banner-btn { display: flex !important; width: 100% !important; justify-content: center !important; box-sizing: border-box !important; margin-top: 4px !important; }

.wsc-portal-wrap .wsc-ios-install-overlay {
    display: none; position: fixed !important; inset: 0 !important; z-index: 300 !important; background: rgba(15,23,42,.55) !important;
    align-items: center !important; justify-content: center !important; padding: 20px !important;
}
.wsc-portal-wrap .wsc-ios-install-card {
    background: var(--wsc-surface) !important; border-radius: var(--wsc-radius-lg) !important; box-shadow: var(--wsc-shadow-card-hover) !important;
    padding: 28px 24px !important; max-width: 340px; width: 100%; text-align: center !important;
}
.wsc-portal-wrap .wsc-ios-install-logo {
    width: 56px !important; height: 56px !important; margin: 0 auto 14px !important; border-radius: 50% !important;
    background: var(--wsc-hover-bg) !important; color: var(--wsc-primary) !important; display: flex !important; align-items: center !important; justify-content: center !important;
}
.wsc-portal-wrap .wsc-ios-install-logo .wsc-icon svg { width: 26px; height: 26px; }
.wsc-portal-wrap .wsc-ios-install-card h2 { font-size: 15px !important; margin: 0 0 16px !important; color: var(--wsc-ink) !important; }
.wsc-portal-wrap .wsc-ios-install-steps { display: flex !important; flex-direction: column !important; gap: 12px !important; text-align: start !important; margin-bottom: 18px !important; }
.wsc-portal-wrap .wsc-ios-install-step { display: flex !important; align-items: center !important; gap: 10px !important; }
.wsc-portal-wrap .wsc-ios-install-step-icon {
    width: 30px !important; height: 30px !important; flex-shrink: 0; border-radius: 50% !important; background: var(--wsc-hover-bg) !important; color: var(--wsc-primary) !important;
    display: flex !important; align-items: center !important; justify-content: center !important;
}
.wsc-portal-wrap .wsc-ios-install-step-icon .wsc-icon svg { width: 15px; height: 15px; }
.wsc-portal-wrap .wsc-ios-install-step p { margin: 0 !important; font-size: 12.5px !important; color: var(--wsc-ink) !important; line-height: 1.7; }
.wsc-portal-wrap .wsc-ios-install-dismiss { width: 100% !important; justify-content: center !important; }
.wsc-portal-wrap .wsc-portal-login-card {
    background: var(--wsc-surface) !important; border: 1px solid var(--wsc-border-soft) !important; border-radius: var(--wsc-radius-lg) !important;
    padding: 36px 32px !important; max-width: 380px; width: 100%; text-align: center !important; box-shadow: var(--wsc-shadow-card) !important;
}
.wsc-portal-wrap .wsc-portal-login-logo { margin-bottom: 10px; color: var(--wsc-primary); display: flex; align-items: center; justify-content: center; }
.wsc-portal-wrap .wsc-portal-login-logo .wsc-icon svg { width: 40px; height: 40px; }
.wsc-portal-wrap .wsc-portal-login-card h2 { margin: 0 0 6px !important; font-size: 18px !important; font-weight: 800 !important; color: var(--wsc-ink) !important; }
.wsc-portal-wrap .wsc-portal-login-card form { margin-top: 18px !important; text-align: start !important; }
.wsc-portal-wrap .wsc-portal-login-card p.login-username,
.wsc-portal-wrap .wsc-portal-login-card p.login-password { margin-bottom: 12px !important; }
.wsc-portal-wrap .wsc-portal-login-card label { display: block !important; font-size: 12px !important; font-weight: 700 !important; margin-bottom: 6px !important; color: var(--wsc-text-strong) !important; }
.wsc-portal-wrap .wsc-portal-login-card input[type="text"],
.wsc-portal-wrap .wsc-portal-login-card input[type="password"] {
    width: 100% !important; border-radius: var(--wsc-radius-sm) !important; border: 1px solid var(--wsc-form-border) !important; background: var(--wsc-bg) !important;
    padding: 9px 10px !important; font-size: 13px !important; color: var(--wsc-text-strong) !important;
}
.wsc-portal-wrap .wsc-portal-login-card p.login-submit { margin-top: 16px !important; }
.wsc-portal-wrap .wsc-portal-login-card input[type="submit"] {
    width: 100% !important; background: var(--wsc-primary) !important; border: none !important; color: #fff !important; border-radius: var(--wsc-radius-sm) !important;
    padding: 10px !important; font-size: 13px !important; font-weight: 700 !important; cursor: pointer !important; transition: background .12s ease;
}
.wsc-portal-wrap .wsc-portal-login-card input[type="submit"]:hover { background: var(--wsc-primary-dark) !important; }
.wsc-portal-wrap .wsc-portal-login-card p.login-remember { font-size: 12px !important; margin-top: 10px !important; text-align: center !important; }
.wsc-portal-wrap .wsc-portal-btn {
    display: inline-block !important; background: var(--wsc-primary) !important; color: #fff !important; text-decoration: none !important;
    border-radius: var(--wsc-radius-sm) !important; padding: 9px 20px !important; font-size: 13px !important; font-weight: 700 !important;
}

/* ================= کامپوننت‌های مشترک (عینا از admin.css، فقط اسکوپ کلاس ریشه فرق دارد) ================= */

/* شبکه‌ی امنیتی عمومی: تم‌های ووکامرسی مثل وودمارت یک قانون سراسری از این جنس دارند:
   :is(.btn,.button,button,[type=submit],[type=button]) { min-height: ...px !important; ... }
   — که چون روی کل سایت (نه فقط دکمه‌های خود تم) اثر می‌گذارد، هر <button>/[type=submit] داخل
   همین پلاگین هم بلند/بزرگ می‌شود. اینجا عمدا فقط داخل .wsc-portal-wrap اسکوپ شده — یعنی فقط روی
   دکمه‌های خود پلاگین اثر می‌گذارد و به هیچ دکمه‌ی دیگری در بقیه‌ی سایت/تم دست نمی‌زند. */
.wsc-portal-wrap :is(.btn, .button, button, [type="submit"], [type="button"]) {
    min-height: 0 !important; max-height: none !important;
}
/* بعضی دکمه‌های ژنریک (مثل فیلترهای وضعیت صف انتظار) رادیوس خودشان را از هیچ‌کدام از قوانین
   بالا نمی‌گرفتند و کاملا چهارگوش می‌ماندند — احتمالا چون تم سایت روی خود تگ button/.button با
   !important رادیوس را صفر می‌کند. اینجا هم به‌صورت عمومی (بجز آیکون‌دایره‌ای‌ها) رادیوس تحمیل می‌شود. */
.wsc-portal-wrap :is(.btn, .button, button, [type="submit"], [type="button"]):not(.wsc-icon-btn):not(.wsc-portal-menu-toggle):not(.wsc-user-menu-trigger) {
    border-radius: var(--wsc-radius-btn) !important;
}
/* همون تم سایت روی هاور/فوکوس همین تگ‌ها هم یک پیل آبی توپر با رنگ متن ناخوانا تحمیل می‌کند —
   دقیقا باگی که چندبار جداگانه (تب‌های مرور کاتالوگ، دکمه‌ی ستاره‌ی روتین، سوییچ‌های نما و...) پیدا
   و تک‌تک فیکس شد. به‌جای اینکه هر دکمه‌ی خام جدید دوباره همین مشکل را داشته باشد، این یک شبکه‌ی
   امنیتی سراسری است: هر <button> ی بدون استایل هاور اختصاصی خودش، هاور/فوکوسش را با inherit خنثی
   می‌کند؛ دکمه‌های واقعی‌ای که هاور رنگی می‌خواهند (مثل .wsc-icon-btn/.wsc-catalog-browser-tab) با
   سلکتور اختصاصی خودشان که دیرتر در همین فایل می‌آید، روی این قانون برنده می‌شوند. */
/* باگ «هاور/اکتیو دکمه‌های آیکونی سفید و بی‌آیکون می‌شد»: [type="button"]:hover هم‌وزن .wsc-icon-btn:hover
   بود و چون بعدتر آمده، برنده می‌شد. با :where() وزن این قانون صفر است و هر هاور اختصاصی همیشه برنده است
   (همان راه‌حل نسخه‌ی معمولی نوبت‌دهی). */
.wsc-portal-wrap :where(button, [type="button"]):where(:hover, :focus, :focus-visible) {
    background: inherit !important; color: inherit !important; border-color: inherit !important; box-shadow: none !important;
}

/* تم سایت (مثلا ووکامرسی‌هایی مثل وودمارت) معمولا کلاس عمومی .button را در کل سایت با
   min-height/line-height/text-transform/letter-spacing/box-sizing خودش بازطراحی می‌کند — چون این نام‌ها
   ژنریک و مشترک‌اند، دکمه‌های خود پلاگین هم قربانی می‌شوند و خیلی بلندتر/بزرگ‌تر از چیزی که اینجا تعریف
   شده دیده می‌شوند. این پراپرتی‌های اضافه (که تا الان اصلا ست نمی‌شدند و جا برای تم سایت باز می‌گذاشتند)
   صریحا ریست می‌شوند تا دکمه‌ها مستقل از قالب سایت همیشه یک‌شکل بمانند. */
.wsc-portal-wrap .button,
.wsc-portal-wrap .button-secondary {
    display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important;
    border-radius: var(--wsc-radius-btn) !important; border: 1px solid var(--wsc-border) !important; background: var(--wsc-ghost-bg) !important;
    color: #475569 !important; box-shadow: none !important; padding: 12px 16px !important; height: auto !important; min-height: 0 !important; max-height: none !important;
    line-height: 20px !important; font-size: 14px !important; font-weight: 600 !important; text-transform: none !important; letter-spacing: normal !important; box-sizing: border-box !important;
    vertical-align: middle !important; margin: 0 !important; width: auto !important; min-width: 0 !important;
    cursor: pointer !important; text-decoration: none !important; transition: color .15s cubic-bezier(.4,0,.2,1), background-color .15s cubic-bezier(.4,0,.2,1), border-color .15s cubic-bezier(.4,0,.2,1), box-shadow .15s cubic-bezier(.4,0,.2,1), transform .1s ease;
}
.wsc-portal-wrap .button:hover,
.wsc-portal-wrap .button-secondary:hover { border-color: var(--wsc-primary) !important; color: var(--wsc-primary) !important; background: var(--wsc-surface) !important; }
.wsc-portal-wrap .button:active { transform: translateY(1px); }
.wsc-portal-wrap .button.button-primary {
    border-radius: var(--wsc-radius-btn) !important;
    background: var(--wsc-primary) !important; border: none !important; color: #fff !important; padding: 12px 16px !important; font-weight: 600 !important;
    box-shadow: 0 16px 40px color-mix(in srgb, var(--wsc-primary) 18%, transparent) !important;
}
.wsc-portal-wrap .button.button-primary:hover { background: var(--wsc-primary-dark) !important; color: #fff !important; transform: translateY(-1px); box-shadow: 0 16px 40px color-mix(in srgb, var(--wsc-primary) 26%, transparent) !important; }
.wsc-portal-wrap .button.button-primary:disabled,
.wsc-portal-wrap .button.button-primary[disabled] { color: #fff !important; }
.wsc-portal-wrap .button:disabled,
.wsc-portal-wrap .button[disabled] { opacity: .5 !important; cursor: not-allowed !important; transform: none; }
/* شبکه‌ی محافظ: چند دکمه (مثل لغو نهایی در «لغو همگانی») اول با متن خالی و display:none رندر
   می‌شوند و فقط بعد یک پاسخ AJAX با jQuery .text().show() پر/نمایان می‌شوند — این قانون همیشه چنین
   دکمه‌ای را (تا وقتی واقعا متنی داشته باشد) مخفی نگه می‌دارد. */
/* :not(input) حیاتی است — <input> یک تگ void است و همیشه با :empty مچ می‌شود؛ بدون این استثنا، این
   قانون خود دکمه‌ی ورود wp_login_form() (روی دیوار ورود پورتال، یک <input type="submit"> است) را هم
   کاملا مخفی می‌کرد — یک باگ واقعی که در نسخه‌ی خواهر (base plugin) کشف و رفع شده بود. */
.wsc-portal-wrap .button:empty:not(input) { display: none !important; }
/* min-height/max-height/box-sizing/line-height صریح لازم است — این‌ها هر دو معمولا <button> هستند
   (نه <a>)، پس هم اندازه‌ی پیش‌فرض نیتیو فرم‌کنترل‌های مرورگر هم قانون سراسری تم سایت روی
   button (مثل :is(...,button,...) در وودمارت) رویشان اثر می‌گذارد. */
.wsc-portal-wrap .button-link-delete {
    color: var(--wsc-danger) !important; text-decoration: none !important; font-size: 12px !important; font-weight: 600 !important; border-radius: 6px !important; padding: 2px 8px !important; background: none !important; border: none !important; cursor: pointer !important;
    min-height: 0 !important; max-height: none !important; height: auto !important; line-height: 1.6 !important; box-sizing: border-box !important; text-transform: none !important; letter-spacing: normal !important; margin: 0 !important; width: auto !important;
}
.wsc-portal-wrap .button-link-delete:hover { background: var(--wsc-danger-bg) !important; }
.wsc-portal-wrap .button-link {
    color: var(--wsc-primary) !important; text-decoration: none !important; font-size: 12px !important; font-weight: 600 !important; border-radius: 6px !important; padding: 2px 8px !important; background: none !important; border: none !important; cursor: pointer !important;
    min-height: 0 !important; max-height: none !important; height: auto !important; line-height: 1.6 !important; box-sizing: border-box !important; text-transform: none !important; letter-spacing: normal !important; margin: 0 !important; width: auto !important;
}
.wsc-portal-wrap .button-link:hover { background: var(--wsc-hover-bg) !important; }
.wsc-portal-wrap .wsc-view-toggle-btn.active { background: var(--wsc-primary) !important; color: #fff !important; border-color: var(--wsc-primary) !important; }
.wsc-portal-wrap .wsc-view-toggle-btn.active:hover { background: var(--wsc-primary-dark) !important; color: #fff !important; border-color: var(--wsc-primary-dark) !important; }

/* notice و جدول widefat در فرانت هیچ استایل پایه‌ای از هسته‌ی وردپرس نمی‌گیرند (برخلاف wp-admin)،
   پس باید همینجا از صفر تعریف شوند وگرنه کاملا بی‌ظاهر (فقط متن خام) دیده می‌شوند. */
.wsc-portal-wrap .notice {
    background: var(--wsc-surface) !important; border: 1px solid var(--wsc-border) !important; border-inline-start: 4px solid var(--wsc-muted) !important;
    border-radius: var(--wsc-radius-md) !important; padding: 12px 16px !important; margin: 0 0 16px !important; box-shadow: none !important;
}
.wsc-portal-wrap .notice p { margin: 0 !important; font-size: 13px !important; line-height: 1.9 !important; color: var(--wsc-ink) !important; }
.wsc-portal-wrap .notice-success { border-inline-start-color: var(--wsc-success) !important; background: var(--wsc-success-bg) !important; }
.wsc-portal-wrap .notice-error { border-inline-start-color: var(--wsc-danger) !important; background: var(--wsc-danger-bg) !important; }
.wsc-portal-wrap .notice-warning { border-inline-start-color: var(--wsc-warning) !important; background: var(--wsc-warning-bg) !important; }
.wsc-portal-wrap .notice-info { border-inline-start-color: var(--wsc-primary) !important; background: var(--wsc-hover-bg) !important; }
.wsc-portal-wrap .wsc-reschedule-banner.notice {
    background: var(--wsc-hover-bg) !important; border-color: var(--wsc-primary) !important;
    border-inline-start-width: 4px !important; color: var(--wsc-ink) !important;
}
.wsc-portal-wrap .wsc-reschedule-banner.notice p { color: var(--wsc-ink) !important; }
.wsc-portal-wrap .wsc-reschedule-banner.notice strong { color: var(--wsc-primary) !important; }
.wsc-portal-wrap .wsc-reschedule-banner.notice a { color: var(--wsc-primary) !important; font-weight: 700 !important; }
.wsc-portal-wrap .wsc-locked-visit-notice { display: flex !important; align-items: center !important; gap: 8px !important; background: var(--wsc-warning-bg) !important; border: 1px solid var(--wsc-warning) !important; color: var(--wsc-warning) !important; font-size: 12.5px !important; font-weight: 700 !important; }
.wsc-portal-wrap .wsc-locked-visit-notice .wsc-icon svg { width: 16px !important; height: 16px !important; flex-shrink: 0; }
.wsc-portal-wrap .wsc-history-add-locked { padding: 4px 0 !important; }
.wsc-portal-wrap .wsc-history-add-locked label { font-size: 12px !important; font-weight: 700 !important; color: var(--wsc-muted) !important; }

/* طبق خواسته‌ی صریح کارفرما («بردرهاشو بردار، با رنگ‌های لایت یکی‌درمیون بچین») — عینا هم‌خانواده
   با admin.css. border:none !important روی سلول‌ها چون تم سایت روی table/td/th سراسری بردر می‌گذارد. */
/* طبق گزارش کارفرما («گردی جدول زیاده، انگار می‌چسبه به تیتر بالاش») — رادیوس کوچک‌تر و ثابت
   (نه var(--wsc-radius-md) ی مشترک که برای کارت‌های بزرگ‌تر حساب شده بود). */
.wsc-portal-wrap table.widefat {
    border-collapse: separate !important; border-spacing: 0 !important; width: 100%; background: var(--wsc-surface) !important;
    border: none !important; border-radius: 8px !important; overflow: hidden;
}
.wsc-portal-wrap table.widefat th,
.wsc-portal-wrap table.widefat td { padding: 10px 5px !important; text-align: start !important; font-size: 13px !important; background: var(--wsc-surface) !important; color: var(--wsc-ink) !important; border: none !important; vertical-align: middle !important; }
/* دکمه‌های داخل سلول جدول (مثل «شروع ویزیت») با پدینگ استاندارد دکمه‌ها ارتفاع ردیف را الکی
   خیلی بزرگ می‌کردند؛ اینجا جمع‌وجورتر می‌شوند تا قد ردیف نسبت به بقیه‌ی ستون‌های فقط‌متنی طبیعی بماند. */
.wsc-portal-wrap table.widefat td .button { padding: 6px 14px !important; height: auto !important; }
.wsc-portal-wrap table.widefat thead th { background: var(--wsc-border-soft) !important; font-weight: 700 !important; color: var(--wsc-text-strong) !important; }
/* زبرا — یکی‌درمیون یک تینت خیلی لایت؛ رنگ وضعیت (پایین‌تر) همیشه روی آن اولویت دارد. */
.wsc-portal-wrap table.widefat tbody tr:nth-child(even) td { background: color-mix(in srgb, var(--wsc-ink) 4%, var(--wsc-surface)) !important; }
.wsc-portal-wrap table.widefat tr:has(.wsc-pill-warning) td { background: var(--wsc-warning-bg) !important; }
.wsc-portal-wrap table.widefat tr:has(.wsc-pill-success) td { background: var(--wsc-success-bg) !important; }
/* عمدا حذف شد — رجوع کنید به توضیح admin.css (پیل danger روی ستون «پرداخت‌نشده» هم هست که
   استثنا نیست، تقریبا همیشه هست، پس کل جدول را قرمز نشان می‌داد). */
.wsc-portal-wrap table.widefat tr:hover td { background: var(--wsc-hover-bg) !important; }

/* ---------- جدول اپتومتری (OD/OS) — پرکاربردترین جدول خام HTML این پلاگین، پس مقاومتش در برابر
   استایل عمومی قالب (که اغلب رنگ پس‌زمینه/بوردر دلخواه خودش را روی td/th می‌گذارد) حیاتی است. ---------- */
.wsc-portal-wrap .wsc-exam-grid-wrap { overflow-x: auto; padding-inline-start: 6px !important; }
/* table-layout:fixed + colgroup (در page-optometry.php) لازم است — وگرنه هر ستون بر اساس عریض‌ترین
   محتوای خودش (مثلا فیلد آزاد R & G) اندازه می‌گرفت و ستون‌ها اصلا هم‌سایز نمی‌شدند. */
.wsc-portal-wrap .wsc-exam-grid { direction: ltr !important; border-collapse: collapse !important; min-width: 640px; width: 100% !important; table-layout: fixed !important; }
/* white-space:nowrap روی همه‌ی th (نه فقط ردیف‌ها) لازم است — بدونش عنوان ستونی مثل «V.ACP.h» یا
   «R & G» دو خط می‌شد و چون همه‌ی سلول‌های همان ردیف باید هم‌ارتفاع بمانند، کل آن ردیف بلندتر می‌شد. */
/* overflow:hidden + text-overflow:ellipsis لازم است — با table-layout:fixed، مقدار قدیمی/آزاد
   بلندتر از عرض ستون به‌جای بیرون‌زدن از قاب، مرتب کوتاه می‌شود. */
.wsc-portal-wrap .wsc-exam-grid th, .wsc-portal-wrap .wsc-exam-grid td { border: 1px solid var(--wsc-border) !important; padding: 1px !important; text-align: center !important; font-size: 9px !important; white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; max-width: 0; background: var(--wsc-surface) !important; color: var(--wsc-ink) !important; }
.wsc-portal-wrap .wsc-exam-grid thead th { background: var(--wsc-bg) !important; font-weight: 700 !important; }
/* طبق خواسته‌ی صریح کارفرما («بین OD/OS یه تفاوت رنگ ایجاد کن، الان قاطی می‌شه») — ستون‌های ۲ تا ۷
   (شش ستون OD) یک تینت آبی خیلی‌کمرنگ و ستون‌های ۸ تا ۱۳ (شش ستون OS) یک تینت سبز خیلی‌کمرنگ
   می‌گیرند — طبق colgroup در page-optometry.php (ستون ۱ = برچسب ردیف). */
.wsc-portal-wrap .wsc-exam-grid td:nth-child(n+2):nth-child(-n+7) { background: color-mix(in srgb, var(--wsc-primary) 5%, var(--wsc-surface)) !important; }
.wsc-portal-wrap .wsc-exam-grid td:nth-child(n+8):nth-child(-n+13) { background: color-mix(in srgb, var(--wsc-success) 6%, var(--wsc-surface)) !important; }
/* ردیف اول (OD/OS با colspan=۶) — nth-child(2)=OD، nth-child(3)=OS؛ ردیف دوم (زیرستون‌های Sph/Cyl/...
   بدون سلول برچسب، چون همان یکی از ردیف بالا rowspan خورده) — ۶تای اول OD، ۶تای دوم OS. */
/* max-width:0 (از رول عمومی بالا، برای ellipsis سلول‌های تک‌ستونه) روی این ردیف colspan=۶
   باعث می‌شد متن OD/OS به‌جای وسط‌چین، به لبه بچسبد — اینجا صریحا خنثی می‌شود. */
.wsc-portal-wrap .wsc-exam-grid thead tr:first-child th { text-align: center !important; max-width: none !important; }
.wsc-portal-wrap .wsc-exam-grid thead tr:first-child th:nth-child(2) { background: color-mix(in srgb, var(--wsc-primary) 10%, var(--wsc-bg)) !important; }
.wsc-portal-wrap .wsc-exam-grid thead tr:first-child th:nth-child(3) { background: color-mix(in srgb, var(--wsc-success) 12%, var(--wsc-bg)) !important; }
.wsc-portal-wrap .wsc-exam-grid thead tr:last-child th:nth-child(-n+6) { background: color-mix(in srgb, var(--wsc-primary) 10%, var(--wsc-bg)) !important; }
.wsc-portal-wrap .wsc-exam-grid thead tr:last-child th:nth-child(n+7) { background: color-mix(in srgb, var(--wsc-success) 12%, var(--wsc-bg)) !important; }
/* برچسب ردیف نباید کوتاه/بریده شود — overflow/ellipsis/max-width عمومی بالا اینجا خنثی می‌شود و
   به‌جایش فقط فونت کوچک‌تر می‌شود؛ اگر همین یک ستون کمی بزرگ‌تر بماند اشکالی ندارد. */
.wsc-portal-wrap .wsc-exam-grid tbody th {
    background: var(--wsc-bg) !important; font-weight: 700 !important; font-size: 9.5px !important;
    /* قبلا nowrap+overflow:visible بود — روی LCD کوچیک، برچسب بلندی مثل «Near Glasses» بیرون از
       عرض ستون خودش می‌زد و روی عددهای ستون Sph کنارش می‌افتاد. الان به‌جای بیرون‌زدن، به خط بعد
       می‌شکند — هیچ‌وقت با ستون کناری قاطی نمی‌شود. */
    white-space: normal !important; line-height: 1.25 !important;
    overflow: visible !important; text-overflow: clip !important; max-width: none !important; text-align: center !important;
    padding-inline-start: 6px !important; padding-inline-end: 4px !important;
}
/* width:100% (نه px ثابت) لازم است — جدول حالا table-layout:fixed دارد و هر ستون از قبل عرض برابر
   گرفته (colgroup در page-optometry.php). */
/* طبق خواسته‌ی صریح کارفرما («از مرورگر استفاده نکن، خودت استایل شیک بزن») — باکس واقعی
   بردردار/بک‌گراندی، هم‌خانواده با بقیه‌ی فیلدهای برنامه. مقدار همیشه وسط‌چین است. */
.wsc-portal-wrap .wsc-exam-input {
    width: 100% !important; box-sizing: border-box !important; border: 1px solid var(--wsc-form-border) !important; border-radius: 6px !important;
    background: var(--wsc-field-bg) !important; text-align: center !important; font-size: 10.5px !important; font-weight: 600 !important;
    padding: 2px 3px !important; color: var(--wsc-ink) !important; min-height: auto !important; height: 22px !important; line-height: 16px !important;
    transition: border-color .12s ease, box-shadow .12s ease, background .12s ease;
}
.wsc-portal-wrap .wsc-exam-input:hover { border-color: var(--wsc-primary) !important; }
.wsc-portal-wrap .wsc-exam-input:focus { outline: none !important; border-color: var(--wsc-primary) !important; box-shadow: 0 0 0 2px var(--wsc-hover-bg) !important; background: var(--wsc-surface) !important; }
/* Sph/Cyl/VA حالا دراپ‌داون‌اند نه فیلد آزاد. */
select.wsc-exam-select { appearance: none !important; -webkit-appearance: none !important; -moz-appearance: none !important; text-align-last: center !important; cursor: pointer !important; }

/* ---------- کارت ویزیت پزشک: سابقه، تاریخ‌ها، پیک‌لیست کاتالوگ ---------- */
/* طبق بازخورد دکتر («سابقه‌ی بیمار الکی بزرگه») این بخش عمدا خیلی فشرده‌تر شد — عمدا تعداد ستون
   ثابت (نه auto-fit): با auto-fit، این ۶ کارت سابقه (CC/PMH/...) به‌جای شکستن به چند ردیف، در یک
   ردیف عریض کنار هم می‌ایستادند و کارت باید افقی اسکرول می‌خورد. */
/* align-items:start عمدا اضافه شد — پیش‌فرض grid یعنی stretch، پس اگر یکی از کارت‌ها (مثلا چون
   چیپ دارد) بلندتر از هم‌ردیفی‌هایش می‌شد، همه‌ی هم‌ردیفی‌های خالی هم به‌زور به همان ارتفاع کشیده
   می‌شدند — دقیقا همان «کادرهای آبی الکی بلند» که کارفرما گزارش داد، نه یک باگ position. */
.wsc-portal-wrap .wsc-history-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; align-items: start; }
@media (max-width: 782px) {
    .wsc-portal-wrap .wsc-history-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 480px) {
    .wsc-portal-wrap .wsc-history-grid { grid-template-columns: 1fr; }
}
/* هر دسته (CC/PMH/...) یک مینی‌کارت جدا با حاشیه/پس‌زمینه‌ی مختص خودش — قبلا فقط یک برچسب معلق
   بالای چیپ‌ها بود، بدون هیچ مرزی که دسته‌ها را از هم جدا کند.
   طبق خواسته‌ی کارفرما، wsc-history-col الان فقط یک wrapper بزرگ‌تر (بدون بک‌گراند) است؛ خود
   کارت رنگی روی wsc-history-card است، و چیپ‌ها بیرون آن کارت (sibling ی، نه فرزند آن). */
.wsc-portal-wrap .wsc-history-col { display: flex !important; flex-direction: column !important; }
.wsc-portal-wrap .wsc-history-card {
    background: var(--wsc-bg) !important; border: 1px solid var(--wsc-border-soft) !important; border-radius: var(--wsc-radius-sm) !important;
    padding: 6px !important;
}
.wsc-portal-wrap .wsc-history-col label {
    display: inline-flex !important; align-items: center !important; font-size: 9.5px !important; font-weight: 800 !important; letter-spacing: .2px;
    margin-bottom: 4px !important; padding: 1px 7px !important; border-radius: 999px !important; background: var(--wsc-hover-bg) !important; color: var(--wsc-primary) !important;
    cursor: pointer !important;
}
.wsc-portal-wrap .wsc-history-chips, .wsc-portal-wrap .wsc-selected-items { display: flex !important; flex-wrap: wrap !important; gap: 3px !important; margin-bottom: 4px !important; min-height: 18px; }
.wsc-portal-wrap .wsc-history-chips { margin-top: 4px !important; }
/* وقتی سابقه‌ای ثبت نشده، این جعبه به‌جای یک نوار خالی بی‌معنی، کاملا جمع می‌شود. */
.wsc-portal-wrap .wsc-history-chips:empty, .wsc-portal-wrap .wsc-selected-items:empty { display: none !important; min-height: 0; margin-bottom: 0 !important; }
.wsc-portal-wrap .wsc-chip {
    display: inline-flex !important; align-items: center !important; gap: 3px !important; background: var(--wsc-surface) !important; color: var(--wsc-ink) !important;
    border: 1px solid var(--wsc-border-soft) !important; border-radius: 999px !important; padding: 3px 8px !important; font-size: 11.5px !important; font-weight: 600 !important; white-space: nowrap; line-height: 1.5;
    box-shadow: 0 1px 2px rgba(15,23,42,.04); transition: opacity .15s ease;
}
/* طبق بازخورد صریح کارفرما («موارد انتخابی رو نمیشه پاک کرد») — دیگر پشت حالت «ویرایش» قفل
   نیست؛ دکمه‌ی × همیشه دیده می‌شود، دقیقا هم‌رفتار با .wsc-selected-items. */
/* چیپ خوش‌بینانه (optimistic) — قبل از تایید سرور کمی کم‌رنگ‌تر نشان داده می‌شود تا حس «در حال ثبت»
   بدهد، بدون اینکه کاربر منتظر رفت‌وبرگشت شبکه بماند تا اصلا چیزی ببیند. */
.wsc-portal-wrap .wsc-chip-pending { opacity: .55 !important; }
/* عمدا عرض/ارتفاع ثابت ندارد — یک باکس دقیقا مربع (مثلا ۱۸×۱۸) کنار متن خیلی کوتاه (یک حرف/عدد)
   باعث می‌شد کل چیپ تقریبا هم‌عرض و هم‌ارتفاع بشود و border-radius:999px آن را دایره‌ای دفورمه نشان
   بدهد؛ با padding به‌جای اندازه‌ی ثابت، دکمه همیشه متناسب با فونت خودش می‌ماند. */
.wsc-portal-wrap .wsc-chip-remove {
    display: inline-flex !important; align-items: center !important; justify-content: center !important;
    background: none !important; border: none !important; border-radius: 50% !important; padding: 2px !important;
    cursor: pointer !important; color: var(--wsc-danger) !important; font-size: 13.5px !important; line-height: 1 !important; flex-shrink: 0;
    transition: background .12s ease;
}
.wsc-portal-wrap .wsc-chip-remove:hover { background: var(--wsc-danger-bg) !important; }
.wsc-portal-wrap .wsc-history-add { display: flex !important; gap: 4px !important; position: relative; align-items: stretch !important; }
.wsc-portal-wrap .wsc-history-add .wsc-history-input { flex: 1; border-radius: var(--wsc-radius-sm) !important; border: 1px solid var(--wsc-form-border) !important; background: var(--wsc-surface) !important; padding: 4px 7px !important; font-size: 10.5px !important; color: var(--wsc-ink) !important; box-sizing: border-box !important; }
/* دکمه‌ی «+» کنار فیلد افزودن سابقه، هم‌ارتفاع خود فیلد. */
/* هر دو دکمه (+ و مرور استاندارد) عمدا ارتفاع صریح یکسان (نه auto/stretch) دارند — قبلا
   دکمه‌ی مرور فقط width/height:22px داشت ولی box-sizing اش border-box نبود، پس بردر ۱px ی
   .wsc-icon-btn به آن اضافه می‌شد و کمی بزرگ‌تر/نامتقارن با دکمه‌ی + دیده می‌شد. */
.wsc-portal-wrap .wsc-history-add-btn { width: 24px !important; height: 24px !important; padding: 0 !important; font-size: 12px !important; min-height: 0 !important; max-height: none !important; line-height: 1 !important; box-sizing: border-box !important; flex-shrink: 0; }
.wsc-portal-wrap .wsc-history-browse-btn {
    width: 24px !important; height: 24px !important; min-width: 24px !important; min-height: 24px !important;
    padding: 0 !important; margin: 0 !important; border-radius: 50% !important; box-sizing: border-box !important; flex-shrink: 0;
}
.wsc-portal-wrap .wsc-history-browse-btn .wsc-icon svg { width: 12px; height: 12px; }
.wsc-portal-wrap .wsc-history-browse-btn:hover { color: #fff !important; }
/* شبکه‌ی امنیتی عمومی .button روی margin هم صفر می‌گذارد؛ این دو دکمه اما تنها/مستقل‌اند و به یک
   فاصله‌ی صریح از عنصر بالایی نیاز دارند — سلکتور ID عمدا استفاده شده تا از آن قانون عمومی‌تر جلو بزند. */
#wsc-save-doctor-notes-btn { margin-top: 8px !important; }
#wsc-save-auto-backup-btn { margin-top: 10px !important; }
#wsc-start-walkin-btn { margin-top: 10px !important; }
/* !important لازم است: این عنصر کلاس wsc-search-results را هم دارد (برای ظاهر مشترک ردیف‌های
   نتیجه)، و آن کلاس position:relative دارد — بدون !important، چون آن رول بعدتر در فایل می‌آید،
   برنده می‌شد و این دراپ‌داون به‌جای شناور بودن، داخل چیدمان کارت جا می‌گرفت و فضای خالی/چسبیدگی
   می‌ساخت (دقیقا همان چیزی که کارفرما گزارش داد: «باید کلا از کادر بیرون بیاد»). */
.wsc-portal-wrap .wsc-history-suggestions { position: absolute !important; top: calc(100% + 6px) !important; inset-inline-start: 0 !important; inset-inline-end: 0 !important; z-index: 20 !important; }

/* طبق بازخورد دکتر، ستون تاریخ‌ها هم فشرده‌تر شد تا کنار جدول اپتومتری جا بگیرد و نگاه‌کردن سریع
   به تاریخ‌های قبلی راحت‌تر باشد. */
/* min-width اینجا حیاتی است — قانون عمومی .wsc-two-col > div (پایین‌تر) min-width:320px می‌دهد که
   بدون این override، این ستون هیچ‌وقت واقعا به ۱۷۰px جمع نمی‌شد و جدول اپتومتری کنارش را فشرده می‌کرد. */
.wsc-portal-wrap .wsc-two-col .wsc-dates-col { flex: 0 1 170px !important; min-width: 150px !important; }
.wsc-portal-wrap .wsc-two-col .wsc-optometry-view-col { flex: 1 1 560px !important; min-width: 320px !important; }
.wsc-portal-wrap .wsc-date-list { list-style: none; margin: 0 !important; padding: 4px !important; max-height: 420px; overflow-y: auto; }
.wsc-portal-wrap .wsc-date-list li { margin-bottom: 4px !important; }
/* طبق گزارش کارفرما («الکی گنده شده») — بعد تبدیل ردیف‌ها به کارت، پدینگ خیلی زیاد شده بود؛ الان
   جمع‌وجورتر است. طبق بازخورد دوم کارفرما («بج کوچیک "امروز" بدفرمه، فقط سبزشدن خود کارت کافیه»)،
   دیگر هیچ بج متنی‌ای چاپ نمی‌شود — کلاس wsc-date-today مستقیم روی خود <a> می‌نشیند (نه یک span
   داخلش) و کل کارت را سبز می‌کند. */
.wsc-portal-wrap .wsc-date-list a {
    display: block !important; padding: 6px 10px !important; border-radius: var(--wsc-radius-sm) !important; text-decoration: none !important;
    color: var(--wsc-ink) !important; background: var(--wsc-bg) !important; border: 1px solid var(--wsc-border-soft) !important;
    font-weight: 600 !important; font-size: 11px !important; line-height: 1.3 !important; transition: background .12s ease, border-color .12s ease;
}
.wsc-portal-wrap .wsc-date-list a:hover { background: var(--wsc-hover-bg) !important; border-color: var(--wsc-primary) !important; }
.wsc-portal-wrap .wsc-date-list a.wsc-date-today { background: var(--wsc-success-bg) !important; border-color: var(--wsc-success) !important; }
.wsc-portal-wrap .wsc-date-list a.active { background: var(--wsc-primary) !important; border-color: var(--wsc-primary) !important; color: #fff !important; box-shadow: var(--wsc-shadow-card); }
/* طبق گزارش کارفرما («فاصله‌ی نوشته/تاریخ کم بشه») — margin-top منفی شد چون فقط margin:0 کافی نبود؛
   ارتفاع خط خود فونت (line-height) هنوز یک فاصله‌ی محسوس بین دو خط می‌ساخت. */
.wsc-portal-wrap .wsc-date-list a small { display: block !important; font-size: 9.5px !important; opacity: .8; line-height: 1.2 !important; margin-top: -1px !important; font-weight: 400 !important; }
/* قبلا با فاصله (.wsc-exam-grid-readonly .wsc-exam-grid) نوشته شده بود که یعنی «فرزند»، درحالی‌که
   هر دو کلاس روی خود یک <table> اند (نه دوتا المنت توی‌هم) — پس این رول هیچ‌وقت مچ نمی‌شد، دقیقا
   همون باگ compound-selector ی که قبلا با .wsc-portal-guest هم داشتیم. با حذف فاصله (ترکیبی/compound
   شدنش) الان واقعا اعمال می‌شود؛ وسط‌چین هم صریحا تکرار شد که مطمئن باشیم. */
.wsc-portal-wrap table.wsc-exam-grid.wsc-exam-grid-readonly td { font-size: 10px !important; text-align: center !important; }
/* طبق خواسته‌ی صریح کارفرما («فقط توی جدول پزشک، ردیف‌های زوج یه سایه بگیرن تا ردیف‌ها از هم جدا
   دیده بشن») — فقط همین جدول فقط‌خواندنی (نه جدول ویرایش اپتومتری) این افکت را می‌گیرد. */
/* منظور کارفرما یک زبرای کلاسیک بود (رنگ ردیف‌های فرد کمی فرق کند)، نه سایه/بلور داخلی — filter:brightness
   استفاده شد (نه یک رنگ ثابت جدید) چون این سلول‌ها از قبل رنگ OD/OS ی خودشان را دارند (آبی/سبز
   خیلی‌کمرنگ) و می‌خواستیم آن رنگ زمینه هرچه بود کمی تیره‌تر شود، نه با یک رنگ ثابت دیگر جایگزین شود. */
.wsc-portal-wrap table.wsc-exam-grid.wsc-exam-grid-readonly tbody tr:nth-child(odd) td { filter: brightness(0.97) !important; }

/* auto-fit — عینا هم‌خانواده با admin.css (رجوع کنید به توضیح آنجا): چون هر ستون از تنظیمات
   می‌تواند مخفی شود، تعداد واقعی ستون‌ها ۱ تا ۴ متغیر است. */
.wsc-portal-wrap .wsc-encounter-items-grid { display: grid !important; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)) !important; gap: 16px !important; }
.wsc-portal-wrap .wsc-encounter-col { min-width: 0; overflow-x: hidden; }
.wsc-portal-wrap .wsc-encounter-col h4 { margin: 0 0 6px !important; font-size: 12px !important; font-weight: 800 !important; color: var(--wsc-primary) !important; text-align: left !important; direction: ltr !important; }
/* بدون این رول، دکمه‌ی مرور دسته‌بندی‌شده (فقط روی ستون تشخیص) چون ردیف والد display:flex نداشت،
   بعد از اینپوت width:100% به خط بعد می‌افتاد/روی گوشه‌ی اینپوت می‌نشست — دقیقا همان به‌هم‌ریختگی و
   ناهم‌ترازی نسبت به سه ستون دیگر (سرویس/جراحی/دارو) که این دکمه را ندارند. */
.wsc-portal-wrap .wsc-catalog-search-row { display: flex !important; align-items: center !important; gap: 6px !important; margin-bottom: 5px !important; direction: ltr !important; }
.wsc-portal-wrap .wsc-catalog-search-row .wsc-catalog-search-input { text-align: left !important; direction: ltr !important; }
.wsc-portal-wrap .wsc-catalog-search-input { flex: 1 !important; min-width: 0 !important; width: auto !important; border-radius: var(--wsc-radius-sm) !important; border: 1px solid var(--wsc-form-border) !important; background: var(--wsc-bg) !important; padding: 6px 9px !important; font-size: 11.5px !important; margin-bottom: 0 !important; color: var(--wsc-ink) !important; }
.wsc-portal-wrap .wsc-catalog-search-row .wsc-icon-btn {
    width: 28px !important; height: 28px !important; min-width: 28px !important; min-height: 28px !important;
    padding: 0 !important; margin: 0 !important; border-radius: 50% !important; box-sizing: border-box !important; flex-shrink: 0;
}
.wsc-portal-wrap .wsc-catalog-search-row .wsc-icon-btn .wsc-icon svg { width: 14px; height: 14px; }
/* طبق بازخورد دکتر («حداقل ۱۰ گزینه رو نشون بده») — با ردیف‌های فشرده‌تر پایین، ۳۸۰px تقریبا
   ۱۰-۱۲ ردیف را بدون اسکرول نشان می‌دهد، نه فقط ۴-۵ تا مثل قبل. */
.wsc-portal-wrap .wsc-catalog-results { max-height: 420px; overflow-y: auto; border: 1px solid var(--wsc-border-soft) !important; border-radius: var(--wsc-radius-sm) !important; margin-bottom: 6px !important; }
.wsc-portal-wrap .wsc-catalog-results:empty { display: none; }
/* طبق بازخورد پزشک، این ردیف‌ها خیلی ریزتر شدند تا تعداد بیشتری آیتم بدون اسکرول دیده شود. */
.wsc-portal-wrap .wsc-catalog-result-row { display: flex !important; align-items: center !important; gap: 3px !important; padding: 2px 6px !important; border-bottom: 1px solid var(--wsc-border-soft) !important; flex-wrap: wrap; min-height: 22px; direction: ltr !important; }
.wsc-portal-wrap .wsc-catalog-result-row:last-child { border-bottom: none !important; }
.wsc-portal-wrap .wsc-catalog-result-row:hover { background: var(--wsc-bg) !important; }
/* طبق خواسته‌ی صریح کارفرما («نوشته‌ها انگلیسیه، باید چپ‌چین بشه») — اسم بیماری‌ها/آیتم‌ها همیشه
   انگلیسی‌اند، پس چپ‌چین/LTR طبیعی‌تر می‌خواند (مخصوصا وقتی متن به خط دوم می‌شکند). */
.wsc-portal-wrap .wsc-catalog-result-name { flex: 1; font-size: 10.5px !important; min-width: 80px; color: var(--wsc-ink) !important; text-align: left !important; direction: ltr !important; }
.wsc-portal-wrap .wsc-catalog-custom-row { background: var(--wsc-bg) !important; }
.wsc-portal-wrap .wsc-star-btn { background: none !important; border: none !important; cursor: pointer !important; color: var(--wsc-form-border) !important; font-size: 12px !important; padding: 0 2px !important; }
.wsc-portal-wrap .wsc-star-btn.active { color: #f59e0b !important; }
/* دکمه‌های OD/OS/هردو باید عرض ثابت یکسان بگیرند وگرنه هرکدام به اندازه‌ی متن خودشان جمع می‌شوند و
   ردیف نتیجه‌ی جستجو نامرتب/فشرده به‌نظر می‌رسد. */
/* باگ واقعی اسپسیفیسیتی: دکمه‌ی «افزودن» (برای دارو) علاوه‌بر wsc-add-item-btn، کلاس button-primary
   هم دارد؛ .wsc-portal-wrap .button.button-primary (بالاتر) با ۳ کلاس اسپسیفیسیتی بیشتری از
   .wsc-add-item-btn تنها (۱ کلاس) دارد، پس حتی با !important روی هر دو، آن قانون برنده می‌شد و
   padding:8px 16px خودش را تحمیل می‌کرد — دقیقا همان چیزی که کاربر روی دکمه‌های «افزودن» (نه
   OD/OS که کلاس button-primary ندارند) می‌دید. سلکتور اول اینجا عمدا هم‌ارز همان اسپسیفیسیتی
   ساخته شده تا با ترتیب قرارگیری بعدتر در فایل برنده شود. */
.wsc-portal-wrap .button.wsc-add-item-btn,
.wsc-portal-wrap .wsc-add-item-btn {
    padding: var(--wsc-catalog-btn-padding-v, 1px) var(--wsc-catalog-btn-padding-h, 2px) !important; font-size: 9px !important; line-height: 1.4 !important; height: auto !important; min-height: 0 !important;
    max-height: none !important; border-radius: 4px !important; min-width: 24px !important; width: auto !important; text-align: center !important;
    text-transform: none !important; letter-spacing: normal !important; box-sizing: border-box !important; margin: 0 !important; vertical-align: middle !important;
    flex-shrink: 0;
}
/* هاور خود دکمه‌ی OD/OS/هردو عمدا بک‌گراند توپر آبی + متن سفید — نه یک بک‌گراند غیرشفاف/ارواحی
   که روی بک‌گراند آبی هاور خود ردیف (wsc-catalog-result-row:hover) بنشیند و متن خاکستری‌تیره‌اش
   کم‌کنتراست/«سیاه» دیده شود. */
.wsc-portal-wrap .button.wsc-add-item-btn:hover,
.wsc-portal-wrap .wsc-add-item-btn:hover { background: var(--wsc-primary) !important; border-color: var(--wsc-primary) !important; color: #fff !important; }

/* ---------- Select سفارشی — عینا هم‌خانواده با admin.css (رجوع کنید به توضیح آنجا) ---------- */
.wsc-portal-wrap .wsc-custom-select { position: relative !important; width: 100%; }
.wsc-portal-wrap .wsc-custom-select .wsc-custom-select-native { display: none !important; }
/* سایز پیش‌فرض، استاندارد همه‌ی فیلدهای برنامه — عینا هم‌خانواده با admin.css (رجوع کنید به
   توضیح آنجا برای اینکه چرا دیگر فقط جدول اپتومتری نیست). */
.wsc-portal-wrap .wsc-custom-select-trigger {
    width: 100% !important; height: 44px !important; box-sizing: border-box !important; display: flex !important; align-items: center !important; justify-content: space-between !important;
    border-radius: var(--wsc-radius-md) !important; border: 1px solid var(--wsc-form-border) !important; background: var(--wsc-field-bg) !important;
    padding: 0 12px !important; font-size: 14px !important; font-weight: 500 !important; font-family: inherit !important; color: var(--wsc-ink) !important; cursor: pointer !important;
    margin: 0 !important; box-shadow: none !important; text-align: right !important;
    transition: border-color .12s ease, background-color .12s ease, box-shadow .12s ease;
}
.wsc-portal-wrap .wsc-custom-select-trigger:hover { border-color: var(--wsc-primary) !important; }
.wsc-portal-wrap .wsc-custom-select-trigger.is-open { border-color: var(--wsc-primary) !important; background: var(--wsc-surface) !important; box-shadow: 0 0 0 2px var(--wsc-hover-bg) !important; }
/* سایز فشرده — فقط جدول اپتومتری — عینا هم‌خانواده با admin.css */
.wsc-portal-wrap .wsc-custom-select-compact .wsc-custom-select-trigger {
    height: 22px !important; border-radius: 6px !important; padding: 0 4px !important; font-size: 10.5px !important; font-weight: 600 !important; text-align: center !important;
}
.wsc-portal-wrap .wsc-custom-select-compact .wsc-custom-select-chevron { width: 10px !important; height: 10px !important; }
.wsc-portal-wrap .wsc-custom-select-value { flex: 1; overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; direction: ltr !important; }
.wsc-portal-wrap .wsc-custom-select-chevron { width: 14px !important; height: 14px !important; flex-shrink: 0; color: var(--wsc-muted) !important; transition: transform .15s ease; }
.wsc-portal-wrap .wsc-custom-select-trigger.is-open .wsc-custom-select-chevron { transform: rotate(180deg); color: var(--wsc-primary) !important; }
/* این پنل عمدا با appendChild مستقیم به body اضافه می‌شود (نه داخل .wsc-portal-wrap — به‌خاطر
   position:fixed و جدول اپتومتری که overflow-x:auto دارد، رجوع کنید به توضیح custom-select.js)،
   پس اگر این سلکتورها با پیشوند «.wsc-portal-wrap » (فاصله‌دار) نوشته شوند هرگز مچ نمی‌شوند —
   دقیقا همان باگی که این پنل را در پورتال کاملا بی‌استایل (بدون بک‌گراند/بردر) نشان می‌داد. */
.wsc-custom-select-panel {
    display: none; flex-direction: column; position: fixed; z-index: 9500 !important;
    background: var(--wsc-surface) !important; border: 1px solid var(--wsc-border) !important; border-radius: var(--wsc-radius-md) !important;
    box-shadow: var(--wsc-shadow-card-hover) !important; padding: 0 !important; max-height: 300px !important; overflow: hidden !important; margin: 0 !important;
}
.wsc-custom-select-panel.is-open { display: flex !important; }
/* طبق خواسته‌ی صریح کارفرما («بشه تایپ کرد داخلش جستجو کنه») — عینا هم‌خانواده با admin.css. */
/* طبق گزارش کارفرما («جستجو از چپ‌وراست چسبیده») — تم سایت روی input[type=text] سراسری
   margin/width:100% تحمیل می‌کند؛ اینجا با یک سلکتور خاص‌تر (پنل+اینپوت، نه فقط خود کلاس) و
   box-sizing:border-box صریح خنثی می‌شود تا حاشیه واقعا دیده شود. */
.wsc-custom-select-panel .wsc-custom-select-search {
    display: block !important; flex-shrink: 0; box-sizing: border-box !important; width: auto !important;
    margin: 8px !important; padding: 8px 10px !important; border-radius: var(--wsc-radius-sm) !important;
    border: 1px solid var(--wsc-form-border) !important; background: var(--wsc-bg) !important; font-size: 13px !important;
    font-family: inherit !important; color: var(--wsc-ink) !important; outline: none !important; box-shadow: none !important;
}
.wsc-custom-select-panel .wsc-custom-select-search:focus { border-color: var(--wsc-primary) !important; box-shadow: 0 0 0 2px var(--wsc-hover-bg) !important; }
.wsc-custom-select-list { overflow-y: auto !important; padding: 0 4px 4px !important; }
.wsc-custom-select-option { padding: 7px 10px !important; border-radius: 6px !important; font-size: 12.5px !important; color: var(--wsc-ink) !important; cursor: pointer !important; text-align: center !important; font-family: inherit !important; direction: ltr !important; }
.wsc-custom-select-option.wsc-hidden { display: none !important; }
.wsc-custom-select-option:hover { background: var(--wsc-border-soft) !important; }
.wsc-custom-select-option.is-selected { background: var(--wsc-hover-bg) !important; color: var(--wsc-primary) !important; font-weight: 700 !important; }
.wsc-custom-select-empty { padding: 10px 12px !important; font-size: 12px !important; color: var(--wsc-muted) !important; }

/* ---------- فرم پذیرش ---------- */
/* این ورودی‌های قیمت داخل سلول جدول‌اند نه داخل .wsc-field، پس استایل عمومی فیلدها به آن‌ها نمی‌رسد. */
.wsc-portal-wrap .wsc-reception-item-price {
    width: 130px !important; border-radius: var(--wsc-radius-sm) !important; border: 1px solid var(--wsc-form-border) !important; background: var(--wsc-bg) !important;
    padding: 6px 9px !important; font-size: 13px !important; color: var(--wsc-text-strong) !important;
}
.wsc-portal-wrap .wsc-reception-item-price:disabled { background: var(--wsc-border-soft) !important; color: var(--wsc-muted) !important; cursor: not-allowed !important; }
#wsc-reception-total { color: var(--wsc-primary) !important; font-size: 16px !important; }

.wsc-portal-wrap .wsc-btn { display: inline-flex !important; align-items: center !important; gap: 6px !important; padding: 10px 18px !important; border-radius: var(--wsc-radius-sm) !important; font-size: 13px !important; font-weight: 700 !important; text-decoration: none !important; cursor: pointer !important; border: none !important; }
.wsc-portal-wrap .wsc-btn-light { background: #fff !important; color: var(--wsc-primary-dark) !important; box-shadow: 0 2px 4px rgba(0,0,0,.1) !important; }

/* عمدا همه‌جا با پیشوند .wsc-portal-wrap (نه فقط !important تنها) — این دو کامپوننت تنها جاهایی
   در کل فایل بودند که این پیشوند را نداشتند (specificity فقط ۰,۰,۱,۰)، پس تم سایت (که روی همین
   صفحات فرانت لود می‌شود، برخلاف wp-admin) با یک سلکتور کمی مشخص‌تر خودش می‌توانست همچنان برنده
   شود — دقیقا همان تب/زیرتب «وسطش مشکی/پرشده» که کارفرما بارها گزارش داد. */
.wsc-portal-wrap .wsc-tabs { display: flex !important; gap: 4px !important; border-bottom: 1px solid var(--wsc-border) !important; margin-bottom: 20px !important; flex-wrap: wrap; }
.wsc-portal-wrap .wsc-tab { appearance: none !important; background: transparent !important; border: none !important; cursor: pointer !important; padding: 10px 16px !important; font-size: 13px !important; font-weight: 700 !important; color: var(--wsc-muted) !important; border-bottom: 2px solid transparent !important; margin-bottom: -1px !important; text-decoration: none !important; }
.wsc-portal-wrap .wsc-tab:hover, .wsc-portal-wrap .wsc-tab:focus { color: var(--wsc-ink) !important; background: transparent !important; text-decoration: none !important; }
.wsc-portal-wrap .wsc-tab.active, .wsc-portal-wrap .wsc-tab.active:hover, .wsc-portal-wrap .wsc-tab.active:focus { color: var(--wsc-primary) !important; border-bottom-color: var(--wsc-primary) !important; background: transparent !important; }
.wsc-portal-wrap .wsc-panel[hidden] { display: none; }

/* overflow-y صریحا visible لازم است: بدون آن، مرورگر overflow-y را هم خودکار auto حساب می‌کند —
   یعنی هر پاپ‌آپ مطلق‌موقعیت‌دهی‌شده‌ای که از کارت بیرون بزند (مثل تقویم شمسی)، یک اسکرول‌بار
   عمودی ناخواسته روی کل کارت می‌ساخت، حتی وقتی محتوای خود کارت جا داشت. */
/* طبق خواسته‌ی کارفرما («فاصله‌ی سکشن‌ها یه‌ذره زیاده») — پدینگ/فاصله‌ی بین کارت‌ها کمی جمع‌تر شد. */
.wsc-portal-wrap .wsc-panel-card { background: var(--wsc-glass-bg) !important; border: 1px solid var(--wsc-glass-border) !important; border-radius: var(--wsc-radius-lg) !important; backdrop-filter: var(--wsc-glass-blur) !important; -webkit-backdrop-filter: var(--wsc-glass-blur) !important; padding: 18px !important; margin-bottom: 14px !important; box-shadow: var(--wsc-shadow-card) !important; overflow-x: auto; overflow-y: visible; transition: box-shadow .25s ease; }
.wsc-portal-wrap .wsc-panel-card:hover { box-shadow: var(--wsc-shadow-card-hover) !important; }
.wsc-portal-wrap .wsc-panel-card-danger { border-color: #fecaca !important; background: var(--wsc-danger-bg) !important; }
.wsc-portal-wrap .wsc-panel-card-warning { border-color: #fde68a !important; background: var(--wsc-warning-bg) !important; }
.wsc-portal-wrap .wsc-panel-card-head { display: flex !important; align-items: center !important; gap: 10px !important; margin-bottom: 16px !important; flex-wrap: wrap; justify-content: space-between !important; }
.wsc-portal-wrap .wsc-panel-card-head h2, .wsc-portal-wrap .wsc-panel-card-head h3 { margin: 0 !important; font-size: 15px !important; font-weight: 800 !important; color: var(--wsc-ink) !important; }
.wsc-portal-wrap .wsc-panel-card-head p { margin: 4px 0 0 !important; font-size: 12px !important; color: var(--wsc-muted) !important; }

/* الگوی Negah UI: نقطه‌ی رنگی + متن، بدون نیاز به تغییر HTML/PHP (currentColor خودکار رنگ خود پیل را می‌گیرد). */
.wsc-portal-wrap .wsc-pill { display: inline-flex !important; align-items: center !important; gap: 6px !important; padding: 4px 12px !important; border-radius: 999px !important; font-size: 11px !important; font-weight: 700 !important; }
.wsc-portal-wrap .wsc-pill::before { content: ""; width: 6px; height: 6px; min-width: 6px; border-radius: 999px; background: currentColor; }
.wsc-portal-wrap .wsc-pill-success { background: var(--wsc-success-bg) !important; color: var(--wsc-success) !important; }
.wsc-portal-wrap .wsc-pill-muted { background: var(--wsc-border-soft) !important; color: var(--wsc-muted) !important; }
.wsc-portal-wrap .wsc-pill-danger { background: var(--wsc-danger-bg) !important; color: var(--wsc-danger) !important; }
.wsc-portal-wrap .wsc-pill-warning { background: var(--wsc-warning-bg) !important; color: var(--wsc-warning) !important; }
.wsc-portal-wrap .wsc-pill-followup { background: #e0f2fe !important; color: #0369a1 !important; }
.wsc-portal-wrap .wsc-appt-chip .wsc-pill-followup { flex: 0 0 auto !important; white-space: nowrap !important; }
.wsc-portal-wrap .wsc-pill-reason { background: var(--wsc-hover-bg) !important; color: var(--wsc-primary) !important; }
.wsc-portal-wrap .wsc-pill-late { background: #dbeafe !important; color: #1d4ed8 !important; }

.wsc-portal-wrap .wsc-field { margin-bottom: 16px !important; }
.wsc-portal-wrap .wsc-field:last-child { margin-bottom: 0 !important; }
.wsc-portal-wrap .wsc-field > label { display: block !important; font-size: 12.5px !important; font-weight: 700 !important; color: var(--wsc-text-strong) !important; margin-bottom: 7px !important; }
/* min-height بدون !important یک باگ خودش بود — روی سایت‌های ووکامرسی (مثل وودمارت) که min-height
   خودشان را روی input/select با !important تحمیل می‌کنند، این مقدار اصلا اعمال نمی‌شد. */
.wsc-portal-wrap .wsc-field input[type="text"], .wsc-portal-wrap .wsc-field input[type="number"], .wsc-portal-wrap .wsc-field input[type="time"], .wsc-portal-wrap .wsc-field input[type="file"],
.wsc-portal-wrap .wsc-field select, .wsc-portal-wrap .wsc-field textarea {
    width: 100% !important; border-radius: var(--wsc-radius-btn) !important; border: 1px solid var(--wsc-border) !important; padding: 12px 16px !important; font-size: 14px !important; line-height: 20px !important; min-height: 48px !important;
    font-family: inherit !important; background: var(--wsc-field-bg) !important; color: var(--wsc-ink) !important; box-sizing: border-box !important;
}
.wsc-portal-wrap .wsc-field textarea { min-height: 90px !important; }
.wsc-portal-wrap .wsc-field input[type="text"]:focus, .wsc-portal-wrap .wsc-field input[type="number"]:focus, .wsc-portal-wrap .wsc-field input[type="time"]:focus,
.wsc-portal-wrap .wsc-field select:focus, .wsc-portal-wrap .wsc-field textarea:focus { outline: none !important; border-color: var(--wsc-primary) !important; background: var(--wsc-surface) !important; box-shadow: 0 0 0 3px var(--wsc-hover-bg) !important; }

/* چک‌باکس سفارشی Negah — عینا هم‌خانواده با admin.css. */
.wsc-portal-wrap input[type="checkbox"] {
    appearance: none !important; -webkit-appearance: none !important; -moz-appearance: none !important;
    width: 20px !important; height: 20px !important; min-width: 20px; min-height: 20px !important; flex-shrink: 0;
    border: 1.5px solid var(--wsc-border) !important; border-radius: 6px !important; background: var(--wsc-field-bg) !important;
    cursor: pointer !important; position: relative; margin: 0 !important; vertical-align: middle;
    transition: background-color .15s ease, border-color .15s ease;
}
.wsc-portal-wrap input[type="checkbox"]:checked { background: var(--wsc-primary) !important; border-color: var(--wsc-primary) !important; }
.wsc-portal-wrap input[type="checkbox"]:checked::after {
    content: ""; position: absolute; inset: 0; margin: auto;
    width: 5px; height: 9px; border: solid #fff; border-width: 0 2px 2px 0;
    transform: rotate(45deg) translate(-1px, -2px);
}
.wsc-portal-wrap input[type="checkbox"]:focus-visible { outline: 2px solid var(--wsc-hover-bg) !important; outline-offset: 2px; }
/* یک باگ شناخته‌شده در کروم/وبکیت: input[type=number] در جهت rtl حتی با ارث direction از والد،
   متن/پلیس‌هولدرش را تقریبا وسط‌چین نشان می‌دهد. ست‌کردن صریح direction/text-align مستقیم روی خود
   input (نه فقط ارث‌بری) این را رفع می‌کند. */
.wsc-portal-wrap input[type="number"] { direction: rtl !important; text-align: right !important; }
.wsc-portal-wrap .wsc-hint { margin: 6px 0 0 !important; font-size: 11.5px !important; color: var(--wsc-muted) !important; line-height: 1.7 !important; }
/* هم‌خانواده با admin.css — همان دکمه‌ی «رفتن به صفحه‌ی پذیرش» در پورتال هم بلافاصله بعد hint
   چسبیده بود؛ آنجا فیکس شد ولی اینجا (نسخه‌ی پورتال) جا افتاده بود. */
.wsc-portal-wrap .wsc-hint + .button { margin-top: 14px !important; }

/* ---------- فهرست مدارک پزشکی بیمار — عینا هم‌خانواده با admin.css ---------- */
.wsc-portal-wrap .wsc-document-list { list-style: none !important; margin: 0 !important; padding: 0 !important; display: flex !important; flex-direction: column !important; gap: 8px !important; }
.wsc-portal-wrap .wsc-document-row {
    display: flex !important; align-items: center !important; gap: 10px !important; padding: 10px 12px !important; border-radius: var(--wsc-radius-sm) !important;
    border: 1px solid var(--wsc-border-soft) !important; text-decoration: none !important; color: var(--wsc-ink) !important;
    transition: background .12s ease, border-color .12s ease;
}
.wsc-portal-wrap .wsc-document-row:hover { background: var(--wsc-hover-bg) !important; border-color: var(--wsc-primary) !important; }
.wsc-portal-wrap .wsc-document-row .wsc-icon { color: var(--wsc-primary) !important; flex-shrink: 0; }
.wsc-portal-wrap .wsc-document-name { font-weight: 700 !important; font-size: 12.5px !important; }
.wsc-portal-wrap .wsc-document-meta { margin-inline-start: auto; font-size: 11px !important; color: var(--wsc-muted) !important; white-space: nowrap !important; }
.wsc-portal-wrap .wsc-message { margin-top: 10px !important; font-size: 12.5px !important; line-height: 1.8 !important; }
.wsc-portal-wrap .wsc-message-success { color: var(--wsc-success) !important; }
.wsc-portal-wrap .wsc-message-error { color: var(--wsc-danger) !important; }
.wsc-portal-wrap .wsc-field-grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }

.wsc-portal-wrap .wsc-switch { display: flex !important; align-items: center !important; gap: 10px !important; cursor: pointer !important; font-size: 13px !important; font-weight: 600 !important; color: var(--wsc-text-strong) !important; margin-bottom: 14px !important; }
.wsc-portal-wrap .wsc-switch-track { position: relative; display: inline-block; width: 42px; height: 24px; flex-shrink: 0; }
.wsc-portal-wrap .wsc-switch-track input { position: absolute; inset: 0; margin: 0; opacity: 0; cursor: pointer; }
.wsc-portal-wrap .wsc-switch-slider { position: absolute; inset: 0; background: #cbd5e1 !important; border-radius: 999px !important; pointer-events: none; transition: background .15s ease; }
.wsc-portal-wrap .wsc-switch-slider::before { content: ""; position: absolute; top: 3px; inset-inline-start: 3px; width: 18px; height: 18px; background: #fff !important; border-radius: 50% !important; transition: inset-inline-start .15s ease; box-shadow: 0 1px 2px rgba(0,0,0,.25) !important; }
.wsc-portal-wrap .wsc-switch-track input:checked + .wsc-switch-slider { background: var(--wsc-primary) !important; }
.wsc-portal-wrap .wsc-switch-track input:checked + .wsc-switch-slider::before { inset-inline-start: 21px; }

.wsc-portal-wrap .wsc-save-bar { position: sticky; bottom: 0; background: var(--wsc-surface) !important; border: 1px solid var(--wsc-border-soft) !important; border-radius: var(--wsc-radius-md) !important; padding: 14px 18px !important; margin-top: 8px !important; display: flex !important; align-items: center !important; justify-content: space-between !important; box-shadow: 0 -2px 14px rgba(15,23,42,.08) !important; flex-wrap: wrap; gap: 10px !important; }
/* وقتی چند دکمه‌ی عملیاتی کنار هم باشند (نه فقط یکی)، باید در یک گروه فلکس جدا با gap کوچک خودشان
   بنشینند — وگرنه justify-content:space-between فاصله‌ی این دکمه‌ها از هم را هم برابر فاصله‌شان از
   متن راهنما حساب می‌کند. */
.wsc-portal-wrap .wsc-save-bar-actions { display: flex !important; gap: 8px !important; flex-wrap: wrap; }

.wsc-portal-wrap .wsc-two-col { display: flex; gap: 12px; flex-wrap: wrap; align-items: flex-start; }
.wsc-portal-wrap .wsc-two-col > div { flex: 1; min-width: 320px; }
/* align-items:flex-start عمدا برای .wsc-two-col پیش‌فرض است (دوستونه‌ی تاریخ/اپتومتری معمولا
   ارتفاع طبیعی خیلی متفاوتی دارند و کشیدنشان به یک اندازه بی‌معنی می‌شد)، ولی توی گزارشات آماری
   بالینی (۴ جدول پرتکرارترین) این دقیقا برعکس است — وقتی یکی ۲ ردیف دارد و کناری‌اش ۱۰ ردیف، نتیجه
   یک گرید دندانه‌دار زشت می‌شود؛ اینجا صریحا stretch می‌کنیم تا هر ردیف هم‌ارتفاع باشد. */
.wsc-portal-wrap .wsc-clinical-stats-grid { align-items: stretch; }
.wsc-portal-wrap .wsc-clinical-stats-item { display: flex; }
.wsc-portal-wrap .wsc-clinical-stats-item .wsc-panel-card { flex: 1; margin-bottom: 0; }
/* برخلاف wp-admin (که عرض کافی برای فرم+فهرست کنار هم دارد)، محتوای پورتال همیشه باریک‌تر است، پس
   این بخش‌ها همیشه تب‌بندی‌شده‌اند نه کنار هم — دقیقا هم‌الگوی «لیست و فیلتر / + افزودن» در پورتال
   پیلاتس. .wsc-subpanel یک wrapper واقعی است (نه display:contents مثل admin.css) چون اینجا واقعا
   می‌خواهیم اتریبیوت hidden کار کند و فقط یکی از دو پنل دیده شود. */
.wsc-portal-wrap .wsc-templates-layout { display: block; }
.wsc-portal-wrap .wsc-templates-form-card, .wsc-portal-wrap .wsc-templates-list-card { width: 100%; }
.wsc-portal-wrap .wsc-subtabs { display: flex !important; gap: 4px !important; border-bottom: 1px solid var(--wsc-border) !important; margin-bottom: 16px !important; flex-wrap: wrap; }
.wsc-portal-wrap .wsc-subtab { appearance: none !important; background: transparent !important; border: none !important; cursor: pointer !important; padding: 9px 16px !important; font-size: 13px !important; font-weight: 700 !important; color: var(--wsc-muted) !important; border-bottom: 2px solid transparent !important; margin-bottom: -1px !important; text-decoration: none !important; }
.wsc-portal-wrap .wsc-subtab:hover, .wsc-portal-wrap .wsc-subtab:focus { color: var(--wsc-ink) !important; background: transparent !important; text-decoration: none !important; }
.wsc-portal-wrap .wsc-subtab.active, .wsc-portal-wrap .wsc-subtab.active:hover, .wsc-portal-wrap .wsc-subtab.active:focus { color: var(--wsc-primary) !important; border-bottom-color: var(--wsc-primary) !important; background: transparent !important; }
.wsc-portal-wrap .wsc-subpanel[hidden] { display: none !important; }

.wsc-portal-wrap .wsc-cards-row { display: flex; gap: 16px; margin: 16px 0; flex-wrap: wrap; }
/* طبق خواسته‌ی کارفرما («عدد کنار آیکون، جمع‌وجورتر») — آیکون+عدد حالا یک ردیف کنار‌هم (wsc-card-top)
   به‌جای آیکون بالا/عدد بزرگ زیرش‌اند؛ پدینگ/سایزها هم کوچک‌تر شدند. */
.wsc-portal-wrap .wsc-card { background: var(--wsc-glass-bg) !important; border: 1px solid var(--wsc-glass-border) !important; border-radius: var(--wsc-radius-lg) !important; backdrop-filter: var(--wsc-glass-blur) !important; -webkit-backdrop-filter: var(--wsc-glass-blur) !important; padding: 12px 14px !important; min-width: 140px; text-align: center !important; flex: 1; box-shadow: var(--wsc-shadow-card) !important; }
.wsc-portal-wrap .wsc-card-top { display: flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; }
.wsc-portal-wrap .wsc-card-icon {
    display: inline-flex !important; align-items: center !important; justify-content: center !important;
    width: 30px !important; height: 30px !important; border-radius: var(--wsc-radius-sm) !important;
    font-size: 15px !important; flex-shrink: 0;
}
.wsc-portal-wrap .wsc-card-icon .wsc-icon svg { width: 16px !important; height: 16px !important; }
.wsc-portal-wrap .wsc-card-icon-primary { background: color-mix(in srgb, var(--wsc-primary) 12%, transparent) !important; color: var(--wsc-primary) !important; }
.wsc-portal-wrap .wsc-card-icon-success { background: var(--wsc-success-bg) !important; color: var(--wsc-success) !important; }
.wsc-portal-wrap .wsc-card-icon-warning { background: var(--wsc-warning-bg) !important; color: var(--wsc-warning) !important; }
.wsc-portal-wrap .wsc-card-icon-danger { background: var(--wsc-danger-bg) !important; color: var(--wsc-danger) !important; }
.wsc-portal-wrap .wsc-card-icon-muted { background: var(--wsc-border-soft) !important; color: var(--wsc-muted) !important; }
.wsc-portal-wrap .wsc-card-number { font-size: 22px !important; font-weight: 800 !important; color: var(--wsc-primary) !important; }
/* عدد هر کارت هم‌رنگ آیکون کنار خودش — عینا هم‌خانواده با admin.css. */
.wsc-portal-wrap .wsc-card-icon-success + .wsc-card-number { color: var(--wsc-success) !important; }
.wsc-portal-wrap .wsc-card-icon-warning + .wsc-card-number { color: var(--wsc-warning) !important; }
.wsc-portal-wrap .wsc-card-icon-danger + .wsc-card-number { color: var(--wsc-danger) !important; }
.wsc-portal-wrap .wsc-card-icon-muted + .wsc-card-number { color: var(--wsc-muted) !important; }
.wsc-portal-wrap .wsc-card-label { color: var(--wsc-muted) !important; margin-top: 6px !important; font-size: 11.5px !important; font-weight: 600 !important; }

.wsc-portal-wrap .wsc-date-nav { display: flex !important; align-items: center !important; gap: 8px !important; margin: 16px 0 !important; flex-wrap: wrap; }
.wsc-portal-wrap .wsc-date-nav select#wsc-followup-filter {
    border-radius: var(--wsc-radius-sm) !important; border: 1px solid var(--wsc-form-border) !important; background: var(--wsc-surface) !important;
    color: var(--wsc-text-strong) !important; padding: 6px 10px !important; font-size: 13px !important; font-weight: 600 !important; cursor: pointer !important;
}
.wsc-portal-wrap .wsc-appt-chip select.wsc-appt-followup-select {
    display: inline-block !important; width: auto !important; margin: 0 !important; flex: 0 0 auto !important; border-radius: 6px !important; border: 1px solid var(--wsc-border-soft) !important;
    background: var(--wsc-bg) !important; color: var(--wsc-text-strong) !important; font-size: 11px !important; padding: 2px 6px !important;
    height: auto !important; min-height: 0 !important; max-height: none !important; line-height: 1.6 !important;
}
/* min-height/max-height صریح لازم است — وگرنه روی سایتی که تم آن روی select سراسری min-height
   تحمیل می‌کند (مثل :is(.btn,.button,button,[type=submit],[type=button]) در وودمارت)، این دراپ‌داون
   بلندتر از بقیه‌ی محتوای کارت دیده می‌شد. */
.wsc-portal-wrap .wsc-appt-chip select.wsc-appt-visit-reason-select {
    display: inline-block !important; width: auto !important; max-width: 100% !important; margin: 0 !important; flex: 0 0 auto !important; border-radius: 6px !important; border: 1px solid var(--wsc-border-soft) !important;
    background: var(--wsc-bg) !important; color: var(--wsc-muted) !important; font-size: 11px !important; padding: 2px 6px !important;
    height: auto !important; min-height: 0 !important; max-height: none !important; line-height: 1.6 !important;
}
/* عینا هم‌الگوی فیکس admin.css: این دو قانون با اختصاصیت بالاتر جلوی مخفی‌شدن سلکت خام (بعد
   enhance شدن با custom-select.js) را می‌گرفتند و باعث دیده‌شدن هم‌زمان سلکت خام و دکمه‌ی سفارشی
   (دو باکس روی‌هم گزارش‌شده در «علت مراجعه»/«مسئول پیگیری») می‌شدند. */
.wsc-portal-wrap .wsc-appt-chip select.wsc-appt-followup-select.wsc-custom-select-native,
.wsc-portal-wrap .wsc-appt-chip select.wsc-appt-visit-reason-select.wsc-custom-select-native {
    display: none !important;
}

.wsc-portal-wrap .wsc-block { background: var(--wsc-surface) !important; border: 1px solid var(--wsc-border-soft) !important; border-radius: var(--wsc-radius-lg) !important; padding: 16px 18px !important; margin-bottom: 18px !important; box-shadow: var(--wsc-shadow-card) !important; overflow-x: hidden; }
.wsc-portal-wrap .wsc-block h3 { display: flex !important; align-items: center !important; gap: 10px !important; margin-top: 0 !important; flex-wrap: wrap; font-size: 14px !important; font-weight: 800 !important; color: var(--wsc-ink) !important; }
.wsc-portal-wrap .wsc-badge { color: #fff !important; border-radius: 6px !important; padding: 3px 9px !important; font-size: 12px !important; font-weight: 700 !important; }

/* دقیقا ۴ کارت در هر ردیف — با auto-fill قبلی بسته به عرض صفحه گاهی ۵-۶ کارت باریک در یک ردیف
   جا می‌شد که مقایسه‌ی اسلات‌ها را سخت می‌کرد؛ عدد ثابت هم مرتب‌تر است هم پیش‌بینی‌پذیرتر. */
.wsc-portal-wrap .wsc-slots-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }
/* min-width:0 حیاتی است: بدون آن، یک بچه‌ی گرید هیچ‌وقت باریک‌تر از عرض طبیعی محتوای خودش نمی‌شود
   (رفتار پیش‌فرض CSS Grid) — روی گوشی باریک این باعث می‌شد کل .wsc-slots-grid/.wsc-week-strip از
   عرض صفحه بزرگ‌تر شود و کل صفحه اسکرول افقی بگیرد؛ باگی که در نسخه‌ی خواهر کشف و رفع شده بود. */
.wsc-portal-wrap .wsc-slot { min-width: 0; border: 1px solid var(--wsc-border-soft) !important; border-radius: var(--wsc-radius-sm) !important; padding: 9px 11px !important; background: var(--wsc-bg) !important; transition: box-shadow .12s ease, transform .12s ease; font-size: 12.5px !important; overflow-x: hidden; }
.wsc-portal-wrap .wsc-slot-empty { background: var(--wsc-empty-bg) !important; border-color: var(--wsc-empty-border) !important; }
.wsc-portal-wrap .wsc-slot-empty:hover { box-shadow: 0 6px 16px rgba(15,23,42,.1) !important; transform: translateY(-2px); }
.wsc-portal-wrap .wsc-slot-full { background: var(--wsc-surface) !important; }
.wsc-portal-wrap .wsc-slot-held { background: var(--wsc-held-bg) !important; border-color: var(--wsc-held-border) !important; animation: wsc-pulse 1.6s ease-in-out infinite; }
.wsc-portal-wrap .wsc-slot-past { background: var(--wsc-bg) !important; opacity: .55; }
.wsc-portal-wrap .wsc-slot-past .wsc-slot-held-label { color: var(--wsc-muted) !important; }
.wsc-portal-wrap .wsc-slot.wsc-slot-drag-over { outline: 2px dashed var(--wsc-held-border) !important; }
.wsc-portal-wrap .wsc-slot-time { font-weight: 700 !important; margin-bottom: 4px !important; color: var(--wsc-ink) !important; }
.wsc-portal-wrap .wsc-slot-held-label { color: var(--wsc-held-text) !important; font-size: 12px !important; }
@keyframes wsc-pulse { 0%, 100% { opacity: 1; } 50% { opacity: .6; } }

/* دیگر بردر رنگی ثابت ندارد — طبق بازخورد کارفرما (نسخه‌ی خواهر)؛ رنگ ثبت‌کننده روی پس‌زمینه‌ی
   خود اسلات نشسته، نه روی کارت. */
.wsc-portal-wrap .wsc-appt-chip { background: var(--wsc-surface) !important; border: 1px solid var(--wsc-border-soft) !important; border-radius: 8px !important; padding: 6px 9px !important; margin-bottom: 5px !important; font-size: 12px !important; cursor: grab; box-shadow: 0 1px 3px rgba(15,23,42,.05) !important; transition: box-shadow .12s ease, transform .12s ease; }
.wsc-portal-wrap .wsc-appt-chip:hover { box-shadow: 0 4px 12px rgba(15,23,42,.12) !important; transform: translateY(-1px); }
.wsc-portal-wrap .wsc-appt-chip.wsc-status-no_show { background: var(--wsc-noshow-bg) !important; }
.wsc-portal-wrap .wsc-appt-chip.wsc-dragging { opacity: 0.4; }
/* هدر (چک‌باکس + نام بیمار) و ردیف متا (سرویس/تلفن/وضعیت/علت مراجعه) هرکدام یک ردیف فلکس جدا
   هستند تا محتوای کارت به‌جای چسبیدن نامرتب همه‌چیز به هم، در چند سطر منظم با فاصله‌ی یکنواخت بنشیند. */
.wsc-portal-wrap .wsc-appt-chip-head { display: flex !important; align-items: center !important; gap: 6px !important; margin-bottom: 4px !important; }
.wsc-portal-wrap .wsc-appt-chip-meta { display: flex !important; align-items: center !important; flex-wrap: wrap !important; gap: 4px 6px !important; }
.wsc-portal-wrap .wsc-appt-name { font-weight: 700 !important; color: var(--wsc-ink) !important; }
.wsc-portal-wrap .wsc-appt-service { font-size: 11px !important; font-weight: 700 !important; color: var(--wsc-primary) !important; }
.wsc-portal-wrap .wsc-appt-phone { color: var(--wsc-muted) !important; }
.wsc-portal-wrap .wsc-appt-status { display: inline-flex !important; align-items: center !important; gap: 5px !important; font-size: 11px !important; font-weight: 700 !important; padding: 1px 8px !important; border-radius: 999px !important; background: var(--wsc-hover-bg) !important; color: var(--wsc-primary) !important; }
.wsc-portal-wrap .wsc-appt-status::before { content: ""; width: 6px; height: 6px; min-width: 6px; border-radius: 999px; background: currentColor; }
.wsc-portal-wrap .wsc-appt-status-no_show { background: var(--wsc-danger-bg) !important; color: var(--wsc-danger) !important; }
.wsc-portal-wrap .wsc-appt-status-completed, .wsc-portal-wrap .wsc-appt-status-checked_in { background: var(--wsc-success-bg) !important; color: var(--wsc-success) !important; }
.wsc-portal-wrap .wsc-appt-status-confirmed { background: var(--wsc-warning-bg) !important; color: var(--wsc-warning) !important; }
.wsc-portal-wrap .wsc-appt-chip .wsc-appt-cancel-btn { background: var(--wsc-danger-bg) !important; border-radius: 6px !important; }
.wsc-portal-wrap .wsc-appt-chip .wsc-appt-cancel-btn:hover { background: var(--wsc-danger) !important; color: #fff !important; }
/* دکمه‌های عملیاتی حالا داخل .wsc-inline-actions (پایین‌تر) قرار می‌گیرند که خودش gap دارد؛ اینجا فقط
   margin دستی قبلی را صفر می‌کنیم تا فاصله دوبار جمع نشود. */
.wsc-portal-wrap .wsc-appt-chip .button-link,
.wsc-portal-wrap .wsc-appt-chip .button-link-delete { display: inline-block !important; margin: 0 !important; }

/* هر ردیف عملیات کوچک (انجام‌شده/جابجایی/عدم‌حضور/ارسال لینک/لغو و ...) داخل یک آپشن نوبت باید
   دکمه‌هایی هم‌اندازه و با فاصله‌ی یکنواخت بگیرد، وگرنه بسته به طول متن هر دکمه فشرده/بی‌نظم دیده
   می‌شود؛ این کلاس عمومی روی هر container ی از دکمه‌های کوچک عملیاتی قابل استفاده است. */
.wsc-portal-wrap .wsc-inline-actions { display: flex !important; flex-wrap: wrap !important; gap: 6px !important; margin-top: 8px !important; }
.wsc-portal-wrap .wsc-inline-actions .button,
.wsc-portal-wrap .wsc-inline-actions .button-link-delete,
.wsc-portal-wrap .wsc-inline-actions .button-link { flex: 0 0 auto; white-space: nowrap; }

/* ---------- مودال رزرو نوبت — عینا هم‌خانواده با admin.css ---------- */

.wsc-portal-wrap .wsc-modal-overlay {
    display: none; position: fixed !important; inset: 0 !important; z-index: 300 !important; align-items: center; justify-content: center;
    background: rgba(15, 23, 42, .55) !important; backdrop-filter: blur(2px); padding: 20px !important;
    opacity: 0; transition: opacity .24s cubic-bezier(.4,0,.2,1);
}
.wsc-portal-wrap .wsc-modal-overlay.wsc-open { display: flex; opacity: 1; }
.wsc-portal-wrap .wsc-modal {
    background: var(--wsc-surface) !important; border-radius: var(--wsc-radius-lg) !important; box-shadow: var(--wsc-shadow-card-hover) !important;
    max-width: 440px; width: 100%; max-height: 90vh; overflow-y: auto !important; padding: 26px !important; position: relative;
    transform: translateY(10px) scale(.98); transition: transform .24s cubic-bezier(.4,0,.2,1);
}
.wsc-portal-wrap .wsc-modal-overlay.wsc-open .wsc-modal { transform: translateY(0) scale(1); }
.wsc-portal-wrap .wsc-modal-close {
    position: absolute !important; top: 18px !important; inset-inline-end: 18px !important; width: 32px !important; height: 32px !important; border-radius: 50% !important;
    border: 1px solid var(--wsc-border) !important; background: var(--wsc-border-soft) !important; display: flex !important; align-items: center !important; justify-content: center !important;
    cursor: pointer !important; color: var(--wsc-muted) !important;
}
/* عمدا بک‌گراند توپر آبی + آیکون سفید (نه یک تینت کم‌رنگ + آیکون آبی) — همان تینت کم‌رنگ با
   آیکون هم‌رنگ آبی از دور یک‌دست/کم‌کنتراست دیده می‌شد («ضربدر داخلش باید سفید بشه»). */
.wsc-portal-wrap .wsc-modal-close:hover { background: var(--wsc-primary) !important; border-color: var(--wsc-primary) !important; color: #fff !important; }
.wsc-portal-wrap .wsc-modal-close .wsc-icon svg { width: 16px !important; height: 16px !important; display: block !important; stroke: currentColor !important; }
.wsc-portal-wrap .wsc-modal-title { font-size: 16px !important; font-weight: 800 !important; color: var(--wsc-ink) !important; margin: 0 0 18px !important; padding-inline-end: 30px !important; }
.wsc-portal-wrap .wsc-document-preview-modal { max-width: 640px !important; text-align: center !important; }
.wsc-portal-wrap .wsc-document-preview-img { max-width: 100% !important; max-height: 65vh !important; border-radius: var(--wsc-radius-md) !important; margin-bottom: 16px !important; }
.wsc-portal-wrap .wsc-document-preview-download { display: inline-flex !important; }

/* ---------- مودال مرور کاتالوگ دسته‌بندی‌شده — مشترک تشخیص و سابقه‌ی استاندارد بیمار ----------
   !important روی رنگ/بردر/رادیوس لازم است: این دکمه‌ها <button> ی خام‌اند (بدون کلاس .button) و
   تم سایت روی تگ button سراسری یک پیل آبی‌سیر توپر تحمیل می‌کند — بدون !important، آن استایل
   سراسری برنده می‌شد (دقیقا هم‌خانواده با توضیح admin.css). */
.wsc-portal-wrap .wsc-catalog-browser { max-width: 720px !important; }
.wsc-portal-wrap .wsc-catalog-browser-groups { display: flex !important; flex-direction: column !important; gap: 20px !important; }
.wsc-portal-wrap .wsc-catalog-browser-group h4 { margin: 0 0 10px !important; font-size: 12px !important; font-weight: 800 !important; color: var(--wsc-primary) !important; text-transform: uppercase !important; letter-spacing: .5px !important; }
.wsc-portal-wrap .wsc-catalog-browser-items { display: flex !important; flex-wrap: wrap !important; gap: 8px !important; }
.wsc-portal-wrap .wsc-catalog-browser-item {
    padding: 8px 14px !important; border-radius: 999px !important; border: 1px solid var(--wsc-border) !important; background: var(--wsc-border-soft) !important;
    color: var(--wsc-ink) !important; font-size: 12.5px !important; font-weight: 600 !important; cursor: pointer !important;
    line-height: 1.6 !important; height: auto !important; min-height: 0 !important; box-shadow: none !important;
    transition: background .12s ease, color .12s ease, border-color .12s ease;
}
.wsc-portal-wrap .wsc-catalog-browser-item:hover { border-color: var(--wsc-primary) !important; color: var(--wsc-primary) !important; background: var(--wsc-surface) !important; }
.wsc-portal-wrap .wsc-catalog-browser-item.wsc-catalog-browser-item-added { opacity: .55 !important; cursor: default !important; background: var(--wsc-success-bg) !important; border-color: var(--wsc-success) !important; color: var(--wsc-success) !important; }
.wsc-portal-wrap .wsc-catalog-browser-empty { font-size: 12.5px !important; color: var(--wsc-muted) !important; text-align: center !important; padding: 20px 0 !important; }

/* دو حالت نمایش پاپ‌آپ مرور کاتالوگ — عینا هم‌خانواده با admin.css */
.wsc-portal-wrap .wsc-catalog-browser-toolbar { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 10px !important; margin-bottom: 14px !important; padding-bottom: 12px !important; border-bottom: 1px solid var(--wsc-border-soft) !important; }
.wsc-portal-wrap .wsc-catalog-browser-tabs { display: none; flex-wrap: wrap !important; gap: 6px !important; }
.wsc-portal-wrap .wsc-catalog-browser.wsc-catalog-browser-tabview .wsc-catalog-browser-tabs { display: flex !important; }
.wsc-portal-wrap .wsc-catalog-browser-tab {
    padding: 6px 12px !important; border-radius: 999px !important; border: 1px solid var(--wsc-border) !important; background: var(--wsc-surface) !important;
    color: var(--wsc-muted) !important; font-size: 11px !important; font-weight: 700 !important; cursor: pointer !important; height: auto !important; min-height: 0 !important; box-shadow: none !important;
}
/* تم سایت روی <button> ی خام سراسری هاور آبی توپر می‌گذارد (همان قانونی که در چند جای دیگر این
   فایل هم خنثی‌اش کردیم) — بدون این رول، هاور تب‌های غیر‌فعال یک پیل آبی توپر با متن خاکستری
   ناخوانا می‌شد. */
.wsc-portal-wrap .wsc-catalog-browser-tab:hover { background: var(--wsc-border-soft) !important; border-color: var(--wsc-primary) !important; color: var(--wsc-primary) !important; }
.wsc-portal-wrap .wsc-catalog-browser-tab.active,
.wsc-portal-wrap .wsc-catalog-browser-tab.active:hover { background: var(--wsc-primary) !important; border-color: var(--wsc-primary) !important; color: #fff !important; }
.wsc-portal-wrap .wsc-catalog-browser-view-toggle { display: flex !important; gap: 4px !important; flex-shrink: 0; }
.wsc-portal-wrap .wsc-catalog-view-btn {
    display: flex !important; align-items: center !important; justify-content: center !important; width: 30px !important; height: 30px !important; min-height: 0 !important;
    padding: 0 !important; border-radius: var(--wsc-radius-sm) !important; border: 1px solid var(--wsc-border) !important; background: var(--wsc-surface) !important;
    color: var(--wsc-muted) !important; cursor: pointer !important; box-shadow: none !important;
}
.wsc-portal-wrap .wsc-catalog-view-btn svg { width: 15px; height: 15px; }
.wsc-portal-wrap .wsc-catalog-view-btn:hover { background: var(--wsc-border-soft) !important; border-color: var(--wsc-primary) !important; color: var(--wsc-primary) !important; }
.wsc-portal-wrap .wsc-catalog-view-btn.active,
.wsc-portal-wrap .wsc-catalog-view-btn.active:hover { background: var(--wsc-hover-bg) !important; border-color: var(--wsc-primary) !important; color: var(--wsc-primary) !important; }
.wsc-portal-wrap .wsc-catalog-browser.wsc-catalog-browser-tabview .wsc-catalog-browser-groups { gap: 0 !important; }
.wsc-portal-wrap .wsc-catalog-browser.wsc-catalog-browser-tabview .wsc-catalog-browser-group h4 { display: none !important; }

/* ---------- خلاصه‌ی روایی/متنی ویزیت — عینا هم‌خانواده با admin.css ---------- */
/* طبق خواسته‌ی صریح کارفرما («تیترها انگلیسی، چپ‌چین») — چون محتوای این دو باکس عمدتا کوته‌نوشت‌ها
   و اعداد انگلیسی است (PMH/PSH/Sph/Cyl/VA/IOP...)، جهت کلی هم LTR/چپ‌چین شد تا مخلوط دوجهتی قبلی
   (که باعث جابه‌جایی عجیب علامت‌ها/اعداد می‌شد) از بین برود. */
.wsc-portal-wrap .wsc-visit-summary-narrative {
    background: var(--wsc-success-bg) !important; border: 1px solid var(--wsc-empty-border) !important;
    border-radius: var(--wsc-radius-md) !important; padding: 14px 16px !important; margin-top: 14px !important;
    direction: ltr !important; text-align: left !important;
}
.wsc-portal-wrap .wsc-visit-summary-narrative h4 {
    display: flex !important; align-items: center !important; gap: 6px !important; margin: 0 0 8px !important; font-size: 12.5px !important; font-weight: 800 !important; color: var(--wsc-success) !important;
}
.wsc-portal-wrap .wsc-visit-summary-narrative h4 .wsc-icon svg { width: 15px; height: 15px; }
/* طبق بازخورد کارفرما («۶ تا بخش باید زیر هم باشه، نه بچسبه») — عینا هم‌خانواده با admin.css. */
.wsc-portal-wrap .wsc-visit-summary-narrative ul { margin: 0 !important; padding: 0 !important; list-style: none !important; display: flex !important; flex-direction: column !important; gap: 10px !important; }
.wsc-portal-wrap .wsc-visit-summary-narrative li {
    font-size: 12.5px !important; line-height: 1.9 !important; color: var(--wsc-ink) !important; text-align: start !important;
    padding-inline-start: 10px !important; border-inline-start: 2px solid var(--wsc-empty-border) !important;
}
.wsc-portal-wrap .wsc-visit-summary-narrative li strong { color: var(--wsc-text-strong) !important; display: inline-block !important; margin-inline-end: 2px !important; }
/* نسخه‌ی زرد همین کامپوننت — مخصوص خلاصه‌ی مقادیر اپتومتری، عمدا بالای نسخه‌ی سبز می‌نشیند. */
.wsc-portal-wrap .wsc-visit-summary-narrative-optometry { background: var(--wsc-warning-bg) !important; border-color: var(--wsc-warning) !important; margin-top: 0 !important; margin-bottom: 14px !important; }
.wsc-portal-wrap .wsc-visit-summary-narrative-optometry h4 { color: var(--wsc-warning) !important; }
.wsc-portal-wrap .wsc-visit-summary-split { display: flex !important; gap: 12px !important; align-items: stretch !important; margin-top: 14px !important; }
.wsc-portal-wrap .wsc-visit-summary-split .wsc-visit-summary-narrative { flex: 1 1 50% !important; min-width: 0 !important; margin-top: 0 !important; margin-bottom: 0 !important; }
/* هر ردیف (UCVA/CycloRef/...) یک بلوک کوچک جدا با تیتر خودش، و هر چشم خط خودش را دارد — طبق
   بازخورد پزشک که یک رشته‌ی بلند به‌هم‌چسبیده خواندنش سخت بود. */
/* طبق خواسته‌ی صریح کارفرما («دقیقا مشابه خروجی دستگاه باشه») — دیگر برچسب‌دار (Sph/Cyl/Axis)
   نیست، عینا فرمت خط پرینت اتورفراکتور: «<R>  +۱.۲۵ -۱.۵۰ ۲»، فونت مونوسپیس برای هم‌ترازی ستونی
   دقیقا مثل خود کاغذ دستگاه. */
.wsc-portal-wrap .wsc-optometry-printout {
    display: flex !important; flex-direction: column !important; gap: 12px !important; direction: ltr !important; text-align: left !important;
    font-family: 'Courier New', Consolas, monospace !important;
}
/* طبق توضیح بالینی پزشک — Ref/BCVA/Far.Rx/Near.Rx هرکدام معنای متفاوتی دارند، پس هر بخش تیتر
   کوچک خودش را دارد (نه یک بلوک واحد بی‌نام) تا هیچ‌وقت قاطی/اشتباه خوانده نشوند. */
.wsc-portal-wrap .wsc-optometry-printout-section { display: flex !important; flex-direction: column !important; gap: 4px !important; }
.wsc-portal-wrap .wsc-optometry-printout-section-label { font-size: 10.5px !important; font-weight: 800 !important; color: var(--wsc-muted) !important; text-transform: uppercase !important; letter-spacing: .5px !important; }
.wsc-portal-wrap .wsc-optometry-printout-row { display: flex !important; align-items: center !important; gap: 12px !important; font-size: 15px !important; color: var(--wsc-text-strong) !important; }
.wsc-portal-wrap .wsc-optometry-printout-tag {
    display: inline-flex !important; align-items: center !important; justify-content: center !important; flex-shrink: 0;
    min-width: 30px !important; height: 22px !important; padding: 0 4px !important; border-radius: 6px !important;
    background: var(--wsc-warning-bg) !important; color: var(--wsc-warning) !important; font-weight: 800 !important; font-size: 12px !important;
}
.wsc-portal-wrap .wsc-optometry-printout-values { font-weight: 700 !important; letter-spacing: .5px; }
.wsc-portal-wrap .wsc-optometry-printout-pd { margin-top: 2px !important; font-size: 12.5px !important; font-weight: 700 !important; color: var(--wsc-muted) !important; }

.wsc-portal-wrap .wsc-inline-booking-form { display: flex; flex-direction: column; gap: 10px; }
/* :not([type="checkbox"]) لازم است — بدونش چک‌باکس «اتباع» (که مستقیم داخل همین فرم است) هم width:100%
   می‌گرفت و یک جعبه‌ی غول‌آسا/بدشکل به‌جای یک چک‌باکس معمولی رندر می‌شد. */
.wsc-portal-wrap .wsc-inline-booking-form input:not([type="checkbox"]), .wsc-portal-wrap .wsc-inline-booking-form select, .wsc-portal-wrap .wsc-inline-booking-form textarea {
    width: 100% !important; box-sizing: border-box !important; border-radius: var(--wsc-radius-btn) !important; border: 1px solid var(--wsc-border) !important;
    background: var(--wsc-field-bg) !important; padding: 12px 16px !important; font-size: 14px !important; min-height: 48px !important; color: var(--wsc-ink) !important;
}
.wsc-portal-wrap .wsc-inline-booking-form textarea { min-height: 70px !important; }
.wsc-portal-wrap .wsc-inline-booking-form input[type="checkbox"] { width: auto !important; }
.wsc-portal-wrap .wsc-inline-booking-form label { display: flex !important; align-items: center !important; gap: 6px !important; font-weight: 400 !important; font-size: 12.5px !important; color: var(--wsc-text-strong) !important; }
.wsc-portal-wrap .wsc-inline-booking-form .button.button-primary,
.wsc-portal-wrap .wsc-inline-booking-form .button.wsc-book-cancel { width: 100% !important; justify-content: center !important; }
.wsc-portal-wrap .wsc-hold-timer { font-size: 11.5px !important; font-weight: 700 !important; color: var(--wsc-held-text) !important; text-align: center !important; margin: 0 0 14px !important; padding: 8px !important; background: var(--wsc-held-bg) !important; border-radius: var(--wsc-radius-sm) !important; }

.wsc-portal-wrap .wsc-week-strip { display: grid; grid-template-columns: repeat(7, 1fr); gap: 8px; margin: 16px 0; }
.wsc-portal-wrap .wsc-week-day { min-width: 0; display: flex !important; flex-direction: column !important; align-items: center !important; gap: 4px !important; background: var(--wsc-surface) !important; border: 1px solid var(--wsc-border-soft) !important; border-radius: var(--wsc-radius-md) !important; padding: 10px 6px !important; text-decoration: none !important; color: var(--wsc-ink) !important; box-shadow: var(--wsc-shadow-card) !important; transition: transform .12s ease, box-shadow .12s ease; }
.wsc-portal-wrap .wsc-week-day:hover { transform: translateY(-2px); box-shadow: var(--wsc-shadow-card-hover) !important; color: var(--wsc-ink) !important; }
.wsc-portal-wrap .wsc-week-day-name { font-size: 11px !important; color: var(--wsc-muted) !important; font-weight: 600 !important; }
.wsc-portal-wrap .wsc-week-day-num { font-size: 16px !important; font-weight: 800 !important; color: var(--wsc-ink) !important; max-width: 100%; }
.wsc-portal-wrap .wsc-week-day-badge { font-size: 10px !important; padding: 2px 8px !important; border-radius: 999px !important; background: var(--wsc-hover-bg) !important; color: var(--wsc-primary) !important; font-weight: 700 !important; }
.wsc-portal-wrap .wsc-week-day-today { border-color: var(--wsc-primary) !important; border-width: 2px !important; }
.wsc-portal-wrap .wsc-week-day-active { background: linear-gradient(135deg, var(--wsc-primary), var(--wsc-primary-dark)) !important; color: #fff !important; box-shadow: 0 8px 18px -4px rgba(0,0,0,.25) !important; }
.wsc-portal-wrap .wsc-week-day-active .wsc-week-day-name, .wsc-portal-wrap .wsc-week-day-active .wsc-week-day-num { color: #fff !important; }
.wsc-portal-wrap .wsc-week-day-active .wsc-week-day-badge { background: rgba(255,255,255,.25) !important; color: #fff !important; }
.wsc-portal-wrap .wsc-week-day.wsc-load-light .wsc-week-day-badge { background: var(--wsc-success-bg) !important; color: var(--wsc-success) !important; }
.wsc-portal-wrap .wsc-week-day.wsc-load-busy .wsc-week-day-badge { background: var(--wsc-warning-bg) !important; color: var(--wsc-warning) !important; }
.wsc-portal-wrap .wsc-week-day.wsc-load-full .wsc-week-day-badge { background: var(--wsc-danger-bg) !important; color: var(--wsc-danger) !important; }
.wsc-portal-wrap .wsc-week-day.wsc-load-holiday { opacity: .55; }

.wsc-portal-wrap .wsc-view-toggle { display: inline-flex !important; gap: 4px !important; margin-inline-start: auto; }
.wsc-portal-wrap .wsc-slots-grid.wsc-view-list { display: flex; flex-direction: column; gap: 6px; }
.wsc-portal-wrap .wsc-slots-grid.wsc-view-list .wsc-slot { display: flex !important; align-items: center !important; gap: 12px !important; flex-wrap: wrap; padding: 8px 12px !important; }
.wsc-portal-wrap .wsc-slots-grid.wsc-view-list .wsc-slot-time { margin-bottom: 0 !important; min-width: 46px; }
.wsc-portal-wrap .wsc-slots-grid.wsc-view-list .wsc-appt-chip { margin-bottom: 0 !important; display: flex !important; align-items: center !important; gap: 8px !important; flex: 1; }
.wsc-portal-wrap .wsc-slots-grid.wsc-view-list .wsc-appt-name { display: inline; }
.wsc-portal-wrap .wsc-slots-grid.wsc-view-list .wsc-appt-service { display: inline; margin-inline-start: 6px; }

.wsc-portal-wrap .wsc-search-results { position: relative; background: var(--wsc-surface) !important; border: 1px solid var(--wsc-border-soft) !important; max-width: 420px; z-index: 30; border-radius: var(--wsc-radius-sm) !important; overflow: hidden; box-shadow: var(--wsc-shadow-card) !important; }
.wsc-portal-wrap .wsc-search-row { padding: 7px 12px !important; cursor: pointer !important; border-bottom: 1px solid var(--wsc-border-soft) !important; font-size: 13px !important; color: var(--wsc-ink) !important; }
.wsc-portal-wrap .wsc-search-row:hover { background: var(--wsc-hover-bg) !important; }
.wsc-portal-wrap .wsc-search-empty { padding: 7px 12px !important; color: var(--wsc-muted) !important; font-size: 12.5px !important; }

.wsc-portal-wrap .wsc-permission-user-box { background: var(--wsc-surface) !important; border: 1px solid var(--wsc-border-soft) !important; border-radius: var(--wsc-radius-md) !important; padding: 14px 16px !important; margin-bottom: 14px !important; box-shadow: var(--wsc-shadow-card) !important; }

/* ---------- ماتریس دسترسی‌ها — عینا هم‌خانواده با admin.css ---------- */
.wsc-portal-wrap .wsc-perm-matrix-wrap { overflow-x: auto !important; border: 1px solid var(--wsc-border-soft) !important; border-radius: var(--wsc-radius-md) !important; }
.wsc-portal-wrap .wsc-perm-matrix { border-collapse: collapse !important; width: 100%; min-width: max-content; font-size: 12.5px !important; }
.wsc-portal-wrap .wsc-perm-matrix thead th {
    position: sticky !important; top: 0 !important; z-index: 2 !important; background: var(--wsc-surface) !important; border-bottom: 2px solid var(--wsc-border-soft) !important;
    padding: 10px 8px !important; text-align: center !important; vertical-align: bottom !important;
}
.wsc-portal-wrap .wsc-perm-matrix-corner { position: sticky !important; right: 0 !important; z-index: 3 !important; background: var(--wsc-surface) !important; }
.wsc-portal-wrap .wsc-perm-matrix-user-col { min-width: 130px; }
.wsc-portal-wrap .wsc-perm-matrix-user-name { font-weight: 800 !important; margin-bottom: 6px !important; white-space: nowrap; }
.wsc-portal-wrap .wsc-perm-matrix tbody th.wsc-perm-matrix-cap-label {
    position: sticky !important; right: 0 !important; z-index: 1 !important; background: var(--wsc-surface) !important; text-align: right !important;
    padding: 8px 10px !important; font-weight: 700 !important; white-space: nowrap; border-bottom: 1px solid var(--wsc-border-soft) !important;
}
.wsc-portal-wrap .wsc-perm-matrix-cell { text-align: center !important; padding: 6px 8px !important; border-bottom: 1px solid var(--wsc-border-soft) !important; }
.wsc-portal-wrap .wsc-perm-matrix-cell input[type="checkbox"] { width: 17px !important; height: 17px !important; cursor: pointer !important; }
.wsc-portal-wrap .wsc-perm-matrix-extra-row th, .wsc-portal-wrap .wsc-perm-matrix-extra-row td { border-top: 2px solid var(--wsc-border-soft) !important; }
.wsc-portal-wrap .wsc-perm-groups-select { width: 130px !important; height: 64px !important; font-size: 11px !important; }
.wsc-portal-wrap .wsc-perm-matrix-color { display: inline-flex !important; align-items: center !important; gap: 5px !important; }
.wsc-portal-wrap .wsc-perm-matrix-color input[type="checkbox"] { width: 15px !important; height: 15px !important; }
.wsc-portal-wrap .wsc-perm-matrix-color input[type="color"] { width: 34px !important; height: 24px !important; padding: 1px !important; cursor: pointer !important; border-radius: 5px !important; }
.wsc-portal-wrap .wsc-perm-preset-select { font-size: 11px !important; width: 100% !important; }
.wsc-portal-wrap .wsc-caps-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 6px; margin: 10px 0; }

.wsc-portal-wrap .wsc-live-refresh-banner { position: sticky; top: 68px; z-index: 20; background: var(--wsc-primary) !important; color: #fff !important; padding: 9px 14px !important; border-radius: var(--wsc-radius-sm) !important; margin-bottom: 12px !important; display: none; align-items: center; justify-content: space-between; gap: 10px; box-shadow: 0 6px 16px rgba(0,0,0,.18) !important; }
.wsc-portal-wrap .wsc-live-refresh-banner button { background: #fff !important; color: var(--wsc-primary) !important; border: none !important; border-radius: 6px !important; padding: 4px 10px !important; cursor: pointer !important; font-weight: 700 !important; }

.wsc-portal-wrap .wsc-jalali-field { position: relative; display: inline-block; min-width: 160px; }
.wsc-portal-wrap .wsc-jalali-display { cursor: pointer; background-image: none !important; direction: rtl; }
.wsc-portal-wrap .wsc-jalali-popup { position: absolute; top: calc(100% + 4px); inset-inline-start: 0; z-index: 100; background: var(--wsc-surface) !important; border: 1px solid var(--wsc-border) !important; border-radius: var(--wsc-radius-md) !important; box-shadow: 0 12px 30px rgba(15,23,42,.18) !important; padding: 10px !important; width: 260px; display: none; }
.wsc-portal-wrap .wsc-jalali-popup.wsc-open { display: block; }
.wsc-portal-wrap .wsc-jalali-popup-header { display: flex !important; align-items: center !important; justify-content: space-between !important; margin-bottom: 8px !important; }
.wsc-portal-wrap .wsc-jalali-popup-header button { background: none !important; border: none !important; cursor: pointer !important; font-size: 16px !important; color: var(--wsc-primary) !important; padding: 2px 8px !important; }
.wsc-portal-wrap .wsc-jalali-popup-title { font-size: 13px !important; font-weight: 700 !important; color: var(--wsc-ink) !important; }
.wsc-portal-wrap .wsc-jalali-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 2px; text-align: center; }
.wsc-portal-wrap .wsc-jalali-grid .wsc-jd-dow { font-size: 10px !important; color: var(--wsc-muted) !important; padding: 4px 0 !important; }
.wsc-portal-wrap .wsc-jalali-grid button.wsc-jd-day { background: none !important; border: none !important; cursor: pointer !important; padding: 6px 0 !important; border-radius: 6px !important; font-size: 12px !important; color: var(--wsc-ink) !important; }
.wsc-portal-wrap .wsc-jalali-grid button.wsc-jd-day:hover { background: var(--wsc-hover-bg) !important; }
.wsc-portal-wrap .wsc-jalali-grid button.wsc-jd-day.wsc-jd-today { border: 1px solid var(--wsc-primary) !important; }
.wsc-portal-wrap .wsc-jalali-grid button.wsc-jd-day.wsc-jd-selected { background: var(--wsc-primary) !important; color: #fff !important; }
.wsc-portal-wrap .wsc-jalali-popup-footer { display: flex !important; justify-content: space-between !important; margin-top: 8px !important; }
.wsc-portal-wrap .wsc-jalali-popup-footer button { background: none !important; border: none !important; cursor: pointer !important; font-size: 11px !important; color: var(--wsc-primary) !important; }

/* ---------- ریسپانسیو ---------- */

@media (min-width: 901px) {
    /* قبلا کولاپس یعنی display:none (سایدبار کاملا غیب می‌شد)؛ طبق خواست کارفرما الان به‌جایش
       یک ریل باریک فقط-آیکون می‌ماند (هم‌الگوی اسکرین‌شات Negah) — برچسب متنی هر آیتم مخفی
       می‌شود ولی خود آیکون‌بج گرد (و حالت گلوی آبی آیتم فعال) دیده می‌ماند. */
    .wsc-portal-wrap .wsc-portal-sidebar.wsc-portal-collapsed { width: 72px !important; padding: 18px 10px !important; align-items: center !important; }
    .wsc-portal-wrap .wsc-portal-sidebar.wsc-portal-collapsed .wsc-portal-sidebar-header { flex-direction: column !important; gap: 10px !important; padding: 0 0 16px !important; }
    .wsc-portal-wrap .wsc-portal-sidebar.wsc-portal-collapsed .wsc-portal-brand-name,
    .wsc-portal-wrap .wsc-portal-sidebar.wsc-portal-collapsed .wsc-portal-brand-logo-wide { display: none !important; }
    /* هر آیتم باید یک دایره‌ی تک‌شکل تمیز باشد، نه دو شکل توی‌هم (لینک گردتر + آیکون‌بج کوچک‌تر
       مربعی‌تر داخلش که قبلا باعث ناهماهنگی/عدم‌تطابق فرم و سایز می‌شد) — پس الان خود لینک دایره‌ی
       ۴۴px می‌شود (پس‌زمینه‌ی روشن یا گرادیانت آیتم فعال روی همین)، و آیکون‌بج داخلش کاملا شفاف/بی‌شکل
       می‌ماند و فقط جایگاه خود آیکون (۲۴px) است. */
    .wsc-portal-wrap .wsc-portal-sidebar.wsc-portal-collapsed .wsc-portal-nav-link {
        width: 44px !important; height: 44px !important; min-width: 44px !important; min-height: 44px !important; max-width: 44px !important;
        padding: 0 !important; margin: 0 !important; border: none !important; box-sizing: border-box !important; justify-content: center !important; flex: none !important;
        border-radius: 50% !important; background: var(--wsc-border-soft) !important; box-shadow: none !important;
    }
    /* طبق گزارش کارفرما («سایه‌ی خروج هنوز آبیه») — هالوی قرمز خروج باید صریحا هم روی حالت جمع‌شده
       تکرار شود، چون هیچ رول دیگری تضمین نمی‌کرد این‌جا override نشود. */
    .wsc-portal-wrap .wsc-portal-sidebar.wsc-portal-collapsed .wsc-portal-nav-logout { box-shadow: none !important; }
    .wsc-portal-wrap .wsc-portal-sidebar.wsc-portal-collapsed .wsc-portal-nav-link.active {
        background: linear-gradient(135deg, var(--wsc-primary), var(--wsc-primary-dark)) !important;
        /* عمدا کم‌تر از حالت عادی (که ۸px/۲۰px بود) — در ریل باریک فقط-آیکون، آیتم‌ها خیلی به‌هم
           نزدیک‌اند و آن سایه‌ی بزرگ به آیکون زیرش می‌چسبید/بیرون می‌زد. */
        box-shadow: 0 3px 8px color-mix(in srgb, var(--wsc-primary) 35%, transparent) !important;
    }
    /* دکمه‌ی جمع/بازکردن منو نباید هیچ‌وقت ظاهر «فعال»/آبی به‌خودش بگیرد — فقط یک دایره‌ی خاکستری
       خنثی همیشگی، مستقل از هر state ی دیگر. */
    .wsc-portal-wrap .wsc-portal-sidebar.wsc-portal-collapsed .wsc-portal-menu-toggle {
        background: var(--wsc-border-soft) !important; color: var(--wsc-text-strong) !important; box-shadow: none !important;
    }
    .wsc-portal-wrap .wsc-portal-sidebar.wsc-portal-collapsed .wsc-portal-nav-icon {
        width: 24px !important; height: 24px !important; background: transparent !important;
    }
    .wsc-portal-wrap .wsc-portal-sidebar.wsc-portal-collapsed .wsc-portal-nav-link.active .wsc-portal-nav-icon { background: transparent !important; }
    /* پس‌زمینه‌ی آیکون «خروج» طبق اصول UI/UX باید قرمز کم‌رنگ باشد، نه شفاف/هم‌رنگ بقیه‌ی آیتم‌ها —
       عمدا بعد رول عمومی بالا آمده تا برنده شود (قبلا چون قبل از آن رول بود، همیشه بی‌اثر می‌شد و
       دایره‌ی خروج شفاف/خاکستری می‌ماند، نه قرمز). */
    .wsc-portal-wrap .wsc-portal-sidebar.wsc-portal-collapsed .wsc-portal-nav-logout .wsc-portal-nav-icon { background: var(--wsc-danger-bg) !important; color: var(--wsc-danger) !important; box-shadow: 0 0 0 4px color-mix(in srgb, var(--wsc-danger) 12%, transparent) !important; }
    .wsc-portal-wrap .wsc-portal-sidebar.wsc-portal-collapsed .wsc-portal-nav-link > span:not(.wsc-portal-nav-icon) { display: none !important; }
}
@media (max-width: 900px) {
    .wsc-portal-wrap .wsc-portal-menu-toggle { display: inline-flex !important; }
    .wsc-portal-wrap .wsc-portal-body { display: block !important; }
    /* نکته: چون رول پایه‌ی .wsc-portal-sidebar بالاتر position:sticky !important دارد (برای مقاومت
       در برابر قالب)، override کردنش به position:fixed برای حالت کشویی موبایل هم باید !important
       داشته باشد — وگرنه رول پایه همیشه برنده می‌شود و سایدبار هیچ‌وقت کشویی نمی‌شود.
       سایدبار کشویی کل ارتفاع صفحه (از y=0) را می‌گیرد، نه فقط زیر نوار بالا — تا روی خود نوار
       بالا هم بنشیند، دقیقا مثل الگوی پیلاتس. */
    /* border-radius عمدا صفر است: روی موبایل این دیگر یک «کارت گرد شناور» نیست، یک پنل کشویی
       تمام‌عرض/تمام‌ارتفاع لبه‌به‌لبه است (دقیقا طبق خواسته‌ی صریح کارفرما: «گوشه‌های منو اصلی که
       باز میشه توی حالت موبایل اصلا نباید گردی داشته باشه») — رول پایه‌ی .wsc-portal-sidebar از
       var(--wsc-radius-lg) ارث می‌برد، پس اینجا صریحا صفر می‌شود.
       z-index هم عمدا بالاتر از ناوبار پایین (۵۷) و بالاتر از .wsc-topbar-card (که z-index:60 دارد
       و همیشه رندر می‌شود، پشت سایدبار هم) برده شد — با z-index:59 قبلی، کارت نوار بالا (که ۶۰
       است) روی سایدبار بازشده می‌نشست و انگار «روی منو افتاده» بود (دقیقا باگی که کارفرما با
       اسکرین‌شات نشان داد). عمدا overflow-y هم دیگر روی خود سایدبار نیست — فقط .wsc-portal-nav-links
       (پایین‌تر) اسکرول می‌گیرد؛ دو ظرف تودرتو که هر دو overflow-y:auto داشته باشند دقیقا همان
       افت «تا آخر اسکرول می‌کنی، خودش برمی‌گردد» را در موبایل ایجاد می‌کند (تداخل اسکرول لمسی/inertia
       بین دو container). */
    .wsc-portal-wrap .wsc-portal-sidebar {
        position: fixed !important; inset-inline-start: -240px !important; top: 0 !important; height: 100vh !important; width: 220px !important;
        background: var(--wsc-bg) !important; z-index: 100 !important; box-shadow: 2px 0 12px rgba(16,24,40,.12) !important;
        border-radius: 0 !important; transition: inset-inline-start .28s cubic-bezier(.4,0,.2,1) !important; padding: 18px 12px !important; overflow: hidden !important;
    }
    .wsc-portal-wrap .wsc-portal-sidebar.wsc-open { inset-inline-start: 0 !important; }
    /* دیگر نیازی به هک position:fixed سایدبار-هدر نیست — آیتم «منو» در ناوبار پایین موبایل
       (#wsc-portal-menu-toggle-bottom) یک محرک همیشه-در-دسترس جداگانه است، پس سایدبار-هدر می‌تواند
       دوباره جزء عادی همان کشویی باشد، بدون ترفند اضافه. */
    /* پرده‌ی نیمه‌شفاف پشت سایدبار کشویی (از جمله پشت نوار بالا و ناوبار پایین) — کلیک روی هر جای
       آن (فضای خالی) می‌بنددش. z-index از ناوبار پایین و کارت نوار بالا بالاتر است تا واقعا هر دو
       را هم تیره کند، ولی از خود سایدبار (۱۰۰) پایین‌تر می‌ماند. */
    .wsc-portal-wrap .wsc-portal-overlay {
        display: none; position: fixed !important; inset: 0 !important; background: rgba(15,23,42,.5) !important;
        z-index: 99 !important; opacity: 0; transition: opacity .24s cubic-bezier(.4,0,.2,1); pointer-events: none;
    }
    .wsc-portal-wrap .wsc-portal-overlay.wsc-open { display: block !important; opacity: 1; pointer-events: auto; }
    body.wsc-portal-noscroll { overflow: hidden !important; height: 100% !important; }
    /* وقتی کشویی کامل سایدبار باز است، ناوبار پایین دیگر نباید هم‌زمان دیده شود — دو منوی فعال
       هم‌زمان («این دوتا منو باهم تداخل داره») نه‌فقط بصری بلکه ازنظر تجربه‌ی کاربری هم گیج‌کننده است؛
       چون هر دو یک دکمه‌ی «منو» دارند. */
    body.wsc-portal-noscroll .wsc-portal-bottom-nav { display: none !important; }
    /* margin-right و border-radیوس رول پایه (که برای نشستن کنار سایدبار دسکتاپ حساب شده بودند)
       روی موبایل (که سایدبار اصلا کنارش نیست، بلکه کشویی/off-canvas است) فقط عرض محتوا را بی‌دلیل
       کم می‌کنند و یک‌طرفه (فقط سمت راست) دیده می‌شوند — دقیقا همان چیزی که کارفرما با margin
       نامتقارن «۰ ۱۰px ۰ ۰» در DevTools گزارش داد. */
    .wsc-portal-wrap .wsc-portal-content { padding: 16px 4px 50px !important; width: 100%; margin-right: 0 !important; border-radius: 16px !important; box-shadow: none !important; }
    .wsc-portal-wrap .wsc-field-grid-2 { grid-template-columns: 1fr; }
    .wsc-portal-wrap .wsc-slots-grid { grid-template-columns: repeat(2, 1fr); gap: 8px; }
    .wsc-portal-wrap .wsc-two-col { flex-direction: column; }
    .wsc-portal-wrap .wsc-two-col > div { min-width: 0; width: 100%; }
    /* در حالت تک‌ستونه flex-basis ستون‌ها (۱۷۰px / ۵۶۰px) به «ارتفاع» تبدیل می‌شد و کارت اپتومتری خالی کش می‌آمد و کارت تاریخ‌ها بریده می‌شد. */
    .wsc-portal-wrap .wsc-two-col.wsc-two-col.wsc-two-col > div { flex: 0 0 auto !important; }
    .wsc-portal-wrap .wsc-week-strip { grid-template-columns: repeat(7, minmax(60px, 1fr)); overflow-x: auto; }
    .wsc-portal-wrap .wsc-week-day { padding: 8px 4px !important; }
    /* طبق گزارش کارفرما («تاریخ از کارت زده بیرون») — این breakpoint ستون‌ها را تا ۶۰px جمع می‌کرد
       ولی فونت تاریخ همچنان ۱۶px (رجوع کنید به .wsc-week-day-num پایه) می‌ماند، پس رشته‌ی تاریخ
       (مثلا «۱۴۰۵/۰۷/۰۱») از عرض کارت بیرون می‌زد. */
    .wsc-portal-wrap .wsc-week-day-num { font-size: 12px !important; }
    .wsc-portal-wrap .wsc-tabs { overflow-x: auto; flex-wrap: nowrap; -webkit-overflow-scrolling: touch; }
    .wsc-portal-wrap .wsc-tab { white-space: nowrap; }
    .wsc-portal-wrap .wsc-cards-row { flex-direction: column; }
    .wsc-portal-wrap .wsc-caps-grid { grid-template-columns: 1fr; }
    .wsc-portal-wrap .wsc-save-bar { flex-direction: column !important; align-items: stretch !important; }
    .wsc-portal-wrap .wsc-portal-user-name { display: none !important; }
    /* پیل‌های KPI («۳ پذیرش پرداخت‌نشده» / «۲ بیمار داخل کلینیک») روی عرض باریک موبایل با
       flex-wrap:wrap (رول پایه) به ردیف پایین می‌افتادند؛ کارفرما صریحا خواست کنار هم بمانند —
       پس اینجا nowrap + کمی کوچک‌ترشدن فونت/پدینگ، و اگر تعدادشان در آینده زیاد شد، اسکرول افقی
       نرم (به‌جای افتادن به ردیف بعد) جایگزین می‌شود. */
    /* طبق خواسته‌ی صریح کارفرما: پیل‌ها دیگر برحسب متن‌شان عرض نمی‌گیرند، بلکه کشیده می‌شوند و
       هرکدام دقیقا نصف عرض ردیف (هم‌سایز) را می‌گیرند — نه فقط کنار هم با فضای خالی باقی‌مانده. */
    .wsc-portal-wrap .wsc-kpi-row { flex-wrap: nowrap !important; justify-content: stretch !important; }
    .wsc-portal-wrap .wsc-kpi-pill { flex: 1 1 0 !important; justify-content: center !important; padding: 8px 10px !important; font-size: 10.5px !important; white-space: nowrap !important; overflow: hidden; text-overflow: ellipsis; }

    /* ناوبار پایین موبایل (الگوی اپ‌مانند Negah) — فقط روی موبایل نمایان است؛ سایدبار کامل همچنان
       از طریق دکمه‌ی جمع‌وبازشو در دسترس می‌ماند برای آیتم‌هایی که اینجا جا نمی‌شوند. */
    /* طبق گزارش کارفرما («فاصله‌ها از پایین زیاده، الکی بزرگه») — bottom/پدینگ داخلی/پدینگ هر
       آیتم همه کمی جمع‌وجورتر شدند. */
    .wsc-portal-wrap .wsc-portal-bottom-nav {
        display: flex !important; position: fixed !important; bottom: 8px !important; inset-inline-start: 12px !important; inset-inline-end: 12px !important;
        z-index: 57 !important; background: var(--wsc-glass-bg) !important; border: 1px solid var(--wsc-glass-border) !important;
        backdrop-filter: var(--wsc-glass-blur) !important; -webkit-backdrop-filter: var(--wsc-glass-blur) !important;
        border-radius: var(--wsc-radius-lg) !important; box-shadow: var(--wsc-shadow-card-hover) !important; padding: 3px !important; gap: 2px !important;
    }
    .wsc-portal-wrap .wsc-portal-bottom-nav-link {
        flex: 1; display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: center !important; gap: 2px !important;
        padding: 4px 2px !important; border-radius: var(--wsc-radius-md) !important; text-decoration: none !important;
        color: var(--wsc-muted) !important; font-size: 9.5px !important; font-weight: 700 !important; white-space: nowrap !important;
    }
    /* آیتم «منو» یک <button> است (نه <a>) — چون فقط کشویی سایدبار را باز می‌کند، جایی ناوبری نمی‌کند؛
       باید ظاهر خام دکمه‌ی مرورگر (بک‌گراند/بردر/فونت) خنثی شود تا دقیقا هم‌شکل بقیه‌ی آیتم‌ها بماند. */
    .wsc-portal-wrap .wsc-portal-bottom-nav-menu-btn { background: transparent !important; border: none !important; cursor: pointer !important; font-family: inherit !important; }
    /* اندازه‌ی خود باکس آیکون عمدا ثابت/مربعی شده (نه فقط svg) — وگرنه بسته به شکل داخلی هر
       آیکون (مثلا «منو»ی سه‌خط که کاملا پرتر از بقیه‌ی آیکون‌هاست)، با اینکه svg همه یک اندازه بود،
       جعبه‌ی بصری‌شان نامساوی/بزرگ‌تر دیده می‌شد — دقیقا همان چیزی که کارفرما با اسکرین‌شات نشان داد. */
    .wsc-portal-wrap .wsc-portal-bottom-nav-icon {
        display: flex !important; align-items: center !important; justify-content: center !important;
        width: 18px !important; height: 18px !important;
    }
    .wsc-portal-wrap .wsc-portal-bottom-nav-icon .wsc-icon svg { width: 16px; height: 16px; }
    .wsc-portal-wrap .wsc-portal-bottom-nav-link.active {
        background: linear-gradient(135deg, var(--wsc-primary), var(--wsc-primary-dark)) !important; color: #fff !important;
        box-shadow: 0 6px 16px color-mix(in srgb, var(--wsc-primary) 35%, transparent) !important;
    }
    /* هم‌ارز ارتفاع ناوبار پایین + فاصله، تا آخرین محتوای صفحه زیر آن گم نشود. */
    .wsc-portal-wrap .wsc-portal-content { padding-bottom: 68px !important; }
}
@media (min-width: 901px) {
    .wsc-portal-wrap .wsc-portal-bottom-nav { display: none !important; }
}
/* تبلت (۹۰۱-۱۰۲۴px): عرض کافی برای منوی کناری کامل هست، پس از بلوک موبایل بالا مستثنی می‌ماند،
   اما برای ۷ کارت ثابت روزهای هفته هنوز کم است و روی هم/بیرون از کادر می‌افتاد — گزارش کارفرما. */
@media (min-width: 901px) and (max-width: 1024px) {
    .wsc-portal-wrap .wsc-week-strip { grid-template-columns: repeat(7, minmax(70px, 1fr)); overflow-x: auto; -webkit-overflow-scrolling: touch; }
    .wsc-portal-wrap .wsc-week-day { padding: 8px 4px !important; }
    .wsc-portal-wrap .wsc-week-day-num { font-size: 13px !important; }
}

@media (max-width: 480px) {
    /* روی گوشی واقعی، دیت‌پیکر شمسی چون نسبت به خود فیلد محرک (داخل یک ردیف flex-wrap) موقعیت
       می‌گرفت، بسته به اینکه کجای آن ردیف بیفتد ممکن بود از لبه‌ی صفحه بزند بیرون یا نصفه دیده شود.
       رفعش: روی موبایل کاملا position:fixed و نسبت به خود viewport وسط‌چین می‌شود، مستقل از موقعیت
       فیلد. عمدا left/right (نه transform:translate(-50%)) — آن ترکیب در بعضی مرورگرها درصد
       transform را از روی اندازه‌ی نادرست باکس حساب می‌کند و پاپ‌آپ را کاملا بیرون از صفحه می‌اندازد. */
    .wsc-portal-wrap .wsc-jalali-popup {
        position: fixed !important;
        top: 15vh !important;
        left: 4vw !important;
        right: 4vw !important;
        inset-inline-start: 4vw !important;
        inset-inline-end: 4vw !important;
        width: auto !important;
        max-height: 70vh !important;
        overflow-y: auto !important;
    }
    .wsc-portal-wrap .wsc-portal-login-card { padding: 26px 20px !important; }
    /* به‌جای قایم‌کردن ۳ روز از ۷ روز، هر ۷ روز نگه داشته می‌شوند و با کشیدن انگشت به چپ/راست
       قابل‌دیدن‌اند — رفتار بومی overflow-x:auto روی صفحه‌ی لمسی، بدون گم‌شدن هیچ روزی. */
    .wsc-portal-wrap .wsc-week-strip { grid-auto-flow: column; grid-auto-columns: minmax(78px, 1fr); grid-template-columns: none !important; overflow-x: auto !important; -webkit-overflow-scrolling: touch; scroll-snap-type: x proximity; padding-bottom: 4px; }
    .wsc-portal-wrap .wsc-week-day { scroll-snap-align: start; }
    .wsc-portal-wrap .wsc-week-day-num { font-size: 13px !important; }
}

/* ---------- محافظت کتابخانه‌ی رسانه‌ی خود وردپرس (wp.media) دربرابر ریست سراسری button ----------
   تا قبل فیچر «عکس پروفایل»، wp_enqueue_media() فقط در wp-admin لود می‌شد (جایی که تم فرانت اصلا
   وجود ندارد)؛ حالا که روی همین صفحه‌ی پورتال (فرانت) هم لود می‌شود، قانون سراسری تم سایت روی
   <button> خام (همان چیزی که در بالای همین فایل توضیح داده شده و باعث افتضاح‌شدن دکمه‌های خود
   پلاگین هم می‌شد) حالا روی دکمه‌های داخلی خود پاپ‌آپ وردپرس (ضربدر بستن، «انتخاب»، تب‌ها) هم
   افتاده — نه چیزی که پلاگین ما ساخته، خود هسته‌ی وردپرس است، پس باید صریحا از آن آسیب محافظت شود. */
.media-modal-close {
    background: transparent !important; background-color: transparent !important; color: #666 !important;
    border: none !important; border-radius: 0 !important; width: 50px !important; height: 50px !important;
    min-height: 0 !important; max-height: none !important; padding: 0 !important; box-shadow: none !important;
    line-height: normal !important; font-size: inherit !important;
}
.media-modal-close:hover { background: transparent !important; color: #000 !important; }
.media-frame .media-toolbar .button, .media-frame .button.media-button {
    background: #f6f7f7 !important; color: #2c3338 !important; border: 1px solid #c3c4c7 !important; border-radius: 3px !important;
    min-height: 30px !important; max-height: none !important; height: auto !important; padding: 0 10px !important; box-shadow: 0 1px 0 #c3c4c7 !important;
    line-height: 2.15384615 !important; font-size: 13px !important;
}
.media-frame .button.media-button.button-primary, .media-frame .button-primary {
    background: #2271b1 !important; color: #fff !important; border-color: #2271b1 !important; box-shadow: none !important;
}
.media-frame .media-menu-item, .media-frame .media-router .media-menu-item {
    background: transparent !important; border-radius: 0 !important; min-height: 0 !important; box-shadow: none !important;
}

/* طبق خواسته‌ی کارفرما: فیلدهای PD/KR/VA/IOP زیر جدول اپتومتری باید هم‌اندازه و هم‌شکل خانه‌های خود
   جدول باشند (فشرده، ۲۲px، وسط‌چین)، نه فیلدهای بزرگ پیش‌فرض فرم. */
.wsc-portal-wrap .wsc-opto-extra .wsc-field { margin-bottom: 6px !important; }
.wsc-portal-wrap .wsc-opto-extra .wsc-field label { font-size: 10.5px !important; margin-bottom: 2px !important; }
.wsc-portal-wrap .wsc-opto-extra .wsc-field-grid-2 { gap: 8px !important; }
.wsc-portal-wrap .wsc-opto-extra .wsc-panel-card-head { margin-bottom: 8px !important; }
.wsc-portal-wrap .wsc-opto-extra .wsc-hint { margin: 4px 0 2px !important; font-size: 10.5px !important; }
.wsc-portal-wrap .wsc-opto-extra .wsc-custom-select-trigger {
    height: 22px !important; min-height: 0 !important; border-radius: 6px !important; padding: 0 4px !important;
    font-size: 10.5px !important; font-weight: 600 !important; text-align: center !important;
}
.wsc-portal-wrap .wsc-opto-extra .wsc-custom-select-chevron { width: 10px !important; height: 10px !important; }
.wsc-portal-wrap .wsc-opto-extra input.wsc-exam-input { height: 22px !important; min-height: 0 !important; padding: 2px 3px !important; font-size: 10.5px !important; text-align: center !important; border-radius: 6px !important; }

/* جمع‌بندی Diagnosis / Plan زیر یافته‌های امروز — طبق خواسته‌ی پزشک؛ متن انگلیسی پس چپ‌چین. */
.wsc-portal-wrap .wsc-encounter-summary { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 12px; margin-top: 14px; direction: ltr; }
.wsc-portal-wrap .wsc-encounter-summary-box[hidden] { display: none !important; }
.wsc-portal-wrap .wsc-encounter-summary-box { border: 1px solid var(--wsc-border-soft); border-radius: var(--wsc-radius-sm); background: var(--wsc-bg); padding: 10px 14px; text-align: left; }
.wsc-portal-wrap .wsc-encounter-summary-box h4 { margin: 0 0 6px; font-size: 12.5px; font-weight: 800; color: var(--wsc-primary); }
.wsc-portal-wrap .wsc-encounter-summary-list { margin: 0; padding-left: 18px; font-size: 12px; line-height: 1.9; color: var(--wsc-ink); }
.wsc-portal-wrap .wsc-encounter-summary-group + .wsc-encounter-summary-group { margin-top: 6px; }
.wsc-portal-wrap .wsc-encounter-summary-group strong { font-size: 11.5px; color: var(--wsc-text-strong); }


/* ================= چیدمان‌های صفحه‌ی ویزیت پزشک (تنظیمات ← کارت ویزیت پزشک) =================
   نوار (افقی) ← ستون‌های مستقل (هرکدام بخش‌ها را زیر هم پشت‌سر‌هم می‌چیند) — بدون هم‌ترازی اجباری
   ردیف‌ها، پس فضای خالی ساختگی کنار بخش‌های کوتاه ایجاد نمی‌شود. روی صفحه‌ی کوچک همه زیر هم. */
.wsc-portal-wrap .wsc-dv-band { display: flex !important; gap: 14px !important; align-items: flex-start !important; margin-bottom: 14px !important; }
.wsc-portal-wrap .wsc-dv-col { display: flex !important; flex-direction: column !important; gap: 14px !important; min-width: 0 !important; }
.wsc-portal-wrap .wsc-dv-col > *, .wsc-portal-wrap .wsc-dv-col .wsc-dv-docs > .wsc-panel-card { margin: 0 !important; }
@media (max-width: 1099px) {
    .wsc-portal-wrap .wsc-dv-band { flex-direction: column !important; align-items: stretch !important; }
    .wsc-portal-wrap .wsc-dv-col { flex: 1 1 auto !important; width: 100% !important; }
}

/* فیلترهای داشبورد — پورت‌شده از نسخه‌ی معمولی نوبت‌دهی. */
.wsc-portal-wrap .wsc-dash-filters { display: flex !important; flex-wrap: wrap !important; gap: 6px !important; margin: 0 0 12px !important; }
.wsc-portal-wrap .wsc-dash-filter { border: 1px solid var(--wsc-border) !important; background: var(--wsc-surface) !important; color: var(--wsc-text-strong) !important; border-radius: 999px !important; padding: 6px 14px !important; font-size: 12px !important; font-weight: 700 !important; cursor: pointer !important; font-family: inherit !important; }
.wsc-portal-wrap .wsc-dash-filter:hover { background: var(--wsc-hover-bg) !important; }
.wsc-portal-wrap .wsc-dash-filter.is-active { background: var(--wsc-primary) !important; border-color: var(--wsc-primary) !important; color: #fff !important; }
.wsc-portal-wrap .wsc-card-filter { cursor: pointer !important; transition: box-shadow .12s ease, transform .12s ease, border-color .12s ease !important; }
.wsc-portal-wrap .wsc-card-filter:hover { transform: translateY(-2px) !important; }
.wsc-portal-wrap .wsc-card-filter.is-active { border-color: var(--wsc-primary) !important; box-shadow: 0 0 0 2px var(--wsc-primary) !important; }

/* دراپ‌داون «علت مراجعه»/«مسئول پیگیری» روی کارت نوبت — طبق خواسته‌ی کارفرما کوچک‌تر، هم‌اندازه‌ی بقیه‌ی
   محتوای کارت (بعد از سفارشی‌شدن همه‌ی select ها، اندازه‌ی استاندارد فرم را گرفته بود و بیش از حد درشت بود). */
.wsc-portal-wrap .wsc-appt-chip .wsc-custom-select-trigger { height: 26px !important; min-height: 0 !important; padding: 0 8px !important; font-size: 11px !important; border-radius: 8px !important; }
.wsc-portal-wrap .wsc-appt-chip .wsc-custom-select-chevron { width: 11px !important; height: 11px !important; }
.wsc-portal-wrap .wsc-appt-chip .wsc-pill .wsc-icon svg { width: 11px; height: 11px; vertical-align: -1px; }

.wsc-portal-wrap .wsc-custom-select:not(.wsc-custom-select-compact) { max-width: 340px !important; }

/* ================= ظاهر کلاسیک صفحه‌ی ویزیت پزشک (تنظیمات ← کارت ویزیت پزشک) =================
   طبق خواسته‌ی کارفرما: با یک تیک، همه‌ی بخش‌های صفحه‌ی پزشک شبیه برگه‌ی چاپی پرونده می‌شوند —
   زمینه‌ی سفید، خط مشکی نازک، بدون گردی/سایه/رنگ‌های پاستیلی، فونت ساده و خوانا. فقط ظاهر است؛
   هیچ عملکردی تغییر نمی‌کند و با برداشتن تیک همه‌چیز به حالت قبل برمی‌گردد. */
.wsc-portal-wrap .wsc-dv-classic { --wsc-radius-lg: 0; --wsc-radius-md: 0; --wsc-radius-sm: 0; font-family: Tahoma, Vazirmatn, sans-serif !important; color: #111 !important; }
.wsc-portal-wrap .wsc-dv-classic .wsc-panel-card,
.wsc-portal-wrap .wsc-dv-classic .wsc-history-card,
.wsc-portal-wrap .wsc-dv-classic .wsc-encounter-summary-box,
.wsc-portal-wrap .wsc-dv-classic .wsc-visit-summary-narrative,
.wsc-portal-wrap .wsc-dv-classic .wsc-document-row,
.wsc-portal-wrap .wsc-dv-classic .wsc-catalog-results {
    background: #fff !important; border: 1px solid #333 !important; border-radius: 0 !important; box-shadow: none !important;
    backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
}
.wsc-portal-wrap .wsc-dv-classic .wsc-panel-card-head { border-bottom: 1px solid #333 !important; padding-bottom: 6px !important; margin-bottom: 10px !important; }
.wsc-portal-wrap .wsc-dv-classic h3, .wsc-portal-wrap .wsc-dv-classic h4 { color: #000 !important; font-weight: 700 !important; }
.wsc-portal-wrap .wsc-dv-classic .wsc-history-col label, .wsc-portal-wrap .wsc-dv-classic .wsc-encounter-col h4, .wsc-portal-wrap .wsc-dv-classic .wsc-visit-summary-narrative h4,
.wsc-portal-wrap .wsc-dv-classic .wsc-encounter-summary-box h4 { background: none !important; color: #000 !important; padding: 0 !important; border-radius: 0 !important; }
.wsc-portal-wrap .wsc-dv-classic .wsc-chip, .wsc-portal-wrap .wsc-dv-classic .wsc-pill {
    background: #fff !important; color: #111 !important; border: 1px solid #555 !important; border-radius: 0 !important; box-shadow: none !important;
}
.wsc-portal-wrap .wsc-dv-classic input, .wsc-portal-wrap .wsc-dv-classic textarea, .wsc-portal-wrap .wsc-dv-classic .wsc-custom-select-trigger {
    background: #fff !important; border: 1px solid #555 !important; border-radius: 0 !important; box-shadow: none !important; color: #111 !important;
}
.wsc-portal-wrap .wsc-dv-classic .button, .wsc-portal-wrap .wsc-dv-classic .wsc-icon-btn, .wsc-portal-wrap .wsc-dv-classic .wsc-add-item-btn {
    background: #f4f4f4 !important; color: #111 !important; border: 1px solid #555 !important; border-radius: 0 !important; box-shadow: none !important;
}
.wsc-portal-wrap .wsc-dv-classic .button:hover, .wsc-portal-wrap .wsc-dv-classic .wsc-icon-btn:hover, .wsc-portal-wrap .wsc-dv-classic .wsc-add-item-btn:hover { background: #e2e2e2 !important; color: #000 !important; }
.wsc-portal-wrap .wsc-dv-classic .wsc-icon-btn:hover .wsc-icon { color: #000 !important; }
.wsc-portal-wrap .wsc-dv-classic table, .wsc-portal-wrap .wsc-dv-classic table.widefat { border: 1px solid #333 !important; border-collapse: collapse !important; border-radius: 0 !important; background: #fff !important; }
.wsc-portal-wrap .wsc-dv-classic table th, .wsc-portal-wrap .wsc-dv-classic table td { border: 1px solid #333 !important; background: #fff !important; filter: none !important; color: #111 !important; }
.wsc-portal-wrap .wsc-dv-classic table thead th { background: #f0f0f0 !important; }
.wsc-portal-wrap .wsc-dv-classic .wsc-date-list a { background: #fff !important; border: 1px solid #555 !important; border-radius: 0 !important; box-shadow: none !important; color: #111 !important; }
.wsc-portal-wrap .wsc-dv-classic .wsc-date-list a.active { background: #111 !important; color: #fff !important; }
.wsc-portal-wrap .wsc-dv-classic .wsc-date-list a.wsc-date-today { border-width: 2px !important; }
.wsc-portal-wrap .wsc-dv-classic .wsc-visit-summary-narrative li { border-inline-start-color: #999 !important; }
.wsc-portal-wrap .wsc-dv-classic .wsc-optometry-printout-tag { color: #000 !important; }
.wsc-portal-wrap .wsc-dv-classic .wsc-hint { color: #444 !important; }

/* چیدمان ۲: ردیف بالا سه‌تایی (از چپ: Diagnosis، Paraclinic، Surgery — در RTL اولین order راست‌ترین است)،
   Medication تنها در ردیف دوم و تمام‌عرض (اسامی داروها بلندند). */
.wsc-portal-wrap .wsc-dv-layout-2 .wsc-encounter-items-grid { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }

/* چیدمان ۴ — تاریخ‌ها یک نوار افقی اسکرول‌خور (تایم‌لاین) و یافته‌ها زیر هم به ترتیب بالینی. */
.wsc-portal-wrap .wsc-dv-layout-4 .wsc-date-list { display: flex !important; flex-wrap: nowrap !important; overflow-x: auto !important; gap: 8px !important; padding-bottom: 4px !important; }
.wsc-portal-wrap .wsc-dv-layout-4 .wsc-date-list li { flex: 0 0 auto !important; }
.wsc-portal-wrap .wsc-dv-layout-4 .wsc-encounter-items-grid { grid-template-columns: 1fr !important; }
.wsc-portal-wrap .wsc-dv-layout-4 .wsc-encounter-col[data-item-type="diagnosis"] { order: 1; }
.wsc-portal-wrap .wsc-dv-layout-4 .wsc-encounter-col[data-item-type="service"] { order: 2; }
.wsc-portal-wrap .wsc-dv-layout-4 .wsc-encounter-col[data-item-type="surgery"] { order: 3; }
.wsc-portal-wrap .wsc-dv-layout-4 .wsc-encounter-col[data-item-type="medication"] { order: 4; }
.wsc-portal-wrap .wsc-dv-layout-4 .wsc-history-grid { grid-template-columns: repeat(2, 1fr) !important; }

/* چیدمان ۵ (روان): تک‌ستونه؛ تاریخ‌ها نوار افقی، یافته‌ها چهارستونه، شرح حال شش‌ستونه. */
.wsc-portal-wrap .wsc-dv-layout-5 .wsc-dv-col { gap: 16px !important; }
.wsc-portal-wrap .wsc-dv-layout-5 .wsc-date-list { display: flex !important; flex-wrap: nowrap !important; overflow-x: auto !important; gap: 6px !important; }
.wsc-portal-wrap .wsc-dv-layout-5 .wsc-date-list a { flex: 0 0 auto !important; white-space: nowrap !important; }
.wsc-portal-wrap .wsc-dv-layout-5 .wsc-encounter-items-grid { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }
@media (max-width: 1099px) { .wsc-portal-wrap .wsc-dv-layout-5 .wsc-encounter-items-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } }

/* مدل‌های نمایش شرح حال (تنظیمات ← کارت ویزیت پزشک). مدل ۱ همان استایل پایه است. */
/* مدل ۲ — سطری (بازطراحی): هر دسته یک ردیف تمیز؛ ابزار افزودن راست، موارد وسط، برچسب انگلیسی چپ. */
.wsc-portal-wrap .wsc-history-grid.wsc-history-style-2 { grid-template-columns: 1fr !important; gap: 0 !important; border: 1px solid var(--wsc-border-soft) !important; border-radius: var(--wsc-radius-sm) !important; overflow: visible !important; }
.wsc-portal-wrap .wsc-history-style-2 .wsc-history-col { display: flex !important; align-items: center !important; gap: 10px !important; padding: 6px 10px !important; min-height: 42px !important; border-bottom: 1px solid var(--wsc-border-soft) !important; position: relative !important; }
.wsc-portal-wrap .wsc-history-style-2 .wsc-history-col:nth-child(even) { background: var(--wsc-bg) !important; }
.wsc-portal-wrap .wsc-history-style-2 .wsc-history-col:last-child { border-bottom: 0 !important; }
.wsc-portal-wrap .wsc-history-style-2 .wsc-history-card, .wsc-portal-wrap .wsc-history-style-2 .wsc-history-add { display: contents !important; }
.wsc-portal-wrap .wsc-history-style-2 .wsc-history-browse-btn, .wsc-portal-wrap .wsc-history-style-2 .wsc-history-add-btn { order: 1 !important; flex: 0 0 auto !important; }
.wsc-portal-wrap .wsc-history-style-2 .wsc-history-input { order: 1 !important; flex: 0 0 180px !important; width: 180px !important; }
.wsc-portal-wrap .wsc-history-style-2 .wsc-history-chips { order: 2 !important; flex: 1 1 auto !important; margin: 0 !important; min-height: 0 !important; }
.wsc-portal-wrap .wsc-history-style-2 .wsc-history-add > label, .wsc-portal-wrap .wsc-history-style-2 .wsc-history-card > label { order: 3 !important; flex: 0 0 56px !important; margin: 0 !important; text-align: center !important; direction: ltr !important; }
.wsc-portal-wrap .wsc-history-style-2 .wsc-history-suggestions { top: 100% !important; inset-inline-start: 10px !important; width: 260px !important; }
@media (max-width: 782px) { .wsc-portal-wrap .wsc-history-style-2 .wsc-history-col { flex-wrap: wrap !important; } .wsc-portal-wrap .wsc-history-style-2 .wsc-history-chips { flex-basis: 100% !important; order: 4 !important; } }
/* مدل ۳ — جدول برگه‌ای */
.wsc-portal-wrap .wsc-history-grid.wsc-history-style-3 { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 0 !important; border: 1px solid var(--wsc-border) !important; }
.wsc-portal-wrap .wsc-history-style-3 .wsc-history-col { border: 1px solid var(--wsc-border) !important; margin: -1px 0 0 -1px !important; padding: 0 0 6px !important; min-height: 64px !important; }
.wsc-portal-wrap .wsc-history-style-3 .wsc-history-card { border: 0 !important; border-bottom: 1px solid var(--wsc-border-soft) !important; border-radius: 0 !important; }
.wsc-portal-wrap .wsc-history-style-3 .wsc-history-chips { padding: 0 6px !important; }
@media (max-width: 782px) { .wsc-portal-wrap .wsc-history-grid.wsc-history-style-3 { grid-template-columns: 1fr !important; } }
/* مدل ۴ — مینیمال */
.wsc-portal-wrap .wsc-history-grid.wsc-history-style-4 { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 14px 18px !important; }
.wsc-portal-wrap .wsc-history-style-4 .wsc-history-col { border-top: 2px solid var(--wsc-primary) !important; padding-top: 6px !important; }
.wsc-portal-wrap .wsc-history-style-4 .wsc-history-card { background: transparent !important; border: 0 !important; padding: 0 !important; box-shadow: none !important; }
.wsc-portal-wrap .wsc-history-style-4 .wsc-history-card label { font-weight: 800 !important; font-size: 12px !important; }
@media (max-width: 782px) { .wsc-portal-wrap .wsc-history-grid.wsc-history-style-4 { grid-template-columns: 1fr !important; } }

/* کادر HEX کنار انتخابگر رنگ */
.wsc-portal-wrap .wsc-hex-input { width: 84px !important; font-family: monospace !important; font-size: 12px !important; padding: 3px 6px !important; margin-inline-start: 6px !important; vertical-align: middle !important; text-align: left !important; }
.wsc-portal-wrap .wsc-hex-input.is-invalid { border-color: var(--wsc-danger, #e11d48) !important; }

/* وقتی کادر تایپ حذف شده، برچسب انگلیسی دسته (CC/PMH/...) با margin خودکار به چپ ردیف می‌چسبد. */
.wsc-portal-wrap .wsc-history-add > label { margin-inline-start: auto !important; }

/* موارد شرح حال انگلیسی‌اند → از چپ چیده شوند؛ متن هر چیپ جهت خودش را از محتوا می‌گیرد (فارسی هم درست بماند). */
.wsc-portal-wrap .wsc-history-chips { direction: ltr !important; justify-content: flex-start !important; }
.wsc-portal-wrap .wsc-history-chips .wsc-chip { unicode-bidi: plaintext !important; }

/* ===== مدل‌های نمایش تاریخ‌های ویزیت و مدارک (تنظیمات ← کارت ویزیت پزشک) ===== */
/* پایه: نام فایل بلند دیگر کارت را سرریز نمی‌کند. */
.wsc-portal-wrap .wsc-document-row { min-width: 0 !important; }
.wsc-portal-wrap .wsc-document-name { min-width: 0 !important; overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; direction: ltr !important; text-align: right !important; }

.wsc-portal-wrap .wsc-doc-style-1 .wsc-document-row { flex-wrap: wrap !important; }
.wsc-portal-wrap .wsc-doc-style-1 .wsc-document-name { flex: 1 1 0 !important; }

/* تاریخ — مدل ۲: لیست فشرده */
.wsc-portal-wrap .wsc-date-style-2 { padding: 0 !important; }
.wsc-portal-wrap .wsc-date-style-2 li { margin: 0 !important; border-bottom: 1px solid var(--wsc-border-soft) !important; }
.wsc-portal-wrap .wsc-date-style-2 a { display: flex !important; align-items: baseline !important; justify-content: space-between !important; gap: 6px !important; background: transparent !important; border: 0 !important; border-radius: 0 !important; border-inline-start: 3px solid transparent !important; padding: 7px 8px !important; box-shadow: none !important; }
.wsc-portal-wrap .wsc-date-style-2 a small { margin: 0 !important; }
.wsc-portal-wrap .wsc-date-style-2 a.wsc-date-today { border-inline-start-color: var(--wsc-success) !important; background: var(--wsc-success-bg) !important; }
.wsc-portal-wrap .wsc-date-style-2 a.active { border-inline-start-color: var(--wsc-primary) !important; background: var(--wsc-hover-bg) !important; color: var(--wsc-primary) !important; }

/* تاریخ — مدل ۳: تایم‌لاین */
.wsc-portal-wrap .wsc-date-style-3 { padding: 4px 4px 4px 0 !important; }
.wsc-portal-wrap .wsc-date-style-3 li { position: relative !important; margin: 0 !important; padding-inline-start: 18px !important; }
.wsc-portal-wrap .wsc-date-style-3 li::before { content: "" !important; position: absolute !important; inset-inline-start: 6px !important; top: 0 !important; bottom: 0 !important; width: 2px !important; background: var(--wsc-border) !important; }
.wsc-portal-wrap .wsc-date-style-3 li::after { content: "" !important; position: absolute !important; inset-inline-start: 2px !important; top: 11px !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: var(--wsc-surface) !important; border: 2px solid var(--wsc-border) !important; box-sizing: border-box !important; }
.wsc-portal-wrap .wsc-date-style-3 li:has(a.wsc-date-today)::after { border-color: var(--wsc-success) !important; background: var(--wsc-success) !important; }
.wsc-portal-wrap .wsc-date-style-3 li:has(a.active)::after { border-color: var(--wsc-primary) !important; background: var(--wsc-primary) !important; }
.wsc-portal-wrap .wsc-date-style-3 a { background: transparent !important; border: 0 !important; box-shadow: none !important; padding: 5px 6px !important; color: var(--wsc-ink) !important; }
.wsc-portal-wrap .wsc-date-style-3 a.active { color: var(--wsc-primary) !important; background: var(--wsc-hover-bg) !important; }

/* تاریخ — مدل ۴: دکمه‌ای دوستونه */
.wsc-portal-wrap .wsc-date-style-4 { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 5px !important; }
.wsc-portal-wrap .wsc-date-style-4 li { margin: 0 !important; }
.wsc-portal-wrap .wsc-date-style-4 a { text-align: center !important; padding: 6px 4px !important; border-radius: 999px !important; }
.wsc-portal-wrap .wsc-date-style-4 a small { display: none !important; }

/* مدارک — مدل ۲: دوخطی */
.wsc-portal-wrap .wsc-doc-style-2 .wsc-document-row { display: grid !important; grid-template-columns: auto minmax(0, 1fr) !important; row-gap: 2px !important; padding: 8px 10px !important; }
.wsc-portal-wrap .wsc-doc-style-2 .wsc-document-row .wsc-icon { grid-row: 1 / 3 !important; }
.wsc-portal-wrap .wsc-doc-style-2 .wsc-document-meta { margin: 0 !important; white-space: normal !important; font-size: 10.5px !important; }

/* مدارک — مدل ۳: کاشی‌ای */
.wsc-portal-wrap .wsc-doc-style-3 { display: grid !important; grid-template-columns: repeat(auto-fill, minmax(110px, 1fr)) !important; gap: 8px !important; }
.wsc-portal-wrap .wsc-doc-style-3 .wsc-document-row { flex-direction: column !important; justify-content: center !important; text-align: center !important; gap: 6px !important; padding: 12px 8px !important; height: 100% !important; box-sizing: border-box !important; }
.wsc-portal-wrap .wsc-doc-style-3 .wsc-document-row .wsc-icon svg { width: 28px !important; height: 28px !important; }
.wsc-portal-wrap .wsc-doc-style-3 .wsc-document-name { max-width: 100% !important; text-align: center !important; font-size: 11.5px !important; }
.wsc-portal-wrap .wsc-doc-style-3 .wsc-document-meta { display: none !important; }

/* مدارک — مدل ۴: مینیمال */
.wsc-portal-wrap .wsc-doc-style-4 { gap: 0 !important; }
.wsc-portal-wrap .wsc-doc-style-4 .wsc-document-row { border: 0 !important; border-bottom: 1px dashed var(--wsc-border-soft) !important; border-radius: 0 !important; padding: 6px 2px !important; background: transparent !important; }
.wsc-portal-wrap .wsc-doc-style-4 li:last-child .wsc-document-row { border-bottom: 0 !important; }
.wsc-portal-wrap .wsc-doc-style-4 .wsc-document-name { color: var(--wsc-primary) !important; font-weight: 600 !important; }
.wsc-portal-wrap .wsc-doc-style-4 .wsc-document-meta { display: none !important; }

/* پیش‌نمایش لوگو در تنظیمات جمع‌وجور؛ لوگوی جداگانه‌ی حالت شب */
.wsc-portal-wrap .wsc-media-field-preview { max-height: 72px !important; max-width: 220px !important; width: auto !important; height: auto !important; object-fit: contain !important; }
.wsc-portal-wrap .wsc-logo-dark { display: none !important; }
body.wsc-dark-mode .wsc-portal-wrap .wsc-has-dark-logo .wsc-logo-light { display: none !important; }
body.wsc-dark-mode .wsc-portal-wrap .wsc-has-dark-logo .wsc-logo-dark { display: inline-block !important; }

/* ===== روانی پاپ‌آپ‌ها و اسکرول =====
   پاپ‌آپ‌ها از display:none مستقیم به نمایش می‌رفتند، پس انیمیشن محوشدن هرگز اجرا نمی‌شد و پاپ‌آپ «می‌پرید».
   حالا همیشه flex است و فقط با visibility/opacity باز و بسته می‌شود؛ بلور پس‌زمینه‌ی پاپ‌آپ هم حذف شد (کندی موقع باز شدن). */
.wsc-portal-wrap .wsc-modal-overlay { display: flex !important; visibility: hidden !important; pointer-events: none !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; transition: opacity .2s ease, visibility 0s linear .2s !important; }
.wsc-portal-wrap .wsc-modal-overlay.wsc-open { visibility: visible !important; pointer-events: auto !important; opacity: 1 !important; transition: opacity .2s ease, visibility 0s !important; }
.wsc-portal-wrap .wsc-modal { will-change: transform; }
/* بلور شیشه‌ای روی ده‌ها کارت محتوا هنگام اسکرول سنگین است (هر فریم دوباره محاسبه می‌شود)؛ پس‌زمینه‌ی ۸۵٪ مات
   بدون بلور تقریبا همان ظاهر را دارد. بلور فقط روی هدر و سایدبار (عناصر ثابت) می‌ماند. */
.wsc-portal-wrap .wsc-panel-card, .wsc-portal-wrap .wsc-card, .wsc-portal-wrap .wsc-history-card, .wsc-portal-wrap .wsc-encounter-summary-box { backdrop-filter: none !important; -webkit-backdrop-filter: none !important; }

/* ===== مدل‌های Quick Summary (تنظیمات ← کارت ویزیت پزشک) ===== */
/* مدل ۲ — سفید و مرتب */
.wsc-portal-wrap .wsc-visit-summary-narrative.wsc-qs-style-2 { background: var(--wsc-surface) !important; border: 1px solid var(--wsc-border-soft) !important; border-top: 4px solid var(--wsc-success) !important; box-shadow: var(--wsc-shadow-card) !important; }
.wsc-portal-wrap .wsc-visit-summary-narrative-optometry.wsc-qs-style-2 { border-top-color: var(--wsc-warning) !important; }
.wsc-portal-wrap .wsc-qs-style-2 ul { gap: 0 !important; }
.wsc-portal-wrap .wsc-qs-style-2 li { display: grid !important; grid-template-columns: 96px minmax(0, 1fr) !important; column-gap: 10px !important; border: 0 !important; border-bottom: 1px solid var(--wsc-border-soft) !important; padding: 6px 0 !important; line-height: 1.7 !important; }
.wsc-portal-wrap .wsc-qs-style-2 li:last-child { border-bottom: 0 !important; }
.wsc-portal-wrap .wsc-qs-style-2 li strong { color: var(--wsc-muted) !important; font-size: 11.5px !important; }
.wsc-portal-wrap .wsc-qs-style-2 .wsc-optometry-printout { font-family: inherit !important; gap: 8px !important; }
.wsc-portal-wrap .wsc-qs-style-2 .wsc-optometry-printout-section { border-bottom: 1px solid var(--wsc-border-soft) !important; padding-bottom: 6px !important; }
.wsc-portal-wrap .wsc-qs-style-2 .wsc-optometry-printout-section:last-child { border-bottom: 0 !important; }
.wsc-portal-wrap .wsc-qs-style-2 .wsc-optometry-printout-row { font-size: 13.5px !important; font-variant-numeric: tabular-nums !important; }
/* مدل ۳ — جدول برگه‌ای */
.wsc-portal-wrap .wsc-visit-summary-narrative.wsc-qs-style-3 { background: var(--wsc-surface) !important; border: 1px solid var(--wsc-text-strong) !important; border-radius: 0 !important; padding: 0 !important; box-shadow: none !important; }
.wsc-portal-wrap .wsc-qs-style-3 h4 { margin: 0 !important; padding: 7px 10px !important; background: var(--wsc-bg) !important; color: var(--wsc-text-strong) !important; border-bottom: 1px solid var(--wsc-text-strong) !important; }
.wsc-portal-wrap .wsc-qs-style-3 ul { gap: 0 !important; }
.wsc-portal-wrap .wsc-qs-style-3 li { display: grid !important; grid-template-columns: 100px minmax(0, 1fr) !important; border: 0 !important; border-bottom: 1px solid var(--wsc-border) !important; padding: 0 !important; line-height: 1.6 !important; }
.wsc-portal-wrap .wsc-qs-style-3 li:last-child { border-bottom: 0 !important; }
.wsc-portal-wrap .wsc-qs-style-3 li strong { background: var(--wsc-bg) !important; border-inline-end: 1px solid var(--wsc-border) !important; padding: 5px 8px !important; margin: 0 !important; display: block !important; }
.wsc-portal-wrap .wsc-qs-style-3 li { padding-inline-end: 8px !important; }
.wsc-portal-wrap .wsc-qs-style-3 .wsc-optometry-printout { gap: 0 !important; padding: 0 !important; }
.wsc-portal-wrap .wsc-qs-style-3 .wsc-optometry-printout-section { border-bottom: 1px solid var(--wsc-border) !important; padding: 6px 10px !important; }
.wsc-portal-wrap .wsc-qs-style-3 .wsc-optometry-printout-section:last-child { border-bottom: 0 !important; }
.wsc-portal-wrap .wsc-qs-style-3 .wsc-optometry-printout-tag { background: transparent !important; color: var(--wsc-text-strong) !important; border: 1px solid var(--wsc-text-strong) !important; border-radius: 0 !important; }
.wsc-portal-wrap .wsc-qs-style-3 .wsc-optometry-printout-row { font-size: 13.5px !important; }
/* مدل ۴ — فشرده */
.wsc-portal-wrap .wsc-visit-summary-narrative.wsc-qs-style-4 { padding: 9px 11px !important; }
.wsc-portal-wrap .wsc-qs-style-4 h4 { font-size: 11.5px !important; margin-bottom: 5px !important; }
.wsc-portal-wrap .wsc-qs-style-4 ul { gap: 3px !important; }
.wsc-portal-wrap .wsc-qs-style-4 li { font-size: 11.5px !important; line-height: 1.55 !important; padding-inline-start: 7px !important; }
.wsc-portal-wrap .wsc-qs-style-4 .wsc-optometry-printout { gap: 5px !important; }
.wsc-portal-wrap .wsc-qs-style-4 .wsc-optometry-printout-section { gap: 1px !important; }
.wsc-portal-wrap .wsc-qs-style-4 .wsc-optometry-printout-row { font-size: 12.5px !important; gap: 8px !important; }
.wsc-portal-wrap .wsc-qs-style-4 .wsc-optometry-printout-tag { height: 18px !important; min-width: 24px !important; font-size: 10.5px !important; }

/* ===== مدل‌های لیست‌های یافته‌های ویزیت ===== */
/* مدل ۲ — لیست تمیز */
.wsc-portal-wrap .wsc-enc-style-2 .wsc-catalog-results { border: 0 !important; background: transparent !important; }
.wsc-portal-wrap .wsc-enc-style-2 .wsc-catalog-result-row { padding: 6px 4px !important; min-height: 30px !important; border-bottom: 1px dashed var(--wsc-border-soft) !important; border-radius: 6px !important; }
.wsc-portal-wrap .wsc-enc-style-2 .wsc-catalog-result-row:hover { background: var(--wsc-hover-bg) !important; }
.wsc-portal-wrap .wsc-enc-style-2 .wsc-catalog-result-name { font-size: 12px !important; font-weight: 600 !important; }
.wsc-portal-wrap .wsc-enc-style-2 .wsc-add-item-btn { background: transparent !important; border-color: transparent !important; color: var(--wsc-muted) !important; box-shadow: none !important; }
.wsc-portal-wrap .wsc-enc-style-2 .wsc-catalog-result-row:hover .wsc-add-item-btn { border-color: var(--wsc-border) !important; color: var(--wsc-primary) !important; background: var(--wsc-surface) !important; }
.wsc-portal-wrap .wsc-enc-style-2 .wsc-add-item-btn:hover { background: var(--wsc-primary) !important; border-color: var(--wsc-primary) !important; color: #fff !important; }
/* مدل ۳ — جدول راه‌راه */
.wsc-portal-wrap .wsc-enc-style-3 .wsc-encounter-col h4 { background: var(--wsc-primary) !important; color: #fff !important; padding: 6px 10px !important; border-radius: var(--wsc-radius-sm) var(--wsc-radius-sm) 0 0 !important; margin-bottom: 0 !important; }
.wsc-portal-wrap .wsc-enc-style-3 .wsc-catalog-results { border-radius: 0 0 var(--wsc-radius-sm) var(--wsc-radius-sm) !important; border-color: var(--wsc-border) !important; }
.wsc-portal-wrap .wsc-enc-style-3 .wsc-catalog-result-row { border-bottom: 0 !important; padding: 5px 8px !important; }
.wsc-portal-wrap .wsc-enc-style-3 .wsc-catalog-result-row:nth-child(even) { background: var(--wsc-bg) !important; }
.wsc-portal-wrap .wsc-enc-style-3 .wsc-catalog-result-row:hover { background: var(--wsc-hover-bg) !important; }
.wsc-portal-wrap .wsc-enc-style-3 .wsc-catalog-result-name { font-size: 11.5px !important; }
/* مدل ۴ — فشرده */
.wsc-portal-wrap .wsc-enc-style-4 .wsc-catalog-result-row { padding: 1px 4px !important; min-height: 18px !important; gap: 2px !important; }
.wsc-portal-wrap .wsc-enc-style-4 .wsc-catalog-result-name { font-size: 10px !important; line-height: 1.3 !important; }
.wsc-portal-wrap .wsc-enc-style-4 .wsc-add-item-btn { min-height: 0 !important; height: 17px !important; line-height: 15px !important; padding: 0 4px !important; font-size: 9px !important; }
.wsc-portal-wrap .wsc-enc-style-4 .wsc-star-btn { font-size: 11px !important; }

.wsc-portal-wrap .wsc-history-add:not(.wsc-history-add-locked) > label { cursor: pointer !important; user-select: none !important; }
.wsc-portal-wrap .wsc-history-add:not(.wsc-history-add-locked) > label:hover { filter: brightness(.93) !important; }

/* ستون خاموش‌شده (تنظیمات) جای خالی را سمت چپ نگذارد: شبکه چپ‌به‌راست پر می‌شود با همان ترتیب دیداری قبلی
   (از چپ: Diagnosis، Paraclinic، Surgery، Medication)، پس ستون‌ها به چپ می‌چسبند و جای خالی سمت راست می‌ماند. */
.wsc-portal-wrap .wsc-dv-layout-2 .wsc-encounter-items-grid, .wsc-portal-wrap .wsc-dv-layout-5 .wsc-encounter-items-grid { direction: ltr !important; }
.wsc-portal-wrap .wsc-dv-layout-2 .wsc-encounter-col, .wsc-portal-wrap .wsc-dv-layout-5 .wsc-encounter-col { direction: rtl !important; }
.wsc-portal-wrap .wsc-dv-layout-2 .wsc-encounter-col[data-item-type="diagnosis"], .wsc-portal-wrap .wsc-dv-layout-5 .wsc-encounter-col[data-item-type="diagnosis"] { order: 1 !important; }
.wsc-portal-wrap .wsc-dv-layout-2 .wsc-encounter-col[data-item-type="service"], .wsc-portal-wrap .wsc-dv-layout-5 .wsc-encounter-col[data-item-type="service"] { order: 2 !important; }
.wsc-portal-wrap .wsc-dv-layout-2 .wsc-encounter-col[data-item-type="surgery"], .wsc-portal-wrap .wsc-dv-layout-5 .wsc-encounter-col[data-item-type="surgery"] { order: 3 !important; }
.wsc-portal-wrap .wsc-dv-layout-2 .wsc-encounter-col[data-item-type="medication"], .wsc-portal-wrap .wsc-dv-layout-5 .wsc-encounter-col[data-item-type="medication"] { order: 4 !important; }

/* منوی پروفایل: فاصله‌ی ۶پیکسلی بین دکمه و منو باعث می‌شد با رفتن ماوس به سمت منو، هاور قطع و منو بسته شود.
   یک پل نامرئی آن فاصله را پر می‌کند، بستن ۲۵۰ms تأخیر دارد، و با فوکوس (کیبورد/لمس) هم باز می‌ماند. */
.wsc-portal-wrap .wsc-user-menu-dropdown { display: block !important; visibility: hidden !important; opacity: 0 !important; pointer-events: none !important; transition: opacity .15s ease .25s, visibility 0s linear .4s !important; }
.wsc-portal-wrap .wsc-user-menu-dropdown::before { content: "" !important; position: absolute !important; left: 0 !important; right: 0 !important; top: -12px !important; height: 12px !important; }
.wsc-portal-wrap .wsc-user-menu:hover .wsc-user-menu-dropdown, .wsc-portal-wrap .wsc-user-menu:focus-within .wsc-user-menu-dropdown { visibility: visible !important; opacity: 1 !important; pointer-events: auto !important; transition: opacity .12s ease, visibility 0s !important; }

/* در چیدمان‌های ۴ و ۵ تاریخ‌ها نوار افقی‌اند؛ خط عمودی تایم‌لاین (مدل ۳) آنجا بی‌معناست — فقط نقطه می‌ماند.
   مدل ۴ (دکمه‌ای دوستونه) هم در نوار افقی ستون‌بندی نمی‌شود. */
.wsc-portal-wrap .wsc-dv-layout-4 .wsc-date-style-3 li::before, .wsc-portal-wrap .wsc-dv-layout-5 .wsc-date-style-3 li::before { display: none !important; }
.wsc-portal-wrap .wsc-dv-layout-4 .wsc-date-style-2 li, .wsc-portal-wrap .wsc-dv-layout-5 .wsc-date-style-2 li { border-bottom: 0 !important; }

/* انتخاب‌گر تم رنگی (تنظیمات ← ظاهر پنل ادمین) */
.wsc-portal-wrap .wsc-theme-grid { display: grid !important; grid-template-columns: repeat(auto-fill, minmax(112px, 1fr)) !important; gap: 10px !important; margin-top: 8px !important; }
.wsc-portal-wrap .wsc-theme-card { display: flex !important; flex-direction: column !important; align-items: center !important; gap: 6px !important; padding: 10px 6px !important; border: 2px solid var(--wsc-border) !important; border-radius: var(--wsc-radius-md) !important; background: var(--wsc-surface) !important; position: relative !important; cursor: pointer !important; transition: border-color .15s ease, transform .15s ease !important; font-weight: 600 !important; }
.wsc-portal-wrap .wsc-theme-card:hover { transform: translateY(-2px) !important; }
.wsc-portal-wrap .wsc-theme-card.is-active { border-color: var(--wsc-primary) !important; box-shadow: 0 0 0 3px color-mix(in srgb, var(--wsc-primary) 25%, transparent) !important; }
.wsc-portal-wrap .wsc-theme-card input { position: absolute !important; opacity: 0 !important; pointer-events: none !important; }
.wsc-portal-wrap .wsc-theme-swatch { width: 44px !important; height: 44px !important; border-radius: 50% !important; border: 1px solid rgba(0,0,0,.08) !important; }
.wsc-portal-wrap .wsc-theme-swatch-custom { background: conic-gradient(#2f86ff, #7c4dbe, #db2777, #ea580c, #b7791f, #059669, #0891b2, #2f86ff) !important; }
.wsc-portal-wrap .wsc-theme-name { font-size: 11.5px !important; color: var(--wsc-ink) !important; text-align: center !important; }

/* تنظیمات: جستجو و تیتر بخش‌ها */
.wsc-portal-wrap .wsc-settings-search { margin: 0 0 12px !important; }
.wsc-portal-wrap .wsc-settings-search input { width: 100% !important; max-width: 520px !important; padding: 10px 14px !important; border-radius: 999px !important; border: 1px solid var(--wsc-form-border) !important; background: var(--wsc-surface) !important; font-size: 13px !important; box-sizing: border-box !important; }
.wsc-portal-wrap .wsc-settings-section { margin: 22px 0 10px !important; padding: 0 0 6px !important; font-size: 13.5px !important; font-weight: 800 !important; color: var(--wsc-primary) !important; border-bottom: 1px solid var(--wsc-border-soft) !important; }
.wsc-portal-wrap .wsc-panel-card > .wsc-settings-section:first-child { margin-top: 0 !important; }

/* تم رنگی شخصی در منوی پروفایل */
.wsc-portal-wrap .wsc-my-theme { border-top: 1px solid var(--wsc-border-soft) !important; margin-top: 4px !important; padding: 8px 6px 4px !important; }
.wsc-portal-wrap .wsc-my-theme-title { display: block !important; font-size: 11px !important; font-weight: 700 !important; color: var(--wsc-muted) !important; margin-bottom: 6px !important; }
.wsc-portal-wrap .wsc-my-theme-swatches { display: grid !important; grid-template-columns: repeat(6, 22px) !important; gap: 6px !important; }
.wsc-portal-wrap .wsc-user-menu-dropdown .wsc-my-theme-dot { width: 22px !important; height: 22px !important; min-width: 0 !important; padding: 0 !important; margin: 0 !important; border-radius: 50% !important; border: 2px solid var(--wsc-surface) !important; box-shadow: 0 0 0 1px var(--wsc-border) !important; cursor: pointer !important; display: block !important; background: var(--wsc-dot, #ccc) !important; }
.wsc-portal-wrap .wsc-user-menu-dropdown .wsc-my-theme-dot:hover { transform: scale(1.12) !important; background: var(--wsc-dot, #ccc) !important; }
.wsc-portal-wrap .wsc-user-menu-dropdown .wsc-my-theme-dot.is-active { box-shadow: 0 0 0 2px var(--wsc-ink) !important; }
.wsc-portal-wrap .wsc-user-menu-dropdown .wsc-my-theme-default { background: conic-gradient(#2f86ff, #7c4dbe, #db2777, #ea580c, #059669, #2f86ff) !important; }
.wsc-portal-wrap .wsc-user-menu-dropdown { min-width: 190px !important; }

/* ===== استایل شیشه‌ای (تنظیمات ← ظاهر و تم رنگی) =====
   پس‌زمینه‌ی رنگی لکه‌دار (از رنگ اصلی تم) + کارت‌های نیمه‌شفاف با بلور و لبه‌ی روشن. بلور فقط در همین حالت
   فعال است (در حالت عادی برای سرعت خاموش است). */
.wsc-portal-wrap.wsc-glass { --wsc-glass-card: rgba(255, 255, 255, .52); --wsc-glass-edge: rgba(255, 255, 255, .7); }
body.wsc-dark-mode .wsc-portal-wrap.wsc-glass { --wsc-glass-card: rgba(22, 27, 36, .5); --wsc-glass-edge: rgba(255, 255, 255, .1); }
.wsc-portal-wrap.wsc-glass {
    background:
        radial-gradient(40% 50% at 12% 18%, color-mix(in srgb, var(--wsc-primary) 38%, transparent), transparent 70%),
        radial-gradient(35% 45% at 88% 12%, color-mix(in srgb, var(--wsc-primary) 22%, #f0abfc), transparent 70%),
        radial-gradient(45% 55% at 70% 92%, color-mix(in srgb, var(--wsc-primary) 30%, #5eead4), transparent 70%) !important;
    background-attachment: fixed !important;
}
.wsc-portal-wrap.wsc-glass .wsc-panel-card, .wsc-portal-wrap.wsc-glass .wsc-card, .wsc-portal-wrap.wsc-glass .wsc-history-card, .wsc-portal-wrap.wsc-glass .wsc-encounter-summary-box,
.wsc-portal-wrap.wsc-glass .wsc-visit-summary-narrative, .wsc-portal-wrap.wsc-glass .wsc-modal, .wsc-portal-wrap.wsc-glass .wsc-user-menu-dropdown {
    background: var(--wsc-glass-card) !important;
    border: 1px solid var(--wsc-glass-edge) !important;
    backdrop-filter: blur(18px) saturate(160%) !important; -webkit-backdrop-filter: blur(18px) saturate(160%) !important;
    box-shadow: 0 8px 32px rgba(15, 23, 42, .12), inset 0 1px 0 var(--wsc-glass-edge) !important;
}
.wsc-portal-wrap.wsc-glass .wsc-catalog-results, .wsc-portal-wrap.wsc-glass table, .wsc-portal-wrap.wsc-glass .wsc-date-list a:not(.active) { background: color-mix(in srgb, var(--wsc-surface) 45%, transparent) !important; }
.wsc-portal-wrap.wsc-glass input:not([type="checkbox"]):not([type="radio"]):not([type="color"]), .wsc-portal-wrap.wsc-glass textarea, .wsc-portal-wrap.wsc-glass .wsc-custom-select-trigger { background: color-mix(in srgb, var(--wsc-surface) 70%, transparent) !important; }

body.wsc-portal-page-body:has(.wsc-portal-wrap.wsc-glass):not(.wsc-dark-mode) { background-image: linear-gradient(160deg, #ffffff, color-mix(in srgb, #ffffff 80%, #c7d2fe)) !important; }

/* ================= کیت رابط کاربری: toast / پنجره‌ی تایید / اسکلت بارگذاری / حالت خالی / انیمیشن / فوکوس / تبلت ================= */
/* پیام گوشه‌ی صفحه */
.wsc-portal-wrap #wsc-toast-stack { position: fixed !important; bottom: 20px !important; left: 20px !important; z-index: 100000 !important; display: flex !important; flex-direction: column-reverse !important; gap: 8px !important; max-width: min(380px, calc(100vw - 40px)) !important; pointer-events: none !important; }
.wsc-portal-wrap .wsc-toast { pointer-events: auto !important; cursor: pointer !important; padding: 11px 16px !important; border-radius: 12px !important; font-size: 12.5px !important; font-weight: 600 !important; line-height: 1.7 !important; color: #fff !important; box-shadow: 0 10px 30px rgba(15, 23, 42, .22) !important; opacity: 0 !important; transform: translateY(10px) !important; transition: opacity .22s ease, transform .22s ease !important; }
.wsc-portal-wrap .wsc-toast.is-in { opacity: 1 !important; transform: translateY(0) !important; }
.wsc-portal-wrap .wsc-toast-success { background: var(--wsc-success) !important; }
.wsc-portal-wrap .wsc-toast-error { background: var(--wsc-danger) !important; }
.wsc-portal-wrap .wsc-toast-info { background: var(--wsc-ink) !important; }
/* پنجره‌ی تایید/ورودی */
.wsc-portal-wrap .wsc-dialog { max-width: 400px !important; padding: 22px !important; }
.wsc-portal-wrap .wsc-dialog-text { margin: 0 0 14px !important; font-size: 14px !important; line-height: 1.9 !important; color: var(--wsc-ink) !important; font-weight: 600 !important; }
.wsc-portal-wrap .wsc-dialog-input { width: 100% !important; box-sizing: border-box !important; padding: 9px 12px !important; border-radius: var(--wsc-radius-sm) !important; border: 1px solid var(--wsc-form-border) !important; background: var(--wsc-surface) !important; color: var(--wsc-ink) !important; font: inherit !important; }
.wsc-portal-wrap textarea.wsc-dialog-input { min-height: 80px !important; resize: vertical !important; }
.wsc-portal-wrap .wsc-dialog-error { color: var(--wsc-danger) !important; font-size: 11.5px !important; min-height: 16px !important; margin-top: 4px !important; }
.wsc-portal-wrap .wsc-dialog-actions { display: flex !important; gap: 8px !important; justify-content: flex-start !important; margin-top: 8px !important; }
.wsc-portal-wrap .wsc-dialog.is-danger .wsc-dialog-ok { background: var(--wsc-danger) !important; border-color: var(--wsc-danger) !important; color: #fff !important; }
/* اسکلت بارگذاری */
@keyframes wsc-shimmer { 0% { background-position: 100% 0; } 100% { background-position: -100% 0; } }
.wsc-portal-wrap .wsc-skeleton-row { padding: 8px 8px !important; border-bottom: 1px solid var(--wsc-border-soft) !important; }
.wsc-portal-wrap .wsc-skeleton { display: block !important; height: 12px !important; border-radius: 6px !important; width: 70% !important; background: linear-gradient(90deg, var(--wsc-border-soft) 25%, color-mix(in srgb, var(--wsc-border-soft) 40%, var(--wsc-surface)) 50%, var(--wsc-border-soft) 75%) !important; background-size: 200% 100% !important; animation: wsc-shimmer 1.2s linear infinite !important; }
.wsc-portal-wrap .wsc-skeleton-row:nth-child(2n) .wsc-skeleton { width: 55% !important; }
.wsc-portal-wrap .wsc-skeleton-row:nth-child(3n) .wsc-skeleton { width: 82% !important; }
.wsc-portal-wrap .wsc-is-loading { opacity: .55 !important; transition: opacity .15s ease !important; pointer-events: none !important; }
/* حالت خالی */
.wsc-portal-wrap .wsc-empty { display: block !important; text-align: center !important; padding: 26px 12px !important; color: var(--wsc-muted) !important; font-size: 12.5px !important; }
.wsc-portal-wrap .wsc-empty::before { content: "" !important; display: block !important; width: 38px !important; height: 38px !important; margin: 0 auto 8px !important; border-radius: 50% !important; background: color-mix(in srgb, var(--wsc-primary) 12%, transparent) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2394a3b8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 12h-6l-2 3h-4l-2-3H2'/%3E%3Cpath d='M5.45 5.11 2 12v6a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2v-6l-3.45-6.89A2 2 0 0 0 16.76 4H7.24a2 2 0 0 0-1.79 1.11z'/%3E%3C/svg%3E") center / 20px no-repeat !important; }
.wsc-portal-wrap td.wsc-empty::before { display: block !important; }
/* انیمیشن ورود/خروج چیپ‌ها + هایلایت مورد تازه */
@keyframes wsc-chip-in { 0% { opacity: 0; transform: scale(.85); } 100% { opacity: 1; transform: scale(1); } }
@keyframes wsc-chip-flash { 0% { box-shadow: 0 0 0 3px color-mix(in srgb, var(--wsc-primary) 45%, transparent); } 100% { box-shadow: 0 0 0 0 transparent; } }
.wsc-portal-wrap .wsc-history-chips .wsc-chip, .wsc-portal-wrap .wsc-selected-items .wsc-chip { animation: wsc-chip-in .2s ease-out, wsc-chip-flash 1.1s ease-out !important; }
.wsc-portal-wrap .wsc-chip.is-leaving { opacity: 0 !important; transform: scale(.85) !important; transition: opacity .15s ease, transform .15s ease !important; }
@media (prefers-reduced-motion: reduce) { .wsc-portal-wrap .wsc-chip, .wsc-portal-wrap .wsc-toast, .wsc-portal-wrap .wsc-skeleton { animation: none !important; transition: none !important; } }
/* نوار ذخیره‌ی چسبان + نشانگر تغییرات ذخیره‌نشده */
.wsc-portal-wrap .wsc-save-bar { position: sticky !important; bottom: 12px !important; z-index: 20 !important; background: var(--wsc-surface) !important; box-shadow: 0 -4px 20px rgba(15, 23, 42, .10) !important; }
.wsc-portal-wrap form.wsc-form-dirty .wsc-save-bar { border-color: var(--wsc-warning) !important; }
.wsc-portal-wrap form.wsc-form-dirty .wsc-save-bar > .wsc-hint { color: var(--wsc-warning) !important; font-weight: 700 !important; font-size: 0 !important; }
.wsc-portal-wrap form.wsc-form-dirty .wsc-save-bar > .wsc-hint::after { content: "● تغییرات ذخیره نشده دارید" !important; font-size: 12px !important; }
/* حلقه‌ی فوکوس واضح برای کار با کیبورد (فقط با Tab، نه با کلیک ماوس) */
.wsc-portal-wrap :is(a, button, input, select, textarea, [tabindex], .wsc-custom-select-trigger):focus-visible { outline: 2px solid var(--wsc-primary) !important; outline-offset: 2px !important; }
/* تبلت و صفحه‌ی لمسی */
@media (max-width: 1199px) and (min-width: 768px) {
    .wsc-portal-wrap .wsc-dv:not(.wsc-dv-layout-4) .wsc-encounter-items-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
    .wsc-portal-wrap .wsc-history-grid.wsc-history-style-1, .wsc-portal-wrap .wsc-history-grid.wsc-history-style-4 { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
    .wsc-portal-wrap .wsc-visit-summary-split { flex-direction: column !important; }
}
@media (pointer: coarse) {
    .wsc-portal-wrap .wsc-add-item-btn { min-height: 30px !important; min-width: 36px !important; }
    .wsc-portal-wrap .wsc-chip-remove { min-width: 24px !important; min-height: 24px !important; }
    .wsc-portal-wrap .wsc-icon-btn { min-width: 38px !important; min-height: 38px !important; }
    .wsc-portal-wrap .wsc-catalog-result-row { min-height: 36px !important; }
    .wsc-portal-wrap .wsc-date-list a { padding-top: 9px !important; padding-bottom: 9px !important; }
}

/* بخش PD/KR، Contact Lens و IOP در اپتومتری: چپ‌به‌راست (عنوان‌ها انگلیسی)، سه کارت کنار هم */
.wsc-portal-wrap .wsc-opto-extra { display: grid !important; grid-template-columns: 1.5fr 1.3fr 1fr 1fr !important; gap: 14px !important; direction: ltr !important; align-items: start !important; margin-bottom: 14px !important; }
.wsc-portal-wrap .wsc-opto-extra > .wsc-panel-card { margin: 0 !important; text-align: left !important; }
.wsc-portal-wrap .wsc-opto-extra .wsc-panel-card-head, .wsc-portal-wrap .wsc-opto-extra .wsc-field label { text-align: left !important; justify-content: flex-start !important; }
.wsc-portal-wrap .wsc-cl-grid { display: grid !important; grid-template-columns: 34px repeat(3, minmax(0, 1fr)) !important; gap: 6px 8px !important; align-items: center !important; }
.wsc-portal-wrap .wsc-cl-head { font-size: 10.5px !important; font-weight: 700 !important; color: var(--wsc-text-strong) !important; text-align: center !important; }
.wsc-portal-wrap .wsc-cl-eye { font-size: 11px !important; font-weight: 800 !important; color: var(--wsc-muted) !important; }
@media (max-width: 1099px) { .wsc-portal-wrap .wsc-opto-extra { grid-template-columns: 1fr !important; } }

@media (max-width: 1399px) and (min-width: 1100px) { .wsc-portal-wrap .wsc-opto-extra { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } }

/* تصمیم بالینی و دید دوچشمی در فرم اپتومتری */
.wsc-portal-wrap .wsc-opto-checks { display: flex !important; flex-wrap: wrap !important; gap: 8px 16px !important; margin-bottom: 10px !important; }
.wsc-portal-wrap .wsc-check { display: inline-flex !important; align-items: center !important; gap: 6px !important; font-size: 12.5px !important; cursor: pointer !important; }
.wsc-portal-wrap .wsc-check-chip { padding: 5px 10px !important; border: 1px solid var(--wsc-border) !important; border-radius: 999px !important; background: var(--wsc-surface) !important; }
.wsc-portal-wrap .wsc-check-chip:has(input:checked) { border-color: var(--wsc-primary) !important; background: var(--wsc-hover-bg) !important; }
.wsc-portal-wrap .wsc-opto-cd .wsc-field-grid-2 { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
.wsc-portal-wrap .wsc-opto-bv { direction: ltr !important; text-align: left !important; }
.wsc-portal-wrap .wsc-opto-bv .wsc-field label { text-align: left !important; }
.wsc-portal-wrap .wsc-bv-grid { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 10px 16px !important; }
.wsc-portal-wrap .wsc-bv-pair { display: grid !important; grid-template-columns: 110px minmax(0, 1fr) !important; gap: 6px !important; }
.wsc-portal-wrap .wsc-opto-bv input.wsc-exam-input { height: 34px !important; font-size: 12.5px !important; text-align: left !important; }
.wsc-portal-wrap .wsc-opto-extra-line { font-family: inherit !important; font-size: 12.5px !important; direction: rtl !important; text-align: right !important; unicode-bidi: plaintext !important; }
@media (max-width: 900px) { .wsc-portal-wrap .wsc-opto-cd .wsc-field-grid-2, .wsc-portal-wrap .wsc-bv-grid { grid-template-columns: 1fr !important; } }

/* تنظیمات: فیلدهای کوتاه (عدد/اعشار/رنگ) به‌جای تمام‌عرض، چندتایی کنار هم (حدود ۲۰٪ عرض) */
.wsc-portal-wrap #wsc-settings-form .wsc-panel-card { display: flex !important; flex-wrap: wrap !important; column-gap: 16px !important; align-items: flex-end !important; }
.wsc-portal-wrap #wsc-settings-form .wsc-panel-card > * { flex: 1 1 100% !important; }
.wsc-portal-wrap #wsc-settings-form .wsc-panel-card > .wsc-field-short { flex: 0 1 calc(20% - 13px) !important; min-width: 150px !important; }
.wsc-portal-wrap #wsc-settings-form .wsc-field-short input { width: 100% !important; }

/* گزینه‌ی فعال با کیبورد در لیست کشویی */
.wsc-portal-wrap .wsc-custom-select-option.is-active { background: var(--wsc-primary) !important; color: #fff !important; }

/* فاصله‌ی نوار ذخیره از کارت بالایی */
.wsc-portal-wrap .wsc-save-bar { margin-top: 18px !important; }

/* تنظیمات: لیست‌های چندخطی ربع عرض، تیک‌ها سه‌ستونه، برچسب‌های کوتاه ۲۰٪ */
.wsc-portal-wrap #wsc-settings-form .wsc-panel-card > .wsc-field-quarter { flex: 0 1 calc(25% - 12px) !important; min-width: 200px !important; }
.wsc-portal-wrap #wsc-settings-form .wsc-field-quarter textarea { width: 100% !important; min-height: 120px !important; }
.wsc-portal-wrap #wsc-settings-form .wsc-panel-card > .wsc-switch { flex: 0 1 calc(33.333% - 11px) !important; min-width: 220px !important; margin-bottom: 8px !important; }

/* تنظیمات: برچسب‌های چندخطی فاصله‌ی خط کافی داشته باشند */
.wsc-portal-wrap #wsc-settings-form .wsc-field > label { line-height: 1.8 !important; margin-bottom: 6px !important; display: block !important; }
.wsc-portal-wrap #wsc-settings-form .wsc-switch > span:last-child { line-height: 1.8 !important; }

/* تیک‌ها همیشه یک ردیف جدا از فیلدهای بعدی (قاطی‌شدن با کادرهای متنی بلند سردرگم‌کننده بود) */
.wsc-portal-wrap #wsc-settings-form .wsc-panel-card > .wsc-switch { align-self: center !important; }

.wsc-portal-wrap #wsc-settings-form .wsc-panel-card > .wsc-settings-break { flex: 1 1 100% !important; height: 0 !important; margin: 0 !important; padding: 0 !important; }

/* انتخابگر رنگ جمع‌وجور */
.wsc-portal-wrap .wsc-cp-source { display: none !important; }
.wsc-portal-wrap .wsc-cp { position: relative !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; }
.wsc-portal-wrap .wsc-cp-swatch { width: 30px !important; height: 30px !important; min-width: 0 !important; padding: 0 !important; border-radius: 8px !important; border: 1px solid var(--wsc-border) !important; cursor: pointer !important; background: linear-gradient(var(--wsc-cp-c), var(--wsc-cp-c)), repeating-conic-gradient(#d4d4d8 0 25%, #fff 0 50%) 0 0 / 10px 10px !important; box-shadow: inset 0 0 0 2px var(--wsc-surface) !important; }
.wsc-portal-wrap .wsc-cp-text { width: 150px !important; height: 30px !important; padding: 2px 8px !important; font-family: ui-monospace, Consolas, monospace !important; font-size: 12px !important; border-radius: 8px !important; }
.wsc-portal-wrap .wsc-cp-text.is-invalid { border-color: var(--wsc-danger) !important; }
.wsc-portal-wrap .wsc-cp-pop { position: absolute !important; top: calc(100% + 6px) !important; inset-inline-start: 0 !important; z-index: 60 !important; width: 220px !important; padding: 10px !important; background: var(--wsc-surface) !important; border: 1px solid var(--wsc-border) !important; border-radius: 12px !important; box-shadow: 0 12px 30px rgba(15, 23, 42, .18) !important; display: flex !important; flex-direction: column !important; gap: 8px !important; }
.wsc-portal-wrap .wsc-cp-native { width: 100% !important; height: 90px !important; padding: 0 !important; border: 0 !important; border-radius: 8px !important; cursor: pointer !important; background: none !important; }
.wsc-portal-wrap .wsc-cp-fmt { display: flex !important; gap: 4px !important; direction: ltr !important; }
.wsc-portal-wrap .wsc-cp-fmt button { flex: 1 !important; min-height: 0 !important; height: 26px !important; padding: 0 !important; font-size: 11px !important; font-weight: 700 !important; border-radius: 6px !important; border: 1px solid var(--wsc-border) !important; background: var(--wsc-surface) !important; color: var(--wsc-ink) !important; cursor: pointer !important; }
.wsc-portal-wrap .wsc-cp-fmt button.is-on { background: var(--wsc-primary) !important; border-color: var(--wsc-primary) !important; color: #fff !important; }
.wsc-portal-wrap .wsc-cp-alpha { display: grid !important; grid-template-columns: auto 1fr 36px !important; align-items: center !important; gap: 6px !important; font-size: 11px !important; }
.wsc-portal-wrap .wsc-cp-alpha input[type=range] { width: 100% !important; accent-color: var(--wsc-primary) !important; }
.wsc-portal-wrap .wsc-cp-alpha b { font-size: 11px !important; text-align: left !important; direction: ltr !important; }
.wsc-portal-wrap #wsc-settings-form .wsc-panel-card > .wsc-field-color { flex: 0 1 calc(20% - 13px) !important; min-width: 190px !important; }

/* تنظیمات: کشویی‌ها نصف عرض، دوتا کنار هم */
.wsc-portal-wrap #wsc-settings-form .wsc-panel-card > .wsc-field-half { flex: 0 1 calc(50% - 8px) !important; min-width: 260px !important; }
.wsc-portal-wrap #wsc-settings-form .wsc-field-half .wsc-custom-select { max-width: none !important; width: 100% !important; }

/* در جدول دسترسی‌ها فقط دایره‌ی رنگ (جا تنگ است) */
.wsc-portal-wrap .wsc-perm-matrix-color .wsc-cp-text { display: none !important; }

/* جابجایی سریع بخش‌ها (مثلا فرم پذیرش حضوری) با یک فید کوتاه به‌جای اسلاید */
@keyframes wsc-fade-in { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }
.wsc-portal-wrap .wsc-fade-in { animation: wsc-fade-in .16s ease-out !important; }

/* نوار پایین موبایل در اندازه‌ی استاندارد اپ‌ها: ارتفاع حدود ۶۰px، آیکون ۲۲px، برچسب ۱۱px، ناحیه‌ی لمس حداقل ۴۸px */
@media (max-width: 900px) {
    .wsc-portal-wrap .wsc-portal-bottom-nav { padding: 6px !important; gap: 4px !important; bottom: calc(8px + env(safe-area-inset-bottom, 0px)) !important; }
    .wsc-portal-wrap .wsc-portal-bottom-nav-link { min-height: 52px !important; gap: 4px !important; padding: 6px 2px !important; font-size: 11px !important; }
    .wsc-portal-wrap .wsc-portal-bottom-nav-icon { width: 24px !important; height: 24px !important; }
    .wsc-portal-wrap .wsc-portal-bottom-nav-icon .wsc-icon svg { width: 22px !important; height: 22px !important; }
    .wsc-portal-wrap .wsc-portal-content { padding-bottom: 88px !important; }
}

/* کارت‌های آماری داشبورد در موبایل: سه‌تایی کنار هم (در گوشی خیلی باریک دوتایی) به‌جای تک‌ستونه */
@media (max-width: 900px) {
    .wsc-portal-wrap .wsc-cards-row { display: grid !important; flex-direction: initial !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 8px !important; }
    .wsc-portal-wrap .wsc-cards-row > .wsc-card { min-width: 0 !important; padding: 10px 6px !important; }
    .wsc-portal-wrap .wsc-cards-row .wsc-card-label, .wsc-portal-wrap .wsc-cards-row > .wsc-card p, .wsc-portal-wrap .wsc-cards-row > .wsc-card small { font-size: 10.5px !important; line-height: 1.5 !important; }
}
@media (max-width: 380px) {
    .wsc-portal-wrap .wsc-cards-row { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}

/* موبایل: فاصله‌ی استاندارد ۱۲px از لبه‌های چپ و راست صفحه (قبلا ۴px بود و محتوا به لبه‌ی گوشی می‌چسبید) */
@media (max-width: 900px) {
    .wsc-portal-wrap .wsc-portal-content { padding-left: 12px !important; padding-right: 12px !important; box-sizing: border-box !important; }
    .wsc-portal-wrap .wsc-panel-card { padding: 14px 12px !important; }
}

/* گوشی: ستون‌های یافته‌ها (و شرح حال/خلاصه‌ها) زیر هم، در هر چیدمانی */
@media (max-width: 767px) {
    .wsc-portal-wrap .wsc-dv[class] .wsc-encounter-items-grid.wsc-encounter-items-grid { grid-template-columns: 1fr !important; }
    .wsc-portal-wrap .wsc-dv[class] .wsc-history-grid.wsc-history-grid { grid-template-columns: 1fr !important; }
    .wsc-portal-wrap .wsc-dv[class] .wsc-visit-summary-split { flex-direction: column !important; }
    .wsc-portal-wrap .wsc-dv[class] .wsc-encounter-summary { grid-template-columns: 1fr !important; }
}

/* حالت خالی داخل جدول: سلول باید table-cell بماند تا colspan کل عرض را بگیرد و متن وسط بیاید */
.wsc-portal-wrap td.wsc-empty { display: table-cell !important; text-align: center !important; background: transparent !important; vertical-align: middle !important; }

/* تایمر قفل نوبت: قرص کوچک و ثابت‌اندازه زیر عنوان پاپ‌آپ (بدون پرش) */
.wsc-portal-wrap .wsc-hold-timer { display: inline-flex !important; align-items: center !important; gap: 8px !important; margin: -8px 0 14px !important; padding: 4px 12px !important; min-height: 26px !important; box-sizing: border-box !important; border-radius: 999px !important; font-size: 11.5px !important; }
.wsc-portal-wrap .wsc-hold-timer b { font-variant-numeric: tabular-nums !important; min-width: 34px !important; text-align: center !important; }

/* متن حالت خالی جدول: وسط‌چین با اولویت بالاتر از قوانین عمومی سلول‌های جدول */
.wsc-portal-wrap table tbody tr td.wsc-empty.wsc-empty { text-align: center !important; }

/* مورد انتخاب‌شده در پاپ‌آپ مرور قابل کلیک است (کلیک دوم = حذف) */
.wsc-portal-wrap .wsc-catalog-browser-item.wsc-catalog-browser-item-added { opacity: 1 !important; cursor: pointer !important; }
.wsc-portal-wrap .wsc-catalog-browser-item.wsc-catalog-browser-item-added:hover { background: var(--wsc-danger-bg) !important; border-color: var(--wsc-danger) !important; color: var(--wsc-danger) !important; text-decoration: line-through !important; }

/* انتخاب فایل سفارشی */
.wsc-portal-wrap .wsc-file { position: relative !important; display: inline-flex !important; align-items: center !important; gap: 10px !important; cursor: pointer !important; max-width: 100% !important; vertical-align: middle !important; }
.wsc-portal-wrap .wsc-file input[type="file"] { position: absolute !important; inset: 0 !important; width: 100% !important; height: 100% !important; opacity: 0 !important; cursor: pointer !important; z-index: 1 !important; }
.wsc-portal-wrap .wsc-file-btn { pointer-events: none !important; white-space: nowrap !important; }
.wsc-portal-wrap .wsc-file-name { font-size: 12px !important; color: var(--wsc-muted) !important; max-width: 220px !important; overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; direction: ltr !important; unicode-bidi: plaintext !important; }
.wsc-portal-wrap .wsc-file.has-file .wsc-file-name { color: var(--wsc-ink) !important; font-weight: 600 !important; }
.wsc-portal-wrap .wsc-file:hover .wsc-file-btn { border-color: var(--wsc-primary) !important; color: var(--wsc-primary) !important; }
.wsc-portal-wrap .wsc-file:focus-within .wsc-file-btn { outline: 2px solid var(--wsc-primary) !important; outline-offset: 2px !important; }

/* ناحیه‌ی رها کردن فایل (جایگزین نسخه‌ی ساده‌ی قبلی) */
.wsc-portal-wrap .wsc-file { position: relative !important; display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: center !important; gap: 6px !important; width: 100% !important; max-width: 100% !important; box-sizing: border-box !important; padding: 22px 16px !important; margin: 8px 0 !important; border: 2px dashed var(--wsc-border) !important; border-radius: var(--wsc-radius-md) !important; background: color-mix(in srgb, var(--wsc-primary) 3%, var(--wsc-surface)) !important; text-align: center !important; cursor: pointer !important; transition: border-color .15s ease, background .15s ease !important; }
.wsc-portal-wrap .wsc-file:hover, .wsc-portal-wrap .wsc-file.is-over { border-color: var(--wsc-primary) !important; background: color-mix(in srgb, var(--wsc-primary) 8%, var(--wsc-surface)) !important; }
.wsc-portal-wrap .wsc-file.has-file { border-style: solid !important; border-color: var(--wsc-success) !important; }
.wsc-portal-wrap .wsc-file-icon { display: flex !important; align-items: center !important; justify-content: center !important; width: 44px !important; height: 44px !important; border-radius: 12px !important; background: color-mix(in srgb, var(--wsc-primary) 12%, transparent) !important; color: var(--wsc-primary) !important; }
.wsc-portal-wrap .wsc-file-icon svg { width: 22px !important; height: 22px !important; }
.wsc-portal-wrap .wsc-file-title { font-size: 14px !important; font-weight: 800 !important; color: var(--wsc-ink) !important; }
.wsc-portal-wrap .wsc-file-sub { font-size: 11.5px !important; color: var(--wsc-muted) !important; }
.wsc-portal-wrap .wsc-file-btn { margin-top: 6px !important; pointer-events: none !important; border-radius: 999px !important; }
.wsc-portal-wrap .wsc-file-name { font-size: 12px !important; font-weight: 700 !important; color: var(--wsc-success) !important; max-width: 100% !important; overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; unicode-bidi: plaintext !important; }
.wsc-portal-wrap .wsc-file-name:empty { display: none !important; }

/* نسخه‌ی عینک در فرم اپتومتری */
.wsc-portal-wrap .wsc-opto-rx .wsc-panel-card-head { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 10px !important; }
.wsc-portal-wrap .wsc-rx-body { display: grid !important; grid-template-columns: minmax(0, 1fr) 220px !important; gap: 18px !important; direction: ltr !important; }
.wsc-portal-wrap .wsc-rx-block h4 { margin: 8px 0 6px !important; font-size: 13px !important; text-align: left !important; }
.wsc-portal-wrap .wsc-rx-table { width: 100% !important; border-collapse: collapse !important; }
.wsc-portal-wrap .wsc-rx-table th, .wsc-portal-wrap .wsc-rx-table td { border: 1px solid var(--wsc-border) !important; padding: 4px !important; text-align: center !important; font-size: 12px !important; }
.wsc-portal-wrap .wsc-rx-table th { background: var(--wsc-bg) !important; }
.wsc-portal-wrap .wsc-rx-table input.wsc-rx-input { width: 100% !important; height: 30px !important; text-align: center !important; }
.wsc-portal-wrap .wsc-rx-input[data-manual="1"] { background: color-mix(in srgb, var(--wsc-warning) 10%, var(--wsc-surface)) !important; }
.wsc-portal-wrap .wsc-rx-side .wsc-field label { text-align: left !important; }
.wsc-portal-wrap .wsc-rx-types { display: flex !important; flex-direction: column !important; gap: 6px !important; margin-top: 8px !important; }
@media (max-width: 900px) { .wsc-portal-wrap .wsc-rx-body { grid-template-columns: 1fr !important; } }

.wsc-portal-wrap .wsc-backup-actions { display: flex !important; flex-wrap: wrap !important; gap: 10px !important; align-items: center !important; }

/* عینک‌سازی */
.wsc-portal-wrap .wsc-optical-send { display: flex !important; align-items: center !important; gap: 10px !important; flex-wrap: wrap !important; margin: 4px 0 8px !important; direction: rtl !important; }
.wsc-portal-wrap .wsc-optical-pill { font-size: 11px !important; font-weight: 700 !important; padding: 3px 10px !important; border-radius: 999px !important; }
.wsc-portal-wrap .wsc-optical-new { background: var(--wsc-warning-bg) !important; color: var(--wsc-warning) !important; }
.wsc-portal-wrap .wsc-optical-ready { background: color-mix(in srgb, var(--wsc-primary) 12%, transparent) !important; color: var(--wsc-primary) !important; }
.wsc-portal-wrap .wsc-optical-delivered { background: var(--wsc-success-bg) !important; color: var(--wsc-success) !important; }
.wsc-portal-wrap .wsc-optical-list { display: grid !important; grid-template-columns: repeat(auto-fill, minmax(360px, 1fr)) !important; gap: 12px !important; }
.wsc-portal-wrap .wsc-optical-card { border: 1px solid var(--wsc-border) !important; border-radius: var(--wsc-radius-md) !important; padding: 12px !important; background: var(--wsc-surface) !important; display: flex !important; flex-direction: column !important; gap: 10px !important; }
.wsc-portal-wrap .wsc-optical-head { display: flex !important; justify-content: space-between !important; align-items: flex-start !important; gap: 8px !important; }
.wsc-portal-wrap .wsc-optical-head strong { display: block !important; font-size: 13.5px !important; }
.wsc-portal-wrap .wsc-optical-rx { display: flex !important; flex-direction: column !important; gap: 6px !important; }
.wsc-portal-wrap .wsc-optical-rx .wsc-rx-table td { height: 26px !important; font-family: ui-monospace, Consolas, monospace !important; }
.wsc-portal-wrap .wsc-optical-meta { font-size: 12px !important; }
.wsc-portal-wrap .wsc-optical-actions { display: flex !important; gap: 8px !important; flex-wrap: wrap !important; align-items: center !important; }
.wsc-portal-wrap .wsc-optical-history { list-style: none !important; margin: 0 !important; padding: 0 !important; display: flex !important; flex-direction: column !important; gap: 6px !important; }
@media (max-width: 767px) { .wsc-portal-wrap .wsc-optical-list { grid-template-columns: 1fr !important; } }

/* حالت شب: toast خنثی قبلا با var(--wsc-ink) (که در شب روشن است) زمینه‌ی روشن + متن سفید می‌گرفت */
.wsc-portal-wrap .wsc-toast-info { background: #1f2937 !important; }
body.wsc-dark-mode .wsc-portal-wrap .wsc-toast-info { background: #374151 !important; }

/* برچسب‌های هشدار پزشکی */
.wsc-portal-wrap .wsc-alert-pills { display: inline-flex !important; flex-wrap: wrap !important; gap: 4px !important; vertical-align: middle !important; margin-inline-start: 6px !important; }
.wsc-portal-wrap .wsc-alert-pill { display: inline-flex !important; align-items: center !important; gap: 4px !important; padding: 2px 9px !important; border-radius: 999px !important; font-size: 11px !important; font-weight: 800 !important; background: var(--wsc-danger-bg) !important; color: var(--wsc-danger) !important; border: 1px solid color-mix(in srgb, var(--wsc-danger) 35%, transparent) !important; }
.wsc-portal-wrap .wsc-alert-pill .wsc-icon svg { width: 12px !important; height: 12px !important; }
/* تیک «عینک نیاز به تغییر ندارد» */
.wsc-portal-wrap .wsc-no-change { display: flex !important; margin: 0 0 10px !important; padding: 8px 12px !important; border-radius: var(--wsc-radius-sm) !important; background: color-mix(in srgb, var(--wsc-primary) 6%, var(--wsc-surface)) !important; border: 1px dashed var(--wsc-border) !important; font-weight: 600 !important; }

/* Binocular / بخش‌های انگلیسی اپتومتری: مقدار کشویی‌ها و فیلدها وسط‌چین */
.wsc-portal-wrap .wsc-opto-bv .wsc-custom-select-trigger { justify-content: center !important; position: relative !important; }
.wsc-portal-wrap .wsc-opto-bv .wsc-custom-select-value { flex: 1 1 auto !important; text-align: center !important; }
.wsc-portal-wrap .wsc-opto-bv .wsc-custom-select-chevron { position: absolute !important; right: 8px !important; }
.wsc-portal-wrap .wsc-opto-bv input.wsc-exam-input { text-align: center !important; }

/* پاپ‌آپ مرور کاتالوگ — نمای ستونی: سرتیتر دسته‌ها کنار هم، لیست هر دسته زیر خودش */
.wsc-portal-wrap .wsc-catalog-browser.wsc-catalog-browser-colview { max-width: min(1280px, 96vw) !important; width: 96vw !important; }
.wsc-portal-wrap .wsc-catalog-browser-colview .wsc-catalog-browser-tabs { display: none !important; }
.wsc-portal-wrap .wsc-catalog-browser-colview .wsc-catalog-browser-groups { display: grid !important; grid-auto-flow: column !important; grid-auto-columns: minmax(190px, 1fr) !important; gap: 12px !important; overflow-x: auto !important; align-items: start !important; max-height: 70vh !important; }
.wsc-portal-wrap .wsc-catalog-browser-colview .wsc-catalog-browser-group { display: flex !important; flex-direction: column !important; border: 1px solid var(--wsc-border) !important; border-radius: var(--wsc-radius-md) !important; overflow: hidden !important; max-height: 68vh !important; margin: 0 !important; }
.wsc-portal-wrap .wsc-catalog-browser-colview .wsc-catalog-browser-group h4 { margin: 0 !important; padding: 9px 10px !important; background: var(--wsc-primary) !important; color: #fff !important; font-size: 12.5px !important; text-align: center !important; position: sticky !important; top: 0 !important; }
.wsc-portal-wrap .wsc-catalog-browser-colview .wsc-catalog-browser-items { display: flex !important; flex-direction: column !important; gap: 6px !important; padding: 8px !important; overflow-y: auto !important; }
.wsc-portal-wrap .wsc-catalog-browser-colview .wsc-catalog-browser-item { width: 100% !important; text-align: center !important; }
/* ستاره‌ی بوکمارک در صفحه‌ی کاتالوگ */
.wsc-portal-wrap .wsc-catalog-star { background: none !important; border: 0 !important; font-size: 18px !important; color: var(--wsc-border) !important; cursor: pointer !important; padding: 0 4px !important; line-height: 1 !important; }
.wsc-portal-wrap .wsc-catalog-star.active { color: #f59e0b !important; }
.wsc-portal-wrap .wsc-catalog-star:hover { transform: scale(1.15) !important; }

/* نمای ستونی: آیتم‌ها یک‌ستونه و ریزتر (بدون اسکرول افقی) + جستجوی هر دسته */
.wsc-portal-wrap .wsc-catalog-browser .wsc-catalog-group-search { display: none !important; }
.wsc-portal-wrap .wsc-catalog-browser-colview .wsc-catalog-group-search { display: block !important; margin: 8px 8px 0 !important; width: calc(100% - 16px) !important; box-sizing: border-box !important; height: 30px !important; padding: 4px 10px !important; font-size: 12px !important; border-radius: 8px !important; border: 1px solid var(--wsc-form-border) !important; background: var(--wsc-surface) !important; }
.wsc-portal-wrap .wsc-catalog-browser-colview .wsc-catalog-browser-items { flex-wrap: nowrap !important; overflow-x: hidden !important; gap: 4px !important; padding: 8px !important; }
.wsc-portal-wrap .wsc-catalog-browser-colview .wsc-catalog-browser-item { width: 100% !important; min-height: 0 !important; height: auto !important; padding: 5px 8px !important; font-size: 11.5px !important; line-height: 1.4 !important; white-space: normal !important; word-break: break-word !important; border-radius: 8px !important; text-align: center !important; flex: 0 0 auto !important; }

/* پاپ‌آپ مرور Paraclinic/Surgery/Medication (بدون گروه): جستجو + آیتم‌های ریز در چند ستون */
.wsc-portal-wrap .wsc-catalog-browser.wsc-catalog-browser-flatview { max-width: min(1100px, 96vw) !important; width: 96vw !important; }
.wsc-portal-wrap .wsc-catalog-browser-flatview .wsc-catalog-group-search { display: block !important; width: 100% !important; box-sizing: border-box !important; height: 34px !important; padding: 4px 12px !important; font-size: 12.5px !important; border-radius: 10px !important; border: 1px solid var(--wsc-form-border) !important; background: var(--wsc-surface) !important; margin-bottom: 10px !important; }
.wsc-portal-wrap .wsc-catalog-browser-flatview .wsc-catalog-browser-items { display: grid !important; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)) !important; gap: 5px !important; max-height: 62vh !important; overflow-y: auto !important; overflow-x: hidden !important; align-content: start !important; }
.wsc-portal-wrap .wsc-catalog-browser-flatview .wsc-catalog-browser-item { width: 100% !important; min-height: 0 !important; height: auto !important; padding: 5px 8px !important; font-size: 11.5px !important; line-height: 1.4 !important; white-space: normal !important; word-break: break-word !important; border-radius: 8px !important; text-align: center !important; }

/* اندازه‌ی فونت دلخواه داخل چهار باکس یافته‌ها (تنظیمات ← صفحه‌ی پزشک) */
.wsc-portal-wrap .wsc-enc-custom-fs .wsc-catalog-result-name, .wsc-portal-wrap .wsc-enc-custom-fs .wsc-selected-items .wsc-chip, .wsc-portal-wrap .wsc-enc-custom-fs .wsc-catalog-search-input, .wsc-portal-wrap .wsc-enc-custom-fs input[type="text"], .wsc-portal-wrap .wsc-enc-custom-fs .wsc-search-empty { font-size: var(--wsc-enc-fs) !important; }
.wsc-portal-wrap .wsc-enc-custom-fs .wsc-add-item-btn { font-size: calc(var(--wsc-enc-fs) - 1px) !important; }

/* تاریخ‌های مراجعه در فرم اپتومتری */
.wsc-portal-wrap .wsc-opto-visit-dates .wsc-panel-card-head { display: flex !important; align-items: center !important; justify-content: space-between !important; }
.wsc-portal-wrap .wsc-opto-visit { border: 1px solid var(--wsc-border-soft) !important; border-radius: var(--wsc-radius-sm) !important; margin-bottom: 6px !important; background: var(--wsc-surface) !important; }
.wsc-portal-wrap .wsc-opto-visit > summary { cursor: pointer !important; padding: 8px 12px !important; display: flex !important; align-items: center !important; gap: 10px !important; list-style: none !important; }
.wsc-portal-wrap .wsc-opto-visit > summary::-webkit-details-marker { display: none !important; }
.wsc-portal-wrap .wsc-opto-visit > summary::before { content: "▸" !important; color: var(--wsc-muted) !important; transition: transform .15s ease !important; }
.wsc-portal-wrap .wsc-opto-visit[open] > summary::before { transform: rotate(90deg) !important; }
.wsc-portal-wrap .wsc-opto-visit[open] > summary { border-bottom: 1px solid var(--wsc-border-soft) !important; }
.wsc-portal-wrap .wsc-opto-visit > .wsc-visit-summary-narrative { margin: 8px !important; }

/* اپتومتری: ستون تاریخ‌های مراجعه سمت راست جدول */
.wsc-portal-wrap .wsc-opto-main-row.has-dates { display: grid !important; grid-template-columns: 240px minmax(0, 1fr) !important; gap: 14px !important; align-items: start !important; margin-bottom: 14px !important; }
.wsc-portal-wrap .wsc-opto-main-row > .wsc-opto-visit-dates { margin: 0 !important; max-height: 640px !important; overflow-y: auto !important; position: sticky !important; top: 10px !important; }
.wsc-portal-wrap .wsc-opto-main-col { min-width: 0 !important; }
.wsc-portal-wrap .wsc-opto-main-col > .wsc-panel-card:last-child { margin-bottom: 0 !important; }
.wsc-portal-wrap .wsc-opto-visit-dates .wsc-opto-visit > summary { flex-wrap: wrap !important; gap: 4px 8px !important; padding: 7px 10px !important; }
.wsc-portal-wrap .wsc-opto-visit-dates .wsc-visit-summary-narrative { padding: 8px !important; }
.wsc-portal-wrap .wsc-opto-visit-dates .wsc-optometry-printout-row { font-size: 12px !important; gap: 6px !important; }
@media (max-width: 1099px) { .wsc-portal-wrap .wsc-opto-main-row.has-dates { grid-template-columns: 1fr !important; } .wsc-portal-wrap .wsc-opto-main-row > .wsc-opto-visit-dates { position: static !important; max-height: none !important; } }

/* فاصله‌ی جدول اپتومتری از کارت‌های پایین (چه ستون تاریخ‌ها روشن باشد چه خاموش) */
.wsc-portal-wrap .wsc-opto-main-row { margin-bottom: 16px !important; }

/* رنگ ستون‌های چشم راست/چپ بر اساس خود چشم (کلاس)، نه شماره‌ی ستون — با خاموش‌کردن ستون‌ها رنگ‌ها قاطی نمی‌شوند */
.wsc-portal-wrap table.wsc-exam-grid td.wsc-eye-od { background: color-mix(in srgb, var(--wsc-primary) 5%, var(--wsc-surface)) !important; }
.wsc-portal-wrap table.wsc-exam-grid td.wsc-eye-os { background: color-mix(in srgb, var(--wsc-success) 6%, var(--wsc-surface)) !important; }
.wsc-portal-wrap table.wsc-exam-grid thead th.wsc-eye-od { background: color-mix(in srgb, var(--wsc-primary) 10%, var(--wsc-bg)) !important; }
.wsc-portal-wrap table.wsc-exam-grid thead th.wsc-eye-os { background: color-mix(in srgb, var(--wsc-success) 12%, var(--wsc-bg)) !important; }

/* اولویت بالاتر از قوانین قدیمی nth-child (که با خاموش‌کردن ستون‌ها رنگ اشتباه می‌دادند) */
.wsc-portal-wrap table.wsc-exam-grid.wsc-exam-grid tbody tr td.wsc-eye-od.wsc-eye-od { background: color-mix(in srgb, var(--wsc-primary) 5%, var(--wsc-surface)) !important; }
.wsc-portal-wrap table.wsc-exam-grid.wsc-exam-grid tbody tr td.wsc-eye-os.wsc-eye-os { background: color-mix(in srgb, var(--wsc-success) 6%, var(--wsc-surface)) !important; }
.wsc-portal-wrap table.wsc-exam-grid.wsc-exam-grid thead tr th.wsc-eye-od.wsc-eye-od { background: color-mix(in srgb, var(--wsc-primary) 10%, var(--wsc-bg)) !important; }
.wsc-portal-wrap table.wsc-exam-grid.wsc-exam-grid thead tr th.wsc-eye-os.wsc-eye-os { background: color-mix(in srgb, var(--wsc-success) 12%, var(--wsc-bg)) !important; }

/* تاریخ‌های مراجعه به صورت لینک (نمای کامل) + نمای فقط‌خواندنی */
.wsc-portal-wrap a.wsc-opto-visit-link { display: flex !important; flex-wrap: wrap !important; align-items: center !important; gap: 4px 8px !important; padding: 8px 10px !important; text-decoration: none !important; color: var(--wsc-ink) !important; }
.wsc-portal-wrap a.wsc-opto-visit-link:hover { background: var(--wsc-hover-bg) !important; }
.wsc-portal-wrap a.wsc-opto-visit-link.is-active { border-color: var(--wsc-primary) !important; background: color-mix(in srgb, var(--wsc-primary) 10%, var(--wsc-surface)) !important; box-shadow: inset 3px 0 0 var(--wsc-primary) !important; }
.wsc-portal-wrap form.wsc-form-readonly .wsc-custom-select-trigger { pointer-events: none !important; opacity: .85 !important; }

/* تاریخ‌های مراجعه‌ی اپتومتری با همان مدل‌های صفحه‌ی پزشک */
.wsc-portal-wrap .wsc-opto-date-list { max-height: none !important; padding: 0 !important; }
.wsc-portal-wrap .wsc-opto-date-list .wsc-optical-pill { display: inline-block !important; margin: 3px 0 0 !important; }
.wsc-portal-wrap .wsc-opto-date-summary .wsc-visit-summary-narrative { margin: 6px 0 !important; padding: 8px !important; }
.wsc-portal-wrap .wsc-date-style-4.wsc-opto-date-list .wsc-opto-date-summary { grid-column: 1 / -1 !important; }

/* کارت‌های Contact Lens / KR / PD / IOP هم‌ارتفاع */
.wsc-portal-wrap .wsc-opto-extra { align-items: stretch !important; }
.wsc-portal-wrap .wsc-opto-extra > .wsc-panel-card { height: 100% !important; box-sizing: border-box !important; }
/* ستون تاریخ‌های مراجعه هیچ‌وقت بلندتر از جدول اپتومتری نمی‌شود؛ اضافه‌اش داخل خودش اسکرول می‌خورد */
@media (min-width: 1100px) {
    .wsc-portal-wrap .wsc-opto-main-row.has-dates { align-items: stretch !important; }
    .wsc-portal-wrap .wsc-opto-main-row > .wsc-opto-visit-dates { position: relative !important; top: auto !important; height: 0 !important; min-height: 100% !important; max-height: none !important; overflow-y: auto !important; box-sizing: border-box !important; }
}

/* سلسله‌مراتب تشخیص ← پاراکلینیک/جراحی/دارو */
.wsc-portal-wrap .wsc-dx-filter-bar { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 6px !important; padding: 5px 8px !important; margin-bottom: 4px !important; font-size: 11.5px !important; color: var(--wsc-muted) !important; background: color-mix(in srgb, var(--wsc-primary) 8%, var(--wsc-surface)) !important; border-radius: 8px !important; position: sticky !important; top: 0 !important; z-index: 1 !important; }
.wsc-portal-wrap .wsc-dx-filter-bar .button-link { font-size: 11.5px !important; color: var(--wsc-primary) !important; cursor: pointer !important; background: none !important; border: 0 !important; padding: 0 !important; }
.wsc-portal-wrap .wsc-dx-links { display: flex !important; flex-wrap: wrap !important; gap: 6px 14px !important; }
.wsc-portal-wrap .wsc-dx-link-opt { display: inline-flex !important; align-items: center !important; gap: 5px !important; font-weight: normal !important; }
.wsc-portal-wrap .wsc-dx-pill { margin: 1px 0 !important; }

/* ساده‌سازی صفحه‌ی پزشک: پیشنهاد هوشمند، چشم چیپ، کپی ویزیت قبلی، شرح حال تاشده */
.wsc-portal-wrap .wsc-catalog-suggested .wsc-catalog-result-name::before { content: "\2605" !important; color: var(--wsc-primary) !important; margin-inline-end: 4px !important; font-size: 10px !important; }
.wsc-portal-wrap .wsc-encounter-col .wsc-chip-eye { cursor: pointer !important; padding: 0 3px !important; border-radius: 4px !important; }
.wsc-portal-wrap .wsc-encounter-col .wsc-chip-eye:hover { background: color-mix(in srgb, var(--wsc-primary) 18%, transparent) !important; }
.wsc-portal-wrap .wsc-dv-encounter > .wsc-panel-card-head { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 8px !important; flex-wrap: wrap !important; }
.wsc-portal-wrap .wsc-copy-prev-enc-btn.wsc-copied { opacity: .6 !important; }
.wsc-portal-wrap .wsc-history-collapsible > summary { display: flex !important; align-items: center !important; gap: 10px !important; cursor: pointer !important; list-style: none !important; flex-wrap: wrap !important; }
.wsc-portal-wrap .wsc-history-collapsible > summary::-webkit-details-marker { display: none !important; }
.wsc-portal-wrap .wsc-history-oneline { display: flex !important; flex-wrap: wrap !important; gap: 4px 14px !important; flex: 1 1 auto !important; font-size: 12.5px !important; color: var(--wsc-ink) !important; }
.wsc-portal-wrap .wsc-history-oneline-item b { color: var(--wsc-primary) !important; }
.wsc-portal-wrap .wsc-history-toggle-hint { font-size: 11.5px !important; color: var(--wsc-primary) !important; white-space: nowrap !important; }
.wsc-portal-wrap .wsc-history-collapsible[open] .wsc-history-oneline { display: none !important; }
.wsc-portal-wrap .wsc-history-collapsible[open] > summary { margin-bottom: 10px !important; }


/* ثبت مرحله‌ای (پاپ‌آپ) */
.wsc-portal-wrap .wsc-dv-encounter > .wsc-panel-card-head .wsc-wiz-open-btn { margin-inline-start: auto !important; }
.wsc-portal-wrap .wsc-wiz-overlay { background: rgba(15, 23, 42, .55) !important; }
.wsc-portal-wrap .wsc-modal.wsc-enc-wizard { width: min(1180px, 96vw) !important; max-width: none !important; height: min(860px, 94vh) !important; max-height: 94vh !important; display: flex !important; flex-direction: column !important; padding: 0 !important; gap: 0 !important; border-radius: 16px !important; overflow: hidden !important; box-shadow: 0 30px 80px rgba(0,0,0,.35) !important; }
.wsc-portal-wrap .wsc-wiz-head { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 12px !important; padding: 16px 22px 10px !important; }
.wsc-portal-wrap .wsc-wiz-head .wsc-modal-close { position: static !important; }
.wsc-portal-wrap .wsc-wiz-title strong { display: block !important; font-size: 18px !important; color: var(--wsc-ink) !important; }
.wsc-portal-wrap .wsc-wiz-title small { display: block !important; margin-top: 3px !important; font-size: 12.5px !important; color: var(--wsc-muted) !important; }
.wsc-portal-wrap .wsc-wiz-steps { list-style: none !important; margin: 0 !important; padding: 6px 22px 14px !important; display: flex !important; gap: 0 !important; border-bottom: 1px solid var(--wsc-border) !important; }
.wsc-portal-wrap .wsc-wiz-step { flex: 1 1 0 !important; margin: 0 !important; display: flex !important; align-items: center !important; gap: 8px !important; cursor: pointer !important; position: relative !important; color: var(--wsc-muted) !important; font-size: 13px !important; }
.wsc-portal-wrap .wsc-wiz-step:not(:last-child)::after { content: "" !important; flex: 1 1 auto !important; height: 2px !important; background: var(--wsc-border) !important; margin: 0 8px !important; border-radius: 2px !important; }
.wsc-portal-wrap .wsc-wiz-step.is-done:not(:last-child)::after { background: var(--wsc-primary) !important; }
.wsc-portal-wrap .wsc-wiz-dot { flex: 0 0 30px !important; width: 30px !important; height: 30px !important; border-radius: 50% !important; display: inline-grid !important; place-items: center !important; border: 2px solid var(--wsc-border) !important; background: var(--wsc-surface) !important; font-weight: 700 !important; font-size: 13px !important; transition: all .15s !important; }
.wsc-portal-wrap .wsc-wiz-step b { white-space: nowrap !important; font-weight: 600 !important; }
.wsc-portal-wrap .wsc-wiz-step.is-done .wsc-wiz-dot { background: color-mix(in srgb, var(--wsc-primary) 15%, var(--wsc-surface)) !important; border-color: var(--wsc-primary) !important; color: var(--wsc-primary) !important; }
.wsc-portal-wrap .wsc-wiz-step.is-active { color: var(--wsc-ink) !important; }
.wsc-portal-wrap .wsc-wiz-step.is-active .wsc-wiz-dot { background: var(--wsc-primary) !important; border-color: var(--wsc-primary) !important; color: #fff !important; box-shadow: 0 0 0 4px color-mix(in srgb, var(--wsc-primary) 20%, transparent) !important; }
.wsc-portal-wrap .wsc-wiz-count:not(:empty) { font-style: normal !important; background: #16a34a !important; color: #fff !important; border-radius: 999px !important; padding: 1px 8px !important; font-size: 11px !important; font-weight: 700 !important; }
.wsc-portal-wrap .wsc-wiz-tools { display: flex !important; align-items: center !important; gap: 12px !important; padding: 12px 22px !important; background: var(--wsc-hover-bg) !important; border-bottom: 1px solid var(--wsc-border) !important; }
.wsc-portal-wrap .wsc-wiz-search-wrap { flex: 1 1 auto !important; position: relative !important; }
.wsc-portal-wrap .wsc-wiz-search { width: 100% !important; font-size: 15px !important; padding: 11px 16px !important; border-radius: 10px !important; border: 1px solid var(--wsc-border) !important; background: var(--wsc-surface) !important; min-height: 44px !important; }
.wsc-portal-wrap .wsc-wiz-search:focus { border-color: var(--wsc-primary) !important; box-shadow: 0 0 0 3px color-mix(in srgb, var(--wsc-primary) 18%, transparent) !important; outline: none !important; }
.wsc-portal-wrap .wsc-wiz-showall { display: inline-flex !important; align-items: center !important; gap: 6px !important; font-size: 13px !important; white-space: nowrap !important; cursor: pointer !important; }
.wsc-portal-wrap .wsc-wiz-body { overflow: auto !important; flex: 1 1 auto !important; min-height: 0 !important; padding: 16px 22px !important; }
.wsc-portal-wrap .wsc-wiz-groups { display: grid !important; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)) !important; gap: 14px !important; align-items: start !important; }
.wsc-portal-wrap .wsc-wiz-group { --g: var(--wsc-primary); border: 1px solid var(--wsc-border) !important; border-top: 4px solid var(--g) !important; border-radius: 12px !important; overflow: hidden !important; background: var(--wsc-surface) !important; }
.wsc-portal-wrap .wsc-wiz-g1 { --g: #0891b2; } .wsc-portal-wrap .wsc-wiz-g2 { --g: #7c3aed; } .wsc-portal-wrap .wsc-wiz-g3 { --g: #db2777; } .wsc-portal-wrap .wsc-wiz-g4 { --g: #ea580c; } .wsc-portal-wrap .wsc-wiz-g5 { --g: #16a34a; }
.wsc-portal-wrap .wsc-wiz-group h5 { margin: 0 !important; padding: 10px 14px !important; display: flex !important; justify-content: space-between !important; align-items: center !important; font-size: 14px !important; color: var(--g) !important; background: color-mix(in srgb, var(--g) 7%, var(--wsc-surface)) !important; }
.wsc-portal-wrap .wsc-wiz-group h5 em, .wsc-portal-wrap .wsc-wiz-sect h6 em { font-style: normal !important; font-size: 11px !important; color: var(--wsc-muted) !important; background: var(--wsc-hover-bg) !important; border-radius: 999px !important; padding: 1px 8px !important; }
.wsc-portal-wrap .wsc-wiz-group .wsc-wiz-list { max-height: 360px !important; overflow-y: auto !important; }
.wsc-portal-wrap .wsc-wiz-list { display: flex !important; flex-direction: column !important; }
.wsc-portal-wrap .wsc-wiz-sect + .wsc-wiz-sect { margin-top: 18px !important; }
.wsc-portal-wrap .wsc-wiz-sect h6 { margin: 0 0 8px !important; font-size: 13px !important; color: var(--wsc-muted) !important; display: flex !important; gap: 8px !important; align-items: center !important; }
.wsc-portal-wrap .wsc-wiz-grid { display: grid !important; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)) !important; gap: 8px !important; }
.wsc-portal-wrap .wsc-wiz-row { display: flex !important; align-items: center !important; gap: 10px !important; padding: 9px 12px !important; min-height: 46px !important; border-bottom: 1px solid var(--wsc-border) !important; cursor: pointer !important; direction: ltr !important; background: var(--wsc-surface) !important; transition: background .12s, box-shadow .12s !important; }
.wsc-portal-wrap .wsc-wiz-list > .wsc-wiz-row:last-child { border-bottom: 0 !important; }
.wsc-portal-wrap .wsc-wiz-grid .wsc-wiz-row { border: 1px solid var(--wsc-border) !important; border-radius: 10px !important; }
.wsc-portal-wrap .wsc-wiz-row:hover, .wsc-portal-wrap .wsc-wiz-row.is-cursor { background: var(--wsc-hover-bg) !important; }
.wsc-portal-wrap .wsc-wiz-row.is-cursor { box-shadow: inset 0 0 0 2px color-mix(in srgb, var(--wsc-primary) 45%, transparent) !important; }
.wsc-portal-wrap .wsc-wiz-row.is-added { background: color-mix(in srgb, #16a34a 9%, var(--wsc-surface)) !important; }
.wsc-portal-wrap .wsc-wiz-grid .wsc-wiz-row.is-added { border-color: color-mix(in srgb, #16a34a 45%, var(--wsc-border)) !important; }
.wsc-portal-wrap .wsc-wiz-check { flex: 0 0 20px !important; width: 20px !important; height: 20px !important; border-radius: 6px !important; border: 2px solid var(--wsc-border) !important; display: inline-grid !important; place-items: center !important; font-size: 12px !important; color: #fff !important; }
.wsc-portal-wrap .wsc-wiz-row.is-added .wsc-wiz-check { background: #16a34a !important; border-color: #16a34a !important; }
.wsc-portal-wrap .wsc-wiz-row.is-added .wsc-wiz-check::before { content: "\2713" !important; font-weight: 700 !important; }
.wsc-portal-wrap .wsc-wiz-name { flex: 1 1 auto !important; font-size: 14px !important; line-height: 1.45 !important; text-transform: none !important; letter-spacing: 0 !important; text-align: left !important; color: var(--wsc-ink) !important; }
.wsc-portal-wrap .wsc-wiz-row.is-added .wsc-wiz-name { font-weight: 600 !important; }
.wsc-portal-wrap .wsc-wiz-star { font-style: normal !important; color: #f59e0b !important; margin-left: 6px !important; font-size: 12px !important; }
.wsc-portal-wrap .wsc-wiz-seg { flex: 0 0 auto !important; display: inline-flex !important; border: 1px solid var(--wsc-border) !important; border-radius: 8px !important; overflow: hidden !important; }
.wsc-portal-wrap .wsc-wiz-eye { min-width: 40px !important; height: 30px !important; border: 0 !important; border-left: 1px solid var(--wsc-border) !important; border-radius: 0 !important; background: var(--wsc-surface) !important; color: var(--wsc-muted) !important; font-size: 12px !important; font-weight: 700 !important; cursor: pointer !important; padding: 0 8px !important; margin: 0 !important; }
.wsc-portal-wrap .wsc-wiz-eye:first-child { border-left: 0 !important; }
.wsc-portal-wrap .wsc-wiz-eye:hover { background: var(--wsc-hover-bg) !important; color: var(--wsc-ink) !important; }
.wsc-portal-wrap .wsc-wiz-eye.is-default { color: var(--wsc-primary) !important; text-decoration: underline !important; text-underline-offset: 3px !important; }
.wsc-portal-wrap .wsc-wiz-eye-od { --e: #dc2626; } .wsc-portal-wrap .wsc-wiz-eye-os { --e: #2563eb; } .wsc-portal-wrap .wsc-wiz-eye-both { --e: #7c3aed; }
.wsc-portal-wrap .wsc-wiz-eye.is-on { background: var(--e) !important; color: #fff !important; text-decoration: none !important; }
.wsc-portal-wrap .wsc-wiz-add { flex: 0 0 auto !important; height: 30px !important; padding: 0 12px !important; border-radius: 8px !important; border: 1px solid var(--wsc-primary) !important; background: var(--wsc-surface) !important; color: var(--wsc-primary) !important; font-size: 12px !important; font-weight: 700 !important; cursor: pointer !important; }
.wsc-portal-wrap .wsc-wiz-add.is-on { background: #16a34a !important; border-color: #16a34a !important; color: #fff !important; }
.wsc-portal-wrap .wsc-wiz-pill { display: inline-block !important; background: var(--e, var(--wsc-primary)) !important; color: #fff !important; border-radius: 5px !important; padding: 0 6px !important; font-size: 10.5px !important; line-height: 18px !important; }
.wsc-portal-wrap .wsc-wiz-empty { text-align: center !important; padding: 50px 10px !important; color: var(--wsc-muted) !important; display: flex !important; flex-direction: column !important; align-items: center !important; gap: 12px !important; }
.wsc-portal-wrap .wsc-wiz-tray { display: flex !important; align-items: center !important; flex-wrap: wrap !important; gap: 6px !important; padding: 10px 22px !important; border-top: 1px solid var(--wsc-border) !important; background: var(--wsc-hover-bg) !important; max-height: 96px !important; overflow-y: auto !important; font-size: 13px !important; }
.wsc-portal-wrap .wsc-wiz-tray-label { font-weight: 700 !important; color: var(--wsc-muted) !important; }
.wsc-portal-wrap .wsc-wiz-tag { display: inline-flex !important; align-items: center !important; gap: 6px !important; background: var(--wsc-surface) !important; border: 1px solid var(--wsc-border) !important; border-radius: 999px !important; padding: 3px 4px 3px 10px !important; font-size: 12.5px !important; }
.wsc-portal-wrap .wsc-wiz-tag-x { border: 0 !important; background: transparent !important; color: var(--wsc-muted) !important; cursor: pointer !important; font-size: 15px !important; line-height: 1 !important; padding: 0 4px !important; }
.wsc-portal-wrap .wsc-wiz-tag-x:hover { color: #dc2626 !important; }
.wsc-portal-wrap .wsc-wiz-foot { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 12px !important; padding: 12px 22px !important; border-top: 1px solid var(--wsc-border) !important; }
.wsc-portal-wrap .wsc-wiz-keys { font-size: 11.5px !important; color: var(--wsc-muted) !important; }
.wsc-portal-wrap .wsc-wiz-keys kbd { font-family: inherit !important; font-size: 10.5px !important; background: var(--wsc-hover-bg) !important; border: 1px solid var(--wsc-border) !important; border-bottom-width: 2px !important; border-radius: 4px !important; padding: 0 5px !important; margin: 0 2px 0 6px !important; direction: ltr !important; display: inline-block !important; }
.wsc-portal-wrap .wsc-wiz-nav { display: flex !important; gap: 8px !important; }
.wsc-portal-wrap .wsc-wiz-nav .button { min-width: 120px !important; min-height: 40px !important; font-size: 14px !important; border-radius: 10px !important; }
.wsc-portal-wrap .wsc-wiz-nav .button.wsc-wiz-skip { background: var(--wsc-surface) !important; color: var(--wsc-primary) !important; }
.wsc-portal-wrap .wsc-wiz-review { display: grid !important; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)) !important; gap: 14px !important; }
.wsc-portal-wrap .wsc-wiz-review-card { border: 1px solid var(--wsc-border) !important; border-radius: 12px !important; padding: 12px 14px !important; background: var(--wsc-surface) !important; }
.wsc-portal-wrap .wsc-wiz-review-card header { display: flex !important; justify-content: space-between !important; align-items: center !important; margin-bottom: 8px !important; font-size: 14px !important; }
.wsc-portal-wrap .wsc-wiz-review-card ul { margin: 0 !important; padding: 0 !important; list-style: none !important; }
.wsc-portal-wrap .wsc-wiz-review-card li { display: flex !important; justify-content: space-between !important; gap: 8px !important; padding: 6px 0 !important; border-bottom: 1px dashed var(--wsc-border) !important; font-size: 13px !important; margin: 0 !important; }
.wsc-portal-wrap .wsc-wiz-review-card li:last-child { border-bottom: 0 !important; }
@media (max-width: 782px) {
  .wsc-portal-wrap .wsc-wiz-step b { display: none !important; }
  .wsc-portal-wrap .wsc-wiz-keys { display: none !important; }
  .wsc-portal-wrap .wsc-wiz-grid { grid-template-columns: 1fr !important; }
  .wsc-portal-wrap .wsc-wiz-head, .wsc-portal-wrap .wsc-wiz-steps, .wsc-portal-wrap .wsc-wiz-tools, .wsc-portal-wrap .wsc-wiz-body, .wsc-portal-wrap .wsc-wiz-tray, .wsc-portal-wrap .wsc-wiz-foot { padding-left: 14px !important; padding-right: 14px !important; }
  .wsc-portal-wrap .wsc-wiz-nav { width: 100% !important; } .wsc-portal-wrap .wsc-wiz-nav .button { flex: 1 1 0 !important; min-width: 0 !important; }
}

/* شرح حال تاشده: سرتیتر یک خط، موارد در شبکه‌ی تراز */
.wsc-portal-wrap .wsc-history-collapsible > summary { flex-direction: column !important; align-items: stretch !important; flex-wrap: nowrap !important; gap: 10px !important; }
.wsc-portal-wrap .wsc-history-sum-head { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 10px !important; }
.wsc-portal-wrap .wsc-history-toggle-hint { border: 1px solid var(--wsc-border) !important; border-radius: 999px !important; padding: 3px 12px !important; font-size: 12px !important; }
.wsc-portal-wrap .wsc-history-oneline { display: grid !important; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)) !important; gap: 6px 10px !important; }
.wsc-portal-wrap .wsc-history-oneline-item { display: flex !important; align-items: baseline !important; gap: 8px !important; min-width: 0 !important; background: var(--wsc-hover-bg) !important; border-radius: 8px !important; padding: 6px 10px !important; line-height: 1.5 !important; }
.wsc-portal-wrap .wsc-history-oneline-item b { flex: 0 0 44px !important; text-align: center !important; font-size: 11px !important; background: color-mix(in srgb, var(--wsc-primary) 14%, var(--wsc-surface)) !important; border-radius: 5px !important; padding: 1px 0 !important; }
.wsc-portal-wrap .wsc-history-oneline-item > span { flex: 1 1 auto !important; min-width: 0 !important; overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; text-align: start !important; }

/* پاپ‌آپ: پنل کناری «نسخه‌ی این ویزیت» + حذف واضح + بازگردانی */
.wsc-portal-wrap .wsc-wiz-main { flex: 1 1 auto !important; min-height: 0 !important; display: flex !important; }
.wsc-portal-wrap .wsc-wiz-main .wsc-wiz-body { flex: 1 1 auto !important; min-width: 0 !important; }
.wsc-portal-wrap .wsc-wiz-aside { flex: 0 0 280px !important; border-inline-start: 1px solid var(--wsc-border) !important; background: var(--wsc-hover-bg) !important; overflow-y: auto !important; padding: 14px !important; }
.wsc-portal-wrap .wsc-wiz-aside h4 { margin: 0 0 10px !important; font-size: 13px !important; color: var(--wsc-muted) !important; }
.wsc-portal-wrap .wsc-wiz-aside section { background: var(--wsc-surface) !important; border: 1px solid var(--wsc-border) !important; border-radius: 10px !important; margin-bottom: 10px !important; overflow: hidden !important; }
.wsc-portal-wrap .wsc-wiz-aside section.is-active { border-color: var(--wsc-primary) !important; box-shadow: 0 0 0 2px color-mix(in srgb, var(--wsc-primary) 18%, transparent) !important; }
.wsc-portal-wrap .wsc-wiz-aside header { display: flex !important; justify-content: space-between !important; align-items: center !important; padding: 7px 10px !important; cursor: pointer !important; font-size: 13px !important; background: color-mix(in srgb, var(--wsc-primary) 6%, var(--wsc-surface)) !important; }
.wsc-portal-wrap .wsc-wiz-aside header em:not(:empty) { font-style: normal !important; background: #16a34a !important; color: #fff !important; border-radius: 999px !important; padding: 0 7px !important; font-size: 11px !important; }
.wsc-portal-wrap .wsc-wiz-aside ul { list-style: none !important; margin: 0 !important; padding: 4px 0 !important; }
.wsc-portal-wrap .wsc-wiz-aside li { display: flex !important; align-items: center !important; gap: 6px !important; padding: 5px 10px !important; margin: 0 !important; font-size: 12.5px !important; }
.wsc-portal-wrap .wsc-wiz-aside li > span { flex: 1 1 auto !important; min-width: 0 !important; text-align: left !important; }
.wsc-portal-wrap .wsc-wiz-aside p { margin: 0 !important; padding: 6px 10px !important; color: var(--wsc-muted) !important; font-size: 12px !important; }
.wsc-portal-wrap .wsc-wiz-aside-x, .wsc-portal-wrap .wsc-wiz-del { flex: 0 0 auto !important; width: 26px !important; height: 26px !important; border-radius: 7px !important; border: 1px solid #fecaca !important; background: #fef2f2 !important; color: #dc2626 !important; font-size: 16px !important; line-height: 1 !important; cursor: pointer !important; padding: 0 !important; display: inline-grid !important; place-items: center !important; }
.wsc-portal-wrap .wsc-wiz-aside-x:hover, .wsc-portal-wrap .wsc-wiz-del:hover { background: #dc2626 !important; color: #fff !important; border-color: #dc2626 !important; }
.wsc-portal-wrap .wsc-wiz-del { width: 30px !important; height: 30px !important; }
.wsc-portal-wrap .wsc-wiz-row.is-added { cursor: default !important; }
.wsc-portal-wrap .wsc-wiz-toast { position: absolute !important; bottom: 76px !important; left: 50% !important; transform: translate(-50%, 20px) !important; opacity: 0 !important; pointer-events: none !important; background: #1f2937 !important; color: #fff !important; border-radius: 10px !important; padding: 9px 14px !important; display: flex !important; gap: 14px !important; align-items: center !important; font-size: 13px !important; transition: all .2s !important; z-index: 5 !important; }
.wsc-portal-wrap .wsc-wiz-toast.is-on { opacity: 1 !important; transform: translate(-50%, 0) !important; pointer-events: auto !important; }
.wsc-portal-wrap .wsc-wiz-toast button { background: transparent !important; border: 0 !important; color: #93c5fd !important; font-weight: 700 !important; cursor: pointer !important; }
.wsc-portal-wrap .wsc-modal.wsc-enc-wizard { position: relative !important; direction: rtl !important; }
.wsc-portal-wrap .wsc-wiz-search:placeholder-shown { direction: rtl !important; text-align: right !important; }
.wsc-portal-wrap .wsc-wiz-groups, .wsc-portal-wrap .wsc-wiz-grid { direction: rtl !important; }
@media (max-width: 900px) {
  .wsc-portal-wrap .wsc-wiz-main { flex-direction: column !important; }
  .wsc-portal-wrap .wsc-wiz-aside { flex: 0 0 auto !important; max-height: 30vh !important; border-inline-start: 0 !important; border-top: 1px solid var(--wsc-border) !important; }
}

/* خلاصه‌ی شرح حال انگلیسی است: چپ‌چین */
.wsc-portal-wrap .wsc-history-oneline { direction: ltr !important; }
.wsc-portal-wrap .wsc-history-oneline-item > span { text-align: left !important; }

/* قدم تشخیص: کاشی گروه‌ها ← لیست ساده؛ ظاهر ساده‌تر و غیرفانتزی */
.wsc-portal-wrap .wsc-wiz-tiles { display: grid !important; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)) !important; gap: 10px !important; }
.wsc-portal-wrap .wsc-wiz-tile { display: flex !important; flex-direction: column !important; align-items: flex-start !important; gap: 4px !important; padding: 18px 16px !important; border: 1px solid var(--wsc-border) !important; border-radius: 8px !important; background: var(--wsc-surface) !important; cursor: pointer !important; text-align: right !important; }
.wsc-portal-wrap .wsc-wiz-tile:hover, .wsc-portal-wrap .wsc-wiz-tile:focus { border-color: var(--wsc-primary) !important; background: var(--wsc-hover-bg) !important; }
.wsc-portal-wrap .wsc-wiz-tile b { font-size: 15px !important; color: var(--wsc-ink) !important; }
.wsc-portal-wrap .wsc-wiz-tile small { font-size: 12px !important; color: var(--wsc-muted) !important; }
.wsc-portal-wrap .wsc-wiz-crumb { display: flex !important; align-items: center !important; gap: 12px !important; margin-bottom: 10px !important; font-size: 14px !important; }
.wsc-portal-wrap .wsc-wiz-flat { border: 1px solid var(--wsc-border) !important; border-radius: 8px !important; max-width: 720px !important; }
.wsc-portal-wrap .wsc-modal.wsc-enc-wizard { border-radius: 10px !important; box-shadow: 0 10px 30px rgba(0,0,0,.2) !important; }
.wsc-portal-wrap .wsc-wiz-dot { border-width: 1px !important; }
.wsc-portal-wrap .wsc-wiz-step.is-active .wsc-wiz-dot { box-shadow: none !important; }
.wsc-portal-wrap .wsc-wiz-tools, .wsc-portal-wrap .wsc-wiz-aside { background: var(--wsc-surface) !important; }
.wsc-portal-wrap .wsc-wiz-search:focus { box-shadow: none !important; }
.wsc-portal-wrap .wsc-wiz-grid .wsc-wiz-row, .wsc-portal-wrap .wsc-wiz-aside section, .wsc-portal-wrap .wsc-wiz-review-card { border-radius: 6px !important; }
.wsc-portal-wrap .wsc-wiz-aside section.is-active { box-shadow: none !important; }
.wsc-portal-wrap .wsc-wiz-aside header { background: var(--wsc-hover-bg) !important; }
.wsc-portal-wrap .wsc-wiz-seg { border-radius: 6px !important; }
.wsc-portal-wrap .wsc-wiz-eye { min-width: 38px !important; height: 28px !important; }
.wsc-portal-wrap .wsc-wiz-eye.is-default { text-decoration: none !important; color: var(--wsc-muted) !important; }
.wsc-portal-wrap .wsc-wiz-eye-od, .wsc-portal-wrap .wsc-wiz-eye-os, .wsc-portal-wrap .wsc-wiz-eye-both { --e: var(--wsc-primary); }
.wsc-portal-wrap .wsc-wiz-row.is-added { background: color-mix(in srgb, var(--wsc-primary) 6%, var(--wsc-surface)) !important; }
.wsc-portal-wrap .wsc-wiz-row.is-added .wsc-wiz-check { background: var(--wsc-primary) !important; border-color: var(--wsc-primary) !important; }
.wsc-portal-wrap .wsc-wiz-check { border-width: 1px !important; border-radius: 4px !important; }
.wsc-portal-wrap .wsc-wiz-count:not(:empty), .wsc-portal-wrap .wsc-wiz-aside header em:not(:empty) { background: var(--wsc-muted) !important; }
.wsc-portal-wrap .wsc-wiz-aside-x, .wsc-portal-wrap .wsc-wiz-del { background: transparent !important; border-color: var(--wsc-border) !important; border-radius: 5px !important; }
.wsc-portal-wrap .wsc-wiz-nav .button { border-radius: 6px !important; }

/* فیلتر سریع بالای جداول */
.wsc-portal-wrap .wsc-qf-bar { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 10px !important; flex-wrap: wrap !important; margin: 4px 0 8px !important; }
.wsc-portal-wrap .wsc-qf-tabs { display: flex !important; gap: 2px !important; flex-wrap: wrap !important; }
.wsc-portal-wrap .wsc-qf-tabs button { border: 0 !important; background: transparent !important; color: var(--wsc-muted) !important; border-radius: 6px !important; padding: 6px 10px !important; font-size: 12.5px !important; cursor: pointer !important; font-family: inherit !important; }
.wsc-portal-wrap .wsc-qf-tabs button em { font-style: normal !important; font-size: 11px !important; opacity: .75 !important; }
.wsc-portal-wrap .wsc-qf-tabs button:hover { color: var(--wsc-ink) !important; }
.wsc-portal-wrap .wsc-qf-tabs button.is-on { background: var(--wsc-hover-bg) !important; color: var(--wsc-primary) !important; font-weight: 600 !important; }
.wsc-portal-wrap .wsc-qf-search { width: 240px !important; max-width: 100% !important; min-height: 34px !important; padding: 6px 10px !important; font-size: 12.5px !important; border: 1px solid var(--wsc-border) !important; border-radius: 7px !important; background: var(--wsc-surface) !important; }
@media (max-width: 700px) { .wsc-portal-wrap .wsc-qf-search { width: 100% !important; } }

/* مرور نهایی پاپ‌آپ = جمع‌بندی Diagnosis / Plan صفحه */
.wsc-portal-wrap .wsc-wiz-review-edits { display: flex !important; align-items: center !important; gap: 6px !important; flex-wrap: wrap !important; margin-bottom: 14px !important; font-size: 13px !important; color: var(--wsc-muted) !important; }
.wsc-portal-wrap .wsc-wiz-review-summary { max-width: 900px !important; margin: 0 !important; }

/* اپتومتری: اعداد چپ‌به‌راست، تضاد بیشتر OD/OS، گزینه‌ی پاک کردن، توضیحات لنز، دکمه‌های چاپ */
.wsc-portal-wrap input.wsc-exam-input, .wsc-portal-wrap .wsc-rx-input { direction: ltr !important; text-align: center !important; unicode-bidi: plaintext; }
.wsc-portal-wrap .wsc-custom-select-search[dir="ltr"] { direction: ltr !important; text-align: left !important; }
.wsc-portal-wrap .wsc-custom-select-search:placeholder-shown { direction: rtl !important; text-align: right !important; }
.wsc-portal-wrap .wsc-custom-select-option { direction: ltr; text-align: center; min-height: 26px; }
.wsc-portal-wrap .wsc-custom-select-option.wsc-custom-select-clear { direction: rtl !important; color: var(--wsc-danger) !important; font-size: 12px !important; }
.wsc-custom-select-option.wsc-custom-select-clear { direction: rtl; color: #dc2626; font-size: 12px; }
.wsc-portal-wrap table.wsc-exam-grid.wsc-exam-grid tbody tr td.wsc-eye-od.wsc-eye-od { background: color-mix(in srgb, var(--wsc-primary) 11%, var(--wsc-surface)) !important; }
.wsc-portal-wrap table.wsc-exam-grid.wsc-exam-grid tbody tr td.wsc-eye-os.wsc-eye-os { background: color-mix(in srgb, #f59e0b 13%, var(--wsc-surface)) !important; }
.wsc-portal-wrap table.wsc-exam-grid.wsc-exam-grid thead tr th.wsc-eye-od.wsc-eye-od { background: color-mix(in srgb, var(--wsc-primary) 24%, var(--wsc-surface)) !important; color: var(--wsc-ink) !important; }
.wsc-portal-wrap table.wsc-exam-grid.wsc-exam-grid thead tr th.wsc-eye-os.wsc-eye-os { background: color-mix(in srgb, #f59e0b 28%, var(--wsc-surface)) !important; color: var(--wsc-ink) !important; }
.wsc-portal-wrap table.wsc-exam-grid.wsc-exam-grid td.wsc-eye-os + td.wsc-eye-od, .wsc-portal-wrap table.wsc-exam-grid.wsc-exam-grid td.wsc-eye-od + td.wsc-eye-os { border-inline-start: 2px solid var(--wsc-ink) !important; }
.wsc-portal-wrap .wsc-cl-note { margin-top: 10px !important; }
.wsc-portal-wrap .wsc-rx-print-btns { display: inline-flex !important; gap: 6px !important; flex-wrap: wrap !important; }
.wsc-portal-wrap .wsc-optical-cd { margin-top: 6px !important; font-size: 12.5px !important; }
.wsc-portal-wrap .wsc-doc-camera-btn { display: inline-flex !important; align-items: center !important; gap: 6px !important; cursor: pointer !important; }

/* حالت تب گروه‌های تشخیص بالای جداول */
.wsc-portal-wrap .wsc-dx-group-tabs { display: flex !important; gap: 4px !important; flex-wrap: wrap !important; margin: 0 0 12px !important; padding-bottom: 8px !important; border-bottom: 1px solid var(--wsc-border) !important; direction: ltr !important; }
.wsc-portal-wrap .wsc-dx-group-tab { border: 1px solid var(--wsc-border) !important; background: var(--wsc-surface) !important; color: var(--wsc-ink) !important; border-radius: 8px !important; padding: 7px 14px !important; font-size: 13px !important; font-weight: 600 !important; cursor: pointer !important; font-family: inherit !important; }
.wsc-portal-wrap .wsc-dx-group-tab:hover { border-color: var(--wsc-primary) !important; color: var(--wsc-primary) !important; }
.wsc-portal-wrap .wsc-dx-group-tab.is-active { background: var(--wsc-primary) !important; border-color: var(--wsc-primary) !important; color: #fff !important; }
.wsc-portal-wrap .wsc-col-filter-tag { font-size: 11px !important; font-weight: 500 !important; color: var(--wsc-muted) !important; margin-inline-start: 6px !important; }

.wsc-portal-wrap .wsc-dx-group-tabs { align-items: center !important; }
.wsc-portal-wrap .wsc-dx-group-label { font-size: 12px !important; font-weight: 700 !important; color: var(--wsc-muted) !important; margin-inline-end: 6px !important; white-space: nowrap !important; }

.wsc-portal-wrap .wsc-dx-group-label { display: block !important; margin: 0 0 6px !important; direction: ltr !important; text-align: left !important; }
.wsc-portal-wrap .wsc-dx-group-tab { text-transform: none !important; letter-spacing: 0 !important; }

/* برچسب بالای تب‌های گروه: برجسته‌تر */
.wsc-portal-wrap .wsc-dx-group-label { font-size: 14px !important; font-weight: 800 !important; color: var(--wsc-primary) !important; margin: 0 0 8px !important; padding-left: 8px !important; border-left: 3px solid var(--wsc-primary) !important; line-height: 1.3 !important; }

/* شرح حال خلاصه: سه مورد اول، مقادیر جلوی عنوان */
.wsc-portal-wrap .wsc-history-compact:not(.is-expanded) > .wsc-history-col:nth-child(n+4) { display: none !important; }
.wsc-portal-wrap .wsc-history-compact > .wsc-history-col { display: flex !important; align-items: flex-start !important; gap: 6px !important; flex-wrap: wrap !important; }
.wsc-portal-wrap .wsc-history-compact > .wsc-history-col > .wsc-history-card { flex: 0 0 auto !important; margin: 0 !important; }
.wsc-portal-wrap .wsc-history-compact > .wsc-history-col > .wsc-history-chips { flex: 1 1 0 !important; min-width: 0 !important; margin: 0 !important; padding: 0 !important; }
.wsc-portal-wrap .wsc-history-more-btn { border: 0 !important; background: none !important; color: var(--wsc-primary) !important; font-size: 12px !important; cursor: pointer !important; padding: 4px 0 !important; font-family: inherit !important; }
/* حذف کادر جستجوی جداول */
.wsc-portal-wrap .wsc-dv-nosearch .wsc-catalog-search-row .wsc-catalog-search-input { display: none !important; }
.wsc-portal-wrap .wsc-dv-nosearch .wsc-catalog-search-row { justify-content: flex-end !important; }
/* ظاهر کلاسیک: فقط دیتا، بدون تیترهای اضافه و کادرهای تزئینی */
.wsc-portal-wrap .wsc-dv-classic .wsc-dv-opto > .wsc-panel-card-head,
.wsc-portal-wrap .wsc-dv-classic .wsc-visit-summary-narrative > h4,
.wsc-portal-wrap .wsc-dv-classic .wsc-dv-encounter > .wsc-panel-card-head > h3,
.wsc-portal-wrap .wsc-dv-classic .wsc-dx-group-label { display: none !important; }
.wsc-portal-wrap .wsc-dv-classic .wsc-dv-encounter > .wsc-panel-card-head:not(:has(.button)) { display: none !important; }
.wsc-portal-wrap .wsc-dv-classic .wsc-dx-group-tabs { border-bottom: 1px solid #333 !important; gap: 14px !important; }
.wsc-portal-wrap .wsc-dv-classic .wsc-dx-group-tab { border: 0 !important; background: none !important; color: #333 !important; padding: 4px 2px !important; border-radius: 0 !important; box-shadow: none !important; }
.wsc-portal-wrap .wsc-dv-classic .wsc-dx-group-tab.is-active { color: #000 !important; font-weight: 800 !important; text-decoration: underline !important; text-underline-offset: 5px !important; background: none !important; }
.wsc-portal-wrap .wsc-dv-classic .wsc-catalog-results .wsc-add-item-btn { border: 0 !important; background: none !important; box-shadow: none !important; color: #000 !important; font-weight: 700 !important; padding: 2px 5px !important; min-width: 0 !important; }
.wsc-portal-wrap .wsc-dv-classic .wsc-catalog-results .wsc-add-item-btn:hover { background: #eee !important; }
/* ظاهر کلاسیک: همه‌ی بخش‌ها داخل یک برگه‌ی سفید A4 */
.wsc-portal-wrap .wsc-dv-sheet { background: #fff !important; margin: 16px auto !important; padding: 14mm 12mm !important; border: 1px solid #ccc !important; box-shadow: 0 2px 14px rgba(0,0,0,.12) !important; box-sizing: border-box !important; max-width: 100% !important; }
.wsc-portal-wrap .wsc-dv-sheet-1 { width: 210mm !important; min-height: 297mm !important; }
.wsc-portal-wrap .wsc-dv-sheet-2 { width: 297mm !important; min-height: 210mm !important; }
.wsc-portal-wrap .wsc-dv-sheet .wsc-panel-card, .wsc-portal-wrap .wsc-dv-sheet .wsc-history-card, .wsc-portal-wrap .wsc-dv-sheet .wsc-visit-summary-narrative { border: 0 !important; border-bottom: 1px solid #bbb !important; padding: 8px 0 !important; margin: 0 !important; background: #fff !important; }
@media (max-width: 800px) { .wsc-portal-wrap .wsc-dv-sheet { padding: 12px !important; width: auto !important; min-height: 0 !important; } }

/* کارت بیمار خلاصه */
.wsc-portal-wrap .wsc-dv-patient-compact #wsc-patient-locked-name { cursor: pointer !important; user-select: none !important; }
.wsc-portal-wrap .wsc-dv-patient-compact:not(.is-open) .wsc-panel-card-head > div,
.wsc-portal-wrap .wsc-dv-patient-compact:not(.is-open) #wsc-patient-locked-info { display: none !important; }
.wsc-portal-wrap .wsc-dv-patient-compact:not(.is-open) .wsc-panel-card-head { margin: 0 !important; padding: 0 !important; border: 0 !important; }
.wsc-portal-wrap .wsc-dv-patient-compact:not(.is-open) { padding-top: 12px !important; padding-bottom: 12px !important; }
.wsc-portal-wrap .wsc-patient-toggle { border: 0 !important; background: none !important; color: var(--wsc-primary) !important; font-size: 14px !important; cursor: pointer !important; padding: 0 4px !important; transition: transform .15s !important; }
.wsc-portal-wrap .wsc-dv-patient-compact.is-open .wsc-patient-toggle { transform: rotate(180deg) !important; }
/* شرح حال خلاصه: آیکن پنجره حذف؛ کلیک روی خود عنوان لیست را باز می‌کند */
.wsc-portal-wrap .wsc-history-compact .wsc-history-browse-btn { display: none !important; }
.wsc-portal-wrap .wsc-history-compact .wsc-history-add > label { cursor: pointer !important; }

/* کارتابل کامل پزشک */
.wsc-portal-wrap .wsc-dwl-tabs { margin: 0 0 10px !important; }
.wsc-portal-wrap .wsc-dwl-table tr.wsc-dwl-done td, .wsc-portal-wrap .wsc-dwl-table tr.wsc-dwl-noshow td { opacity: .7 !important; }
.wsc-portal-wrap .wsc-dwl-table tr.wsc-dwl-doctor td { font-weight: 600 !important; }
.wsc-portal-wrap .wsc-dwl-late { color: var(--wsc-danger, #c0392b) !important; font-size: 11px !important; display: inline !important; }
.wsc-portal-wrap .wsc-pill-info { background: color-mix(in srgb, var(--wsc-primary) 12%, #fff) !important; color: var(--wsc-primary) !important; }

/* برگه‌ی کلاسیک: حالت ۱ تمام‌عرض، ۳ = A4 عمودی */
.wsc-portal-wrap .wsc-dv-sheet.wsc-dv-sheet-1 { width: 100% !important; min-height: 0 !important; margin: 12px 0 !important; padding: 10mm 8mm !important; }
.wsc-portal-wrap .wsc-dv-sheet-3 { width: 210mm !important; min-height: 297mm !important; }
/* ظاهر کلاسیک: شرح حال بیمار (خلاصه‌ی یک‌خطی و جدول) */
.wsc-portal-wrap .wsc-dv-classic .wsc-history-collapsible { background: #fff !important; border: 0 !important; box-shadow: none !important; border-radius: 0 !important; }
.wsc-portal-wrap .wsc-dv-classic .wsc-history-oneline-item { background: #fff !important; border: 0 !important; border-bottom: 1px solid #ccc !important; border-radius: 0 !important; padding: 5px 2px !important; color: #111 !important; }
.wsc-portal-wrap .wsc-dv-classic .wsc-history-oneline-item b { background: none !important; color: #000 !important; border-radius: 0 !important; font-weight: 800 !important; text-align: start !important; }
.wsc-portal-wrap .wsc-dv-classic .wsc-history-toggle-hint { border: 1px solid #555 !important; border-radius: 0 !important; color: #111 !important; background: #fff !important; }
.wsc-portal-wrap .wsc-dv-classic .wsc-history-grid { border-color: #333 !important; border-radius: 0 !important; }
.wsc-portal-wrap .wsc-dv-classic .wsc-history-col, .wsc-portal-wrap .wsc-dv-classic .wsc-history-col:nth-child(even) { background: #fff !important; border-color: #ccc !important; }
.wsc-portal-wrap .wsc-dv-classic .wsc-history-card { border: 0 !important; background: none !important; padding: 0 !important; }
.wsc-portal-wrap .wsc-dv-classic .wsc-history-col label { color: #000 !important; font-weight: 800 !important; }

/* شرح حال خلاصه: یک‌ستونه، سه ردیف زیر هم، مقادیر جلوی عنوان */
.wsc-portal-wrap .wsc-history-compact { grid-template-columns: 1fr !important; gap: 0 !important; }
.wsc-portal-wrap .wsc-history-compact > .wsc-history-col { align-items: center !important; flex-wrap: nowrap !important; padding: 5px 0 !important; border-bottom: 1px solid var(--wsc-border) !important; border-top: 0 !important; }
.wsc-portal-wrap .wsc-history-compact > .wsc-history-col > .wsc-history-card { order: 0 !important; display: flex !important; align-items: center !important; gap: 6px !important; flex: 0 0 auto !important; padding: 0 !important; border: 0 !important; }
.wsc-portal-wrap .wsc-history-compact .wsc-history-add > label { flex: 0 0 48px !important; margin: 0 !important; }
.wsc-portal-wrap .wsc-history-compact .wsc-history-input { width: 150px !important; }
.wsc-portal-wrap .wsc-history-compact > .wsc-history-col > .wsc-history-chips { display: flex !important; flex-wrap: wrap !important; gap: 4px !important; align-items: center !important; min-height: 0 !important; }
.wsc-portal-wrap .wsc-history-oneline-compact { grid-template-columns: 1fr !important; }
/* بدون کادر جستجو: دکمه‌ی پنجره کنار تیتر جدول */
.wsc-portal-wrap .wsc-dv-nosearch .wsc-encounter-col { position: relative !important; }
.wsc-portal-wrap .wsc-dv-nosearch .wsc-catalog-search-row { position: absolute !important; top: -4px !important; right: 0 !important; margin: 0 !important; }
.wsc-portal-wrap .wsc-dv-nosearch .wsc-encounter-col > h4 { padding-right: 34px !important; min-height: 26px !important; display: flex !important; align-items: center !important; }
/* ظاهر کلاسیک: نوار فیلتر و مدارک */
.wsc-portal-wrap .wsc-dv-classic .wsc-dx-filter-bar { background: #fff !important; border: 0 !important; border-bottom: 1px solid #999 !important; border-radius: 0 !important; color: #333 !important; }
.wsc-portal-wrap .wsc-dv-classic .wsc-dx-show-all, .wsc-portal-wrap .wsc-dv-classic .wsc-dx-filter-bar .button-link { color: #000 !important; font-weight: 700 !important; text-decoration: underline !important; background: none !important; }
.wsc-portal-wrap .wsc-dv-classic .wsc-document-row, .wsc-portal-wrap .wsc-dv-classic .wsc-document-row a, .wsc-portal-wrap .wsc-dv-classic .wsc-document-name { color: #111 !important; background: #fff !important; border: 0 !important; border-radius: 0 !important; }
.wsc-portal-wrap .wsc-dv-classic .wsc-document-row { border-bottom: 1px solid #ccc !important; }
.wsc-portal-wrap .wsc-dv-classic .wsc-document-row .wsc-icon, .wsc-portal-wrap .wsc-dv-classic .wsc-document-row svg { color: #111 !important; stroke: currentColor !important; }
.wsc-portal-wrap .wsc-dv-classic .wsc-history-compact > .wsc-history-col { border-bottom-color: #ccc !important; }
/* دکمه‌های نوار پایین ویزیت سمت چپ */
.wsc-portal-wrap .wsc-save-bar-actions { display: flex !important; justify-content: flex-end !important; margin-inline-start: auto !important; }

/* شرح حال خلاصه (حالت ویرایش) — مثل خلاصه‌ی بسته: ردیف‌های زیر هم، برچسب چپ، مقادیر جلویش */
.wsc-portal-wrap .wsc-history-grid.wsc-history-compact.wsc-history-compact { display: block !important; border: 0 !important; }
.wsc-portal-wrap .wsc-history-grid.wsc-history-compact > .wsc-history-col { display: flex !important; flex-direction: row !important; direction: ltr !important; align-items: center !important; flex-wrap: nowrap !important; gap: 8px !important; padding: 7px 2px !important; border: 0 !important; border-bottom: 1px solid var(--wsc-border) !important; background: none !important; position: relative !important; min-height: 0 !important; }
.wsc-portal-wrap .wsc-history-grid.wsc-history-compact > .wsc-history-col > .wsc-history-card,
.wsc-portal-wrap .wsc-history-grid.wsc-history-compact .wsc-history-add { display: contents !important; }
.wsc-portal-wrap .wsc-history-grid.wsc-history-compact .wsc-history-add > label,
.wsc-portal-wrap .wsc-history-grid.wsc-history-compact .wsc-history-card > label { order: 0 !important; flex: 0 0 48px !important; margin: 0 !important; padding: 0 !important; background: none !important; font-size: 12px !important; font-weight: 800 !important; text-align: start !important; }
.wsc-portal-wrap .wsc-history-grid.wsc-history-compact .wsc-history-chips { order: 1 !important; flex: 1 1 auto !important; display: flex !important; flex-wrap: wrap !important; gap: 2px 10px !important; margin: 0 !important; padding: 0 !important; min-height: 0 !important; border: 0 !important; background: none !important; }
.wsc-portal-wrap .wsc-history-grid.wsc-history-compact .wsc-chip { border: 0 !important; background: none !important; box-shadow: none !important; padding: 0 !important; font-size: 13px !important; font-weight: 500 !important; }
.wsc-portal-wrap .wsc-history-grid.wsc-history-compact .wsc-history-add-btn { order: 2 !important; }
.wsc-portal-wrap .wsc-history-grid.wsc-history-compact .wsc-history-input { order: 3 !important; flex: 0 0 150px !important; width: 150px !important; }
.wsc-portal-wrap .wsc-history-grid.wsc-history-compact .wsc-history-suggestions { top: 100% !important; left: auto !important; right: 0 !important; width: 280px !important; }
/* بدون کادر جستجو: دکمه‌ی پنجره بریده نشود */
.wsc-portal-wrap .wsc-dv-nosearch .wsc-encounter-col, .wsc-portal-wrap .wsc-dv-nosearch .wsc-encounter-items-grid { overflow: visible !important; }
.wsc-portal-wrap .wsc-dv-nosearch .wsc-catalog-search-row { top: 0 !important; }
.wsc-portal-wrap .wsc-dv-nosearch .wsc-encounter-col > h4 { min-height: 32px !important; }
/* ظاهر کلاسیک: پنجره‌ها (بیرون از کارت ساخته می‌شوند) */
body:has(.wsc-dv-classic) .wsc-modal { border-radius: 0 !important; border: 1px solid #333 !important; box-shadow: 0 6px 30px rgba(0,0,0,.25) !important; font-family: Tahoma, Vazirmatn, sans-serif !important; }
body:has(.wsc-dv-classic) .wsc-modal input { border: 1px solid #555 !important; border-radius: 0 !important; box-shadow: none !important; }
body:has(.wsc-dv-classic) .wsc-modal button, body:has(.wsc-dv-classic) .wsc-modal .button { background: #fff !important; color: #111 !important; border: 1px solid #555 !important; border-radius: 0 !important; box-shadow: none !important; }
body:has(.wsc-dv-classic) .wsc-modal button:hover, body:has(.wsc-dv-classic) .wsc-modal .button:hover { background: #eee !important; color: #000 !important; }
body:has(.wsc-dv-classic) .wsc-modal button.is-active, body:has(.wsc-dv-classic) .wsc-modal button.is-selected { background: #111 !important; color: #fff !important; }

/* ظاهر کلاسیک پنجره‌ها: شبیه برگه‌ی چاپ پرونده — سفید، متن مشکی، فقط خط نازک، بدون کادر دور گزینه‌ها */
html body:has(.wsc-dv-classic) .wsc-modal { background: #fff !important; color: #111 !important; border-radius: 0 !important; border: 1px solid #333 !important; }
html body:has(.wsc-dv-classic) .wsc-modal .wsc-modal-title { font-family: Tahoma, Vazirmatn, sans-serif !important; font-size: 15px !important; color: #000 !important; }
html body:has(.wsc-dv-classic) .wsc-modal .wsc-catalog-browser-group { background: #fff !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; padding: 0 !important; }
html body:has(.wsc-dv-classic) .wsc-modal .wsc-catalog-browser-group h4 { background: #fff !important; color: #000 !important; border: 0 !important; border-bottom: 2px solid #000 !important; border-radius: 0 !important; font-weight: 800 !important; padding: 4px 2px !important; margin: 0 0 4px !important; text-align: start !important; }
html body:has(.wsc-dv-classic) .wsc-modal .wsc-catalog-browser-item, html body:has(.wsc-dv-classic) .wsc-modal .wsc-catalog-browser-items button { background: #fff !important; color: #111 !important; border: 0 !important; border-bottom: 1px solid #ddd !important; border-radius: 0 !important; box-shadow: none !important; font-weight: 500 !important; text-transform: none !important; text-align: start !important; padding: 5px 4px !important; min-height: 0 !important; }
html body:has(.wsc-dv-classic) .wsc-modal .wsc-catalog-browser-item:hover, html body:has(.wsc-dv-classic) .wsc-modal .wsc-catalog-browser-items button:hover { background: #f2f2f2 !important; color: #000 !important; }
html body:has(.wsc-dv-classic) .wsc-modal .wsc-catalog-browser-item.is-selected, html body:has(.wsc-dv-classic) .wsc-modal .wsc-catalog-browser-item.is-active, html body:has(.wsc-dv-classic) .wsc-modal .wsc-catalog-browser-items button.is-selected { background: #fff !important; color: #000 !important; font-weight: 800 !important; text-decoration: underline !important; }
html body:has(.wsc-dv-classic) .wsc-modal .wsc-catalog-group-search, html body:has(.wsc-dv-classic) .wsc-modal input { background: #fff !important; border: 0 !important; border-bottom: 1px solid #777 !important; border-radius: 0 !important; box-shadow: none !important; }
html body:has(.wsc-dv-classic) .wsc-modal .wsc-catalog-browser-tabs button, html body:has(.wsc-dv-classic) .wsc-modal .wsc-catalog-view-btn, html body:has(.wsc-dv-classic) .wsc-modal .wsc-modal-close { background: #fff !important; color: #111 !important; border: 1px solid #999 !important; border-radius: 0 !important; box-shadow: none !important; }
html body:has(.wsc-dv-classic) .wsc-modal .wsc-catalog-browser-tabs button.is-active, html body:has(.wsc-dv-classic) .wsc-modal .wsc-catalog-view-btn.is-active { background: #fff !important; color: #000 !important; border-color: #000 !important; font-weight: 800 !important; text-decoration: underline !important; }
html body:has(.wsc-dv-classic) .wsc-modal .wsc-catalog-view-btn .wsc-icon, html body:has(.wsc-dv-classic) .wsc-modal .wsc-catalog-view-btn svg { color: #111 !important; }
html body:has(.wsc-dv-classic) .wsc-modal .wsc-catalog-browser-item-added { background: #fff !important; color: #000 !important; font-weight: 800 !important; text-decoration: underline !important; }
.wsc-portal-wrap .wsc-dv-classic .wsc-history-more-btn { color: #000 !important; font-weight: 700 !important; text-decoration: underline !important; text-underline-offset: 3px !important; font-family: Tahoma, Vazirmatn, sans-serif !important; }

/* ستون تاریخ‌ها + مدارک: هم‌قد ستون کناری، لیست تاریخ‌ها داخل خودش اسکرول می‌خورد */
@media (min-width: 1100px) {
    .wsc-portal-wrap .wsc-dv-band:has(> .wsc-dv-col-fit) { align-items: stretch !important; }
    .wsc-portal-wrap .wsc-dv-col-fit { position: relative !important; min-height: 260px !important; }
    .wsc-portal-wrap .wsc-dv-col-fit-inner { position: absolute !important; inset: 0 !important; display: flex !important; flex-direction: column !important; gap: 14px !important; }
    .wsc-portal-wrap .wsc-dv-col-fit-inner > * { margin: 0 !important; flex: 0 0 auto !important; }
    .wsc-portal-wrap .wsc-dv-col-fit-inner > .wsc-dv-dates { flex: 1 1 0 !important; min-height: 0 !important; display: flex !important; flex-direction: column !important; overflow: hidden !important; }
    .wsc-portal-wrap .wsc-dv-col-fit-inner > .wsc-dv-dates .wsc-date-list { flex: 1 1 0 !important; min-height: 0 !important; max-height: none !important; overflow-y: auto !important; }
}
@media (max-width: 1099px) {
    .wsc-portal-wrap .wsc-dv-col-fit-inner { display: flex !important; flex-direction: column !important; gap: 14px !important; }
}

/* ===== ظاهر کلاسیک — بازبینی کامل (v2) =====
   به‌جای وصله‌ی تک‌تک اجزا، متغیرهای رنگ داخل خود برگه خنثی می‌شوند تا هر جزئی که جداگانه بازنویسی نشده
   (و همین‌طور حالت شب) خودبه‌خود سیاه/سفید بماند. فقط هشدارهای پزشکی بیمار عمدا قرمز می‌مانند. */
.wsc-portal-wrap .wsc-dv-classic, .wsc-portal-wrap .wsc-dv-classic ~ .wsc-save-bar {
    --wsc-primary: #111; --wsc-primary-dark: #000; --wsc-ink: #111; --wsc-muted: #444; --wsc-text-strong: #111;
    --wsc-border: #555; --wsc-border-soft: #bbb; --wsc-form-border: #555; --wsc-surface: #fff; --wsc-bg: #fff;
    --wsc-hover-bg: #eee; --wsc-field-bg: #fff; --wsc-glass-bg: #fff; --wsc-ghost-bg: #fff; --wsc-glass-border: #555;
    --wsc-success: #111; --wsc-success-bg: #fff; --wsc-warning: #111; --wsc-warning-bg: #fff; --wsc-danger: #a00000; --wsc-danger-bg: #fff;
    --wsc-radius-lg: 0; --wsc-radius-md: 0; --wsc-radius-sm: 0; --wsc-radius-btn: 0;
    --wsc-shadow-card: none; --wsc-shadow-card-hover: none;
    font-family: Tahoma, Vazirmatn, sans-serif !important; color: #111 !important;
}
.wsc-portal-wrap .wsc-dv-classic *, .wsc-portal-wrap .wsc-dv-classic *::before, .wsc-portal-wrap .wsc-dv-classic *::after,
.wsc-portal-wrap .wsc-dv-classic ~ .wsc-save-bar, .wsc-portal-wrap .wsc-dv-classic ~ .wsc-save-bar * {
    border-radius: 0 !important; box-shadow: none !important; text-shadow: none !important;
    backdrop-filter: none !important; -webkit-backdrop-filter: none !important; transition: none !important;
}
/* دکمه‌ها: کوچک، تخت و هم‌اندازه */
.wsc-portal-wrap .wsc-dv-classic .button, .wsc-portal-wrap .wsc-dv-classic a.button, .wsc-portal-wrap .wsc-dv-classic ~ .wsc-save-bar .button {
    background: #f4f4f4 !important; background-image: none !important; color: #111 !important; border: 1px solid #555 !important;
    padding: 3px 10px !important; min-height: 0 !important; height: auto !important; line-height: 1.7 !important;
    font-size: 12.5px !important; font-weight: 400 !important; transform: none !important;
}
.wsc-portal-wrap .wsc-dv-classic .button:hover, .wsc-portal-wrap .wsc-dv-classic ~ .wsc-save-bar .button:hover { background: #e2e2e2 !important; color: #000 !important; }
.wsc-portal-wrap .wsc-dv-classic .button.button-primary:not(.wsc-add-item-btn), .wsc-portal-wrap .wsc-dv-classic ~ .wsc-save-bar .button.button-primary {
    background: #111 !important; color: #fff !important; border-color: #111 !important; font-weight: 700 !important;
}
.wsc-portal-wrap .wsc-dv-classic .button.button-primary:not(.wsc-add-item-btn):hover, .wsc-portal-wrap .wsc-dv-classic ~ .wsc-save-bar .button.button-primary:hover { background: #333 !important; color: #fff !important; }
.wsc-portal-wrap .wsc-dv-classic .wsc-icon-btn, .wsc-portal-wrap .wsc-dv-classic .wsc-history-add-btn {
    width: 26px !important; height: 26px !important; min-width: 26px !important; padding: 0 !important; flex: 0 0 26px !important;
    display: inline-flex !important; align-items: center !important; justify-content: center !important; background: #f4f4f4 !important; color: #111 !important; border: 1px solid #555 !important;
}
.wsc-portal-wrap .wsc-dv-classic .wsc-icon-btn .wsc-icon, .wsc-portal-wrap .wsc-dv-classic .wsc-icon-btn svg { color: #111 !important; width: 14px !important; height: 14px !important; }
.wsc-portal-wrap .wsc-dv-classic .wsc-panel-card-head { align-items: center !important; gap: 8px !important; flex-wrap: wrap !important; }
.wsc-portal-wrap .wsc-dv-classic .wsc-panel-card-head h3 { font-size: 14px !important; margin: 0 !important; }
/* برچسب‌ها و چیپ‌ها */
.wsc-portal-wrap .wsc-dv-classic .wsc-pill::before, .wsc-portal-wrap .wsc-dv-classic .wsc-chip::before { display: none !important; content: none !important; }
.wsc-portal-wrap .wsc-dv-classic .wsc-pill, .wsc-portal-wrap .wsc-dv-classic .wsc-chip { padding: 1px 7px !important; font-size: 12px !important; font-weight: 400 !important; line-height: 1.7 !important; }
.wsc-portal-wrap .wsc-dv-classic .wsc-pill.wsc-pill-danger { border: 2px solid #a00000 !important; color: #a00000 !important; font-weight: 700 !important; }
.wsc-portal-wrap .wsc-dv-classic .wsc-chip-remove { color: #111 !important; background: none !important; border: 0 !important; padding: 0 2px !important; min-width: 0 !important; width: auto !important; height: auto !important; }
.wsc-portal-wrap .wsc-dv-classic .wsc-chip-remove:hover { color: #a00000 !important; }
.wsc-portal-wrap .wsc-dv-classic .wsc-chip-eye { background: none !important; color: #000 !important; font-weight: 700 !important; padding: 0 !important; }
.wsc-portal-wrap .wsc-dv-classic .wsc-col-filter-tag { color: #444 !important; background: none !important; }
/* ورودی‌ها */
.wsc-portal-wrap .wsc-dv-classic input[type="text"], .wsc-portal-wrap .wsc-dv-classic textarea { padding: 3px 7px !important; min-height: 0 !important; height: auto !important; font-size: 12.5px !important; line-height: 1.7 !important; }
.wsc-portal-wrap .wsc-dv-classic input::placeholder, .wsc-portal-wrap .wsc-dv-classic textarea::placeholder { color: #888 !important; }
.wsc-portal-wrap .wsc-dv-classic input:focus, .wsc-portal-wrap .wsc-dv-classic textarea:focus { outline: 1px solid #000 !important; outline-offset: 0 !important; border-color: #000 !important; }
/* جدول اپتومتری: بدون رنگ OD/OS؛ مرز بین دو چشم با خط ضخیم */
.wsc-portal-wrap .wsc-dv-classic.wsc-dv-classic table.wsc-exam-grid.wsc-exam-grid :is(thead, tbody) tr :is(th, td),
.wsc-portal-wrap .wsc-dv-classic.wsc-dv-classic table.wsc-exam-grid.wsc-exam-grid :is(thead, tbody) tr :is(th, td).wsc-eye-od.wsc-eye-od,
.wsc-portal-wrap .wsc-dv-classic.wsc-dv-classic table.wsc-exam-grid.wsc-exam-grid :is(thead, tbody) tr :is(th, td).wsc-eye-os.wsc-eye-os {
    background: #fff !important; background-image: none !important; color: #111 !important; padding: 3px 6px !important; font-size: 12.5px !important;
}
.wsc-portal-wrap .wsc-dv-classic.wsc-dv-classic table.wsc-exam-grid.wsc-exam-grid thead tr th,
.wsc-portal-wrap .wsc-dv-classic.wsc-dv-classic table.wsc-exam-grid.wsc-exam-grid thead tr th.wsc-eye-od.wsc-eye-od,
.wsc-portal-wrap .wsc-dv-classic.wsc-dv-classic table.wsc-exam-grid.wsc-exam-grid thead tr th.wsc-eye-os.wsc-eye-os { background: #f0f0f0 !important; font-weight: 700 !important; }
.wsc-portal-wrap .wsc-dv-classic.wsc-dv-classic table.wsc-exam-grid.wsc-exam-grid tbody tr th { background: #f7f7f7 !important; font-weight: 700 !important; }
.wsc-portal-wrap .wsc-dv-classic.wsc-dv-classic .wsc-encounter-col .wsc-chip-eye { border-radius: 0 !important; background: none !important; padding: 0 !important; }
/* خلاصه‌ی اپتومتری و خلاصه‌ی ویزیت */
.wsc-portal-wrap .wsc-dv-classic .wsc-optometry-printout, .wsc-portal-wrap .wsc-dv-classic .wsc-optometry-printout * { color: #111 !important; background: none !important; }
.wsc-portal-wrap .wsc-dv-classic .wsc-optometry-printout-section-label, .wsc-portal-wrap .wsc-dv-classic .wsc-optometry-printout-pd { color: #333 !important; font-weight: 700 !important; }
.wsc-portal-wrap .wsc-dv-classic .wsc-optometry-printout-tag { font-weight: 700 !important; padding: 0 !important; }
.wsc-portal-wrap .wsc-dv-classic .wsc-visit-summary-narrative { padding: 6px 0 !important; }
.wsc-portal-wrap .wsc-dv-classic .wsc-visit-summary-narrative li, .wsc-portal-wrap .wsc-dv-classic .wsc-visit-summary-narrative strong { color: #111 !important; background: none !important; }
.wsc-portal-wrap .wsc-dv-classic .wsc-encounter-summary-box { padding: 6px 10px !important; }
.wsc-portal-wrap .wsc-dv-classic .wsc-encounter-summary-box *, .wsc-portal-wrap .wsc-dv-classic .wsc-catalog-result-name { color: #111 !important; }
/* فهرست یافته‌ها */
.wsc-portal-wrap .wsc-dv-classic .wsc-catalog-result-row { background: #fff !important; border-bottom: 1px solid #ddd !important; padding: 2px 6px !important; }
.wsc-portal-wrap .wsc-dv-classic .wsc-catalog-result-row:hover { background: #f2f2f2 !important; }
.wsc-portal-wrap .wsc-dv-classic .wsc-catalog-suggested { background: #fff !important; font-weight: 700 !important; }
.wsc-portal-wrap .wsc-dv-classic .wsc-catalog-results .wsc-add-item-btn { background: none !important; border: 0 !important; font-weight: 700 !important; padding: 1px 5px !important; }
.wsc-portal-wrap .wsc-dv-classic .wsc-catalog-results .wsc-add-item-btn:hover { background: #ddd !important; }
.wsc-portal-wrap .wsc-dv-classic .wsc-skeleton { background: #eee !important; animation: none !important; }
.wsc-portal-wrap .wsc-dv-classic .wsc-encounter-col h4 { font-size: 13px !important; margin: 0 0 4px !important; }
/* تاریخ‌ها */
.wsc-portal-wrap .wsc-dv-classic .wsc-date-list { padding: 0 !important; scrollbar-width: thin; scrollbar-color: #888 #fff; }
.wsc-portal-wrap .wsc-dv-classic .wsc-date-list li { margin: 0 0 3px !important; }
.wsc-portal-wrap .wsc-dv-classic .wsc-date-list a { padding: 3px 8px !important; font-size: 12.5px !important; }
.wsc-portal-wrap .wsc-dv-classic .wsc-date-list a small { color: inherit !important; opacity: .8; }
/* فاصله‌ها در برگه */
.wsc-portal-wrap .wsc-dv-sheet .wsc-two-col, .wsc-portal-wrap .wsc-dv-sheet .wsc-dv-band { gap: 0 16px !important; margin: 0 !important; }
.wsc-portal-wrap .wsc-dv-sheet .wsc-panel-card:last-child { border-bottom: 0 !important; }
.wsc-portal-wrap .wsc-dv-classic .wsc-hint { font-size: 12.5px !important; }
/* نوار پایین (تکمیل ویزیت) */
.wsc-portal-wrap .wsc-dv-classic ~ .wsc-save-bar { background: #fff !important; border: 1px solid #333 !important; padding: 8px 12px !important; color: #111 !important; }
.wsc-portal-wrap .wsc-dv-classic ~ .wsc-save-bar .wsc-hint { color: #444 !important; font-size: 12px !important; }
/* حالت شب: برگه‌ی کلاسیک همیشه سفید می‌ماند */
body.wsc-dark-mode .wsc-portal-wrap .wsc-dv-classic, body.wsc-dark-mode .wsc-portal-wrap .wsc-dv-classic ~ .wsc-save-bar { background: #fff !important; color: #111 !important; }
body.wsc-dark-mode .wsc-portal-wrap .wsc-dv-classic :is(p, span, li, label, small, strong, b, td, th, h3, h4, a:not(.active), div) { color: #111; }
/* ===== پایان ظاهر کلاسیک v2 ===== */