/* ═══════════════════════════════════════════════════════════════
   Panel Theme — Design Tokens مرکزی (105-panel-ui-modernization / BL-134 / RM-104)
   منبع الهام: ui-ux-pro-max (--design-system) + 21st-dev-magic (get_inspiration)
   تصمیم رنگ: research.md Decision 1 — Navy/Slate (پیوت کامل از Amber)
   ═══════════════════════════════════════════════════════════════ */

:root {
    /* رنگ */
    --color-primary: #0F172A;
    --color-primary-fg: #FFFFFF;
    --color-accent: #0369A1;
    --color-accent-fg: #FFFFFF;
    --color-background: #F8FAFC;
    --color-foreground: #0F172A;
    --color-muted: #E8ECF1;
    /* T015: #64748B (slate-500) روی #F8FAFC فقط ~4.55:1 بود — خیلی نزدیک به مرز AA (4.5:1).
       تیره‌تر شد به slate-600 برای حاشیه‌ی امن (~7.2:1، سطح AAA). */
    --color-muted-fg: #475569;
    --color-border: #E2E8F0;
    --color-destructive: #DC2626;

    /* تایپوگرافی — Vazirmatn بدون تغییر (اصل 7)، فقط type scale */
    --font-size-xs: 12px;
    --font-size-sm: 14px;
    --font-size-base: 16px;
    --font-size-lg: 18px;
    --font-size-xl: 24px;
    --font-size-2xl: 32px;

    /* spacing scale متراکم — هماهنگ با فشرده‌سازی RM-071 */
    --space-1: 8px;
    --space-2: 16px;
    --space-3: 24px;
    --space-4: 32px;

    /* شعاع گردی و سایه — سبک Soft UI Evolution */
    --radius-card: 10px;
    --shadow-card: 0 1px 3px rgba(15, 23, 42, .08), 0 1px 2px rgba(15, 23, 42, .06);
}

/* ── کارت‌های آماری/ویجت‌ها: سایه و گردی نرم جدید ── */
.fi-wi-stats-overview-stat {
    border-radius: var(--radius-card) !important;
    box-shadow: var(--shadow-card) !important;
    border: 1px solid var(--color-border) !important;
}

/* ── Section/Card عمومی Filament: هماهنگ با tokens جدید ── */
.fi-section {
    border-radius: var(--radius-card) !important;
}

/* ── Sidebar/Navigation (FR-005): مرز و آیتم فعال هماهنگ با پالت جدید — رنگ اصلی
     خودش از Filament ->colors() (Navy/Slate) می‌آید، این‌جا فقط مرز/سایه ── */
.fi-sidebar {
    border-inline-end: 1px solid var(--color-border) !important;
}

/* ── US3 (T033/T034/T035): لیست پرونده + ViewCase — badge/جدول هماهنگ با tokens جدید ──
     رنگ‌های semantic (warning/success/danger/gray/info) دست‌نخورده می‌مانند (FR-002 RM-072)؛
     این‌جا فقط شعاع گردی/تایپوگرافی badge یکپارچه می‌شود، نه رنگ. */
.fi-badge {
    border-radius: 6px !important;
    font-weight: 500 !important;
}

/* ═══════════════════════════════════════════════════════════════
   CSS منتقل‌شده از AdminPanelProvider::renderHook(HEAD_END)
   (استخراج خالص — بدون تغییر محتوا، فقط جابه‌جایی مکان؛ T004)
   منشأ: RM-060 (مراحل پرونده)، BL-118 (تفکیک مالک اقدام)، BL-103 (فشرده‌سازی کلی UI)، RM-068 (رفع اسکرول تب‌ها)
   ═══════════════════════════════════════════════════════════════ */

/* اکشن‌های مرحله‌ی فعال همیشه نمایان */
tr.stage-row-active .fi-ta-actions { opacity: 1 !important; }

/* RM-060: نمای کارت/آکاردئون مراحل پرونده */
.report-badge { display: inline-flex; align-items: center; justify-content: center; font-size: .8rem; line-height: 1; }
.report-badge-count { min-width: 1.25rem; height: 1.25rem; padding: 0 .35rem; border-radius: 9999px; background: #e0f2fe; color: #0369a1; font-size: .7rem; font-weight: 600; }
.dark .report-badge-count { background: #0c4a6e; color: #bae6fd; }
.report-badge-empty { color: #9ca3af; }

/* BL-118: برجسته‌سازی گام فعال به تفکیک مالک اقدام — آبی=کارشناس/تیم داخلی، بنفش=متقاضی */
.stage-row-active-internal { border-inline-start: 4px solid #3b82f6 !important; }
.stage-row-active-applicant { border-inline-start: 4px solid #8b5cf6 !important; }

/* فشرده‌سازی ردیف‌های مراحل: فونت کوچک‌تر + actions inline + ارتفاع حداقل */
.stage-row { font-size: .8rem; }
/* contentGrid از flex-col استفاده می‌کند — اینجا به flex-row تبدیل می‌کنیم تا actions کنار محتوا باشد */
.stage-row > div > .flex-col { flex-direction: row !important; align-items: center !important; padding-top: .2rem !important; padding-bottom: .2rem !important; gap: .25rem !important; }
.stage-row > div > .flex-col > .flex-1 { min-width: 0 !important; }
.stage-row .fi-ta-actions { flex-shrink: 0 !important; }
.stage-row .fi-ta-text { padding-top: .15rem !important; padding-bottom: .15rem !important; }
.stage-row .fi-ta-col-wrp { gap: .15rem !important; }

/* تولتیپ چندخطی با فونت کوچک‌تر — هر گزارش زیر هم */
.fi-tooltip .tippy-content, .tippy-box .tippy-content { white-space: pre-line !important; font-size: .7rem !important; line-height: 1.5 !important; text-align: right; max-width: 360px; }

/* RM-068: تب‌های RelationManager — چند ردیفی برای جلوگیری از اسکرول افقی */
.fi-resource-relation-managers .fi-tabs { overflow-x: visible !important; flex-wrap: wrap !important; row-gap: .25rem; }

/* Fix: جهت فلش آکاردئون مراحل — بسته=↓، باز=↑ */
/* collapse button = مستقیم‌ترین فرزند fi-icon-btn در flex row (نه داخل fi-ta-actions) */
.stage-row > div > .fi-icon-btn.rotate-180 { transform: none !important; }
.stage-row:not(.fi-collapsed) > div > .fi-icon-btn { transform: rotate(180deg) !important; }

/* Fix: کلیک روی عنوان مرحله — نشانگر pointer */
.stage-name-col { cursor: pointer; }

/* ═══════════════════════════════════════════════════════════════
   BL-103 — فشرده‌سازی و حذف اسکرول افقی (کل پنل)
   ═══════════════════════════════════════════════════════════════ */

/* ── 1. جداول مراحل: متن‌چین فقط برای ردیف‌های stage (contentGrid) ── */
.stage-row .fi-ta-text { white-space: normal !important; word-break: break-word !important; }
.stage-row .fi-ta-text-item-label { white-space: normal !important; word-break: break-word !important; }

/* ── 2. جداول: کاهش padding ردیف‌ها (py-4 → py-1.5) ── */
.fi-ta-text, .fi-ta-icon, .fi-ta-color, .fi-ta-image { padding-top: .35rem !important; padding-bottom: .35rem !important; }
.fi-ta-actions-cell > div, .fi-ta-selection-cell > div { padding-top: .35rem !important; padding-bottom: .35rem !important; }
.fi-ta-record-checkbox { margin-top: .35rem !important; margin-bottom: .35rem !important; }

/* ── 3. جداول: toolbar و pagination فشرده‌تر ── */
.fi-ta-header-toolbar { padding-top: .4rem !important; padding-bottom: .4rem !important; }
.fi-ta-filters-above-content-ctn { padding-top: .4rem !important; padding-bottom: .4rem !important; }
.fi-ta-pagination { padding-top: .4rem !important; padding-bottom: .4rem !important; }

/* ── 4. Section: کاهش padding (p-6=1.5rem → .75rem) ── */
.fi-section-content { padding: .75rem !important; }
.fi-section-header { gap: .5rem !important; }

/* ── 5. InfoList entries: فشرده‌تر ── */
.fi-in-entry-wrp { padding-top: .2rem !important; padding-bottom: .2rem !important; }

/* ── 6. Stats widget: فشرده‌تر ── */
.fi-wi-stats-overview-stat { padding: .75rem !important; }
.fi-wi-stats-overview-stat-value { font-size: 1.75rem !important; line-height: 2rem !important; }

/* ── 7. Page header: کوچک‌تر ── */
.fi-header { gap: .5rem !important; }
.fi-header-heading { font-size: 1.25rem !important; line-height: 1.75rem !important; }

/* ═══════════════════════════════════════════════════════════════
   105-panel-ui-modernization — Responsive polish (US4 / T040)
   ═══════════════════════════════════════════════════════════════ */
@media (max-width: 400px) {
    .fi-wi-stats-overview-stats { grid-template-columns: 1fr !important; }
}
@media (min-width: 401px) and (max-width: 768px) {
    .fi-wi-stats-overview-stats { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}

/* ═══════════════════════════════════════════════════════════════
   bugfix — scroll-to-stage: افکت هایلایت موقت روی مرحله‌ای که از
   «کارهای من»/«تمام کارها»/بج «مرحله جاری» به آن اسکرول شده (scroll-to-stage.js)

   bugfix 2026-08-01: افکت قبلی رنگ `--color-accent` (آبی #0369A1) داشت و دقیقاً
   روی ردیف‌های مرحله‌ی فعال می‌نشست که خودشان از قبل `bg-blue-50`/`bg-violet-50`
   هستند — عملاً نامرئی بود. حالا کهربایی پررنگ + فلاشِ پس‌زمینه است تا روی هر دو
   رنگ ردیف کاملاً به چشم بیاید. (تغییرِ طول انیمیشن باید با HIGHLIGHT_MS در
   scroll-to-stage.js هماهنگ بماند.)
   ═══════════════════════════════════════════════════════════════ */
@keyframes stage-highlight-pulse {
    0%   { box-shadow: 0 0 0 0 rgba(217, 119, 6, .7); }
    70%  { box-shadow: 0 0 0 14px rgba(217, 119, 6, 0); }
    100% { box-shadow: 0 0 0 0 rgba(217, 119, 6, 0); }
}
@keyframes stage-highlight-bg {
    0%, 100% { background-color: rgba(253, 230, 138, 0); }
    30%, 70% { background-color: rgba(253, 230, 138, .9); }
}
.stage-highlight-flash {
    animation: stage-highlight-pulse 1.1s ease-out 3, stage-highlight-bg 1.6s ease-in-out 2;
    outline: 3px solid #D97706 !important;
    outline-offset: 2px;
    border-radius: var(--radius-card);
    /* بدون این دو، outline زیر ردیف‌های مجاور/کانتینر بریده می‌شود */
    position: relative;
    z-index: 5;
}

/* ═══════════════════════════════════════════════════════════════
   114-panel-ui-remaining-pages (RM-113/BL-143) — بازطراحی ساختاری صفحات باقیمانده
   منبع الهام: ui-ux-pro-max (سبک Data-Dense Dashboard + Executive Dashboard، research.md Decision 4)
   کلاس‌های زیر جایگزین تکرار دستی `rounded-xl bg-white shadow-sm ring-1 ring-gray-950/5
   dark:bg-gray-900 dark:ring-white/10` در ده‌ها فایل Blade می‌شوند — فقط ترکیب دوباره‌ی
   design tokens موجود (RM-104)، بدون تعریف رنگ/فاصله‌ی جدید.
   ═══════════════════════════════════════════════════════════════ */

/* -- کارت مشترک گزارش/جدول (shared/report-table-card.blade.php + shared/stat-card.blade.php) --
   بازبینی 2026-08-09: نسخه‌ی اول با شعاع/سایه‌ی قدیمی (rounded-xl/shadow-sm) تقریباً یکسان بود —
   از نظر کاربر تفاوت بصری محسوس نداشت. این نسخه عمداً متمایزتر است (شعاع بزرگ‌تر، سایه‌ی
   محسوس‌تر، نوار تأکیدی رنگی) تا هویت بصری جدید واقعاً قابل‌رؤیت باشد. */
.fl-report-card {
    background: #FFFFFF;
    border-radius: 16px;
    box-shadow: 0 8px 24px rgba(15, 23, 42, .10), 0 2px 6px rgba(15, 23, 42, .06);
    border: 1px solid var(--color-border);
    border-top: 3px solid var(--color-accent);
    overflow: hidden;
}
.fl-report-card__header {
    display: flex;
    align-items: center;
    gap: .6rem;
    padding: var(--space-2) var(--space-3);
    background: linear-gradient(to left, #FFFFFF, rgba(3, 105, 161, .06));
    border-bottom: 1px solid var(--color-border);
    font-weight: 700;
    font-size: var(--font-size-sm);
    color: var(--color-primary);
}
.fl-report-card__header .fl-report-card__icon {
    width: 1.5rem;
    height: 1.5rem;
    padding: .3rem;
    border-radius: 8px;
    background: rgba(3, 105, 161, .12);
    color: var(--color-accent);
    flex-shrink: 0;
    box-sizing: content-box;
}
.fl-report-card__body { padding: var(--space-3); }

/* -- کارت آماری (stat-card) -- */
.fl-stat-card {
    background: #FFFFFF;
    border-radius: 16px;
    box-shadow: 0 8px 24px rgba(15, 23, 42, .10), 0 2px 6px rgba(15, 23, 42, .06);
    border: 1px solid var(--color-border);
    border-top: 3px solid var(--color-accent);
    padding: var(--space-3) var(--space-2);
    text-align: center;
    transition: transform .15s ease, box-shadow .15s ease;
}
.fl-stat-card__label { font-size: var(--font-size-xs); font-weight: 600; color: var(--color-muted-fg); margin-bottom: .5rem; letter-spacing: .01em; }
.fl-stat-card__value { font-size: 2rem; line-height: 2.25rem; font-weight: 800; color: var(--color-primary); }
.fl-stat-card__sub { font-size: var(--font-size-xs); color: var(--color-muted-fg); margin-top: .4rem; }

/* -- کارت تنظیمات (فرم‌های صفحات Settings) -- */
.fl-settings-card {
    background: #FFFFFF;
    border-radius: 16px;
    box-shadow: 0 8px 24px rgba(15, 23, 42, .10), 0 2px 6px rgba(15, 23, 42, .06);
    border: 1px solid var(--color-border);
    border-top: 3px solid var(--color-accent);
    overflow: hidden;
}
.fl-settings-card__header {
    display: flex;
    align-items: center;
    gap: .6rem;
    padding: var(--space-2) var(--space-3);
    background: linear-gradient(to left, #FFFFFF, rgba(3, 105, 161, .06));
    border-bottom: 1px solid var(--color-border);
    font-weight: 700;
    color: var(--color-primary);
}
.fl-settings-card__header .fl-settings-card__icon {
    width: 1.5rem;
    height: 1.5rem;
    padding: .3rem;
    border-radius: 8px;
    background: rgba(3, 105, 161, .12);
    color: var(--color-accent);
    box-sizing: content-box;
}

/* گروه ۱ — گزارش‌های مالی: از کلاس‌های مشترک بالا استفاده می‌شود، بدون override اختصاصی */

/* گروه ۲ — حقوق و دستمزد + فب‌لب: از کلاس‌های مشترک بالا استفاده می‌شود، بدون override اختصاصی */

/* گروه ۳ — تنظیمات: از `.fl-settings-card` استفاده می‌شود، بدون override اختصاصی */

/* گروه ۴ — مهاجرت/فنی: تأکید بیشتر روی خوانایی جدول بزرگ (بدون اسکرول افقی) */
.fl-report-card--wide-table { overflow-x: auto; }
.fl-report-card--wide-table table { min-width: 100%; }

/* ═══════════════════════════════════════════════════════════════
   115-dashboard-sidebar-redesign — کارت Hero داشبورد + سایدبار تیره + بج رنگی آیکون
   کشف کلیدی (research.md Decision 1): Stat::make()->color() فقط description را رنگی
   می‌کند، نه آیکون اصلی — به همین دلیل بازطراحی‌های قبلی (RM-104/RM-113) که این ناحیه
   را لمس نکرده بودند، از نظر کاربر «بدون تغییر» به نظر می‌رسیدند.
   ═══════════════════════════════════════════════════════════════ */

/* -- کارت Hero (dashboard-hero-widget.blade.php) -- */
.fl-dashboard-hero {
    background: linear-gradient(135deg, #0F172A 0%, #1E3A5F 55%, #0369A1 100%);
    border-radius: 20px;
    padding: var(--space-3) var(--space-4);
    color: #FFFFFF;
    box-shadow: 0 12px 32px rgba(15, 23, 42, .22);
    margin-bottom: var(--space-2);
}
.fl-dashboard-hero__greeting { font-size: var(--font-size-xl); font-weight: 800; margin-bottom: .25rem; }
.fl-dashboard-hero__sub { font-size: var(--font-size-sm); color: rgba(255, 255, 255, .75); }
.fl-dashboard-hero__progress { margin-top: var(--space-2); max-width: 32rem; }
.fl-dashboard-hero__progress-label { display: flex; justify-content: space-between; font-size: var(--font-size-xs); color: rgba(255, 255, 255, .85); margin-bottom: .4rem; }
.fl-dashboard-hero__progress-percent { font-weight: 700; }
.fl-dashboard-hero__progress-track { height: 8px; border-radius: 999px; background: rgba(255, 255, 255, .18); overflow: hidden; }
.fl-dashboard-hero__progress-bar { height: 100%; border-radius: 999px; background: #38BDF8; transition: width .3s ease; }

/* -- بج رنگی آیکون کارت‌های آماری داشبورد (فقط .fi-dashboard-page — اسکوپ‌شده، الگوی موقعیتی nth-child) --
   رنگ‌بندی semantic موجود (description، شرطی) دست‌نخورده می‌ماند — این فقط رنگ تزئینی آیکون است. */
.fi-dashboard-page .fi-wi-stats-overview-stats-ctn > div .fi-wi-stats-overview-stat-icon {
    border-radius: 10px;
    padding: .4rem;
    box-sizing: content-box;
}
.fi-dashboard-page .fi-wi-stats-overview-stats-ctn > div:nth-of-type(5n+1) .fi-wi-stats-overview-stat-icon { background: rgba(3, 105, 161, .14) !important; color: #0369A1 !important; }
.fi-dashboard-page .fi-wi-stats-overview-stats-ctn > div:nth-of-type(5n+2) .fi-wi-stats-overview-stat-icon { background: rgba(124, 58, 237, .14) !important; color: #7C3AED !important; }
.fi-dashboard-page .fi-wi-stats-overview-stats-ctn > div:nth-of-type(5n+3) .fi-wi-stats-overview-stat-icon { background: rgba(13, 148, 136, .14) !important; color: #0D9488 !important; }
.fi-dashboard-page .fi-wi-stats-overview-stats-ctn > div:nth-of-type(5n+4) .fi-wi-stats-overview-stat-icon { background: rgba(217, 119, 6, .14) !important; color: #D97706 !important; }
.fi-dashboard-page .fi-wi-stats-overview-stats-ctn > div:nth-of-type(5n+5) .fi-wi-stats-overview-stat-icon { background: rgba(22, 163, 74, .14) !important; color: #16A34A !important; }

/* -- سایدبار تیره (کلاس‌های دقیق Filament — ر.ک. research.md Decision 3) --
   darkMode() سراسری Filament فعال نمی‌شود؛ فقط پس‌زمینه/متن خودِ سایدبار override می‌شود.
   بازبینی 2026-08-09 (bugfix خوانایی): `.fi-sidebar-item-label` و `.fi-sidebar-group-icon`
   کلاس رنگ Tailwind (`text-gray-700`/`text-gray-400`) را مستقیماً روی خودشان دارند، نه فقط
   ارث‌بری از `<a>` والد — override قبلی روی `.fi-sidebar-item-button` برای این عنصرهای فرزند
   اثر نمی‌کرد (رنگ مستقیم روی خودِ عنصر همیشه بر ارث‌بری از والد اولویت دارد)، پس متن منو
   خاکستری‌تیره‌ی نامرئی روی پس‌زمینه‌ی سرمه‌ای باقی مانده بود. اکنون هر عنصر متنی/آیکون
   مستقیماً و جداگانه هدف قرار می‌گیرد. */
.fi-sidebar {
    background: var(--color-primary) !important;
}
.fi-sidebar-header {
    background: var(--color-primary) !important;
    box-shadow: none !important;
    border-color: rgba(255, 255, 255, .08) !important;
}
.fi-sidebar-group-label {
    color: rgba(255, 255, 255, .5) !important;
}
.fi-sidebar-group-icon {
    color: rgba(255, 255, 255, .55) !important;
}
.fi-sidebar-group-collapse-button {
    color: rgba(255, 255, 255, .5) !important;
}
.fi-sidebar-item-button {
    color: rgba(255, 255, 255, .82) !important;
}
.fi-sidebar-item-label {
    color: rgba(255, 255, 255, .82) !important;
}
.fi-sidebar-item-icon {
    color: rgba(255, 255, 255, .55) !important;
}
.fi-sidebar-item:hover .fi-sidebar-item-button,
.fi-sidebar-item:focus-visible .fi-sidebar-item-button {
    background: rgba(255, 255, 255, .08) !important;
}
.fi-sidebar-item-active .fi-sidebar-item-button {
    background: rgba(255, 255, 255, .14) !important;
}
.fi-sidebar-item-active .fi-sidebar-item-button,
.fi-sidebar-item-active .fi-sidebar-item-icon,
.fi-sidebar-item-active .fi-sidebar-item-label {
    color: #FFFFFF !important;
    font-weight: 600 !important;
}
.fi-sidebar-item-grouped-border {
    background: rgba(255, 255, 255, .18) !important;
}
/* نقطه‌ی وسط nested-item (bg-gray-400/bg-primary-600 در item.blade.php خط 89-90) */
.fi-sidebar-item-grouped-border > div:last-child {
    background: rgba(255, 255, 255, .35) !important;
}
.fi-sidebar-item-active .fi-sidebar-item-grouped-border > div:last-child {
    background: #FFFFFF !important;
}

/* -- Section «خلاصه مالی» در ViewCase — کادر رنگی + چراغ وضعیت (bugfix UX، 2026-08-10) --
   سه حالت mutually exclusive (ر.ک. ViewCase::getFinancialSummaryState()):
   settled=تسویه کامل (سبز)، overdue=بدهی سررسیدشده (صورتی + چراغ چشمک‌زن)، neutral=مطالبات
   سررسیدنشده یا بدون قرارداد (خاکستری). فقط این یک Section هدف است — رنگ‌های semantic دیگر
   (وضعیت مراحل RM-060/BL-118، هشدار مانده منفی FR-007/008) دست‌نخورده می‌مانند. */
.fl-fin-summary--settled {
    background-color: #F0FDF4 !important;
    border: 1px solid #86EFAC !important;
}
.fl-fin-summary--overdue {
    background-color: #FDF2F8 !important;
    border: 1px solid #F9A8D4 !important;
}
.fl-fin-summary--neutral {
    background-color: #F9FAFB !important;
    border: 1px solid #E5E7EB !important;
}
.fl-fin-light {
    display: inline-block;
    width: .65rem;
    height: .65rem;
    border-radius: 9999px;
    margin-inline-start: .5rem;
    vertical-align: middle;
}
.fl-fin-light--green {
    background: #22C55E;
    box-shadow: 0 0 0 3px rgba(34, 197, 94, .2);
}
.fl-fin-light--gray {
    background: #9CA3AF;
    box-shadow: 0 0 0 3px rgba(156, 163, 175, .18);
}
.fl-fin-light--red {
    background: #EF4444;
    animation: fl-fin-blink 1.2s ease-in-out infinite;
}
@keyframes fl-fin-blink {
    0%, 100% { opacity: 1; box-shadow: 0 0 0 3px rgba(239, 68, 68, .35); }
    50% { opacity: .35; box-shadow: 0 0 0 3px rgba(239, 68, 68, 0); }
}