@font-face {
    font-family: 'Vazirmatn';
    src: url('/fonts/Vazirmatn-400.woff2') format('woff2');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Vazirmatn';
    src: url('/fonts/Vazirmatn-500.woff2') format('woff2');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Vazirmatn';
    src: url('/fonts/Vazirmatn-600.woff2') format('woff2');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Vazirmatn';
    src: url('/fonts/Vazirmatn-700.woff2') format('woff2');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Vazirmatn';
    src: url('/fonts/Vazirmatn-800.woff2') format('woff2');
    font-weight: 800;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Inter';
    src: url('/fonts/Inter-400.woff2') format('woff2');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Inter';
    src: url('/fonts/Inter-500.woff2') format('woff2');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Inter';
    src: url('/fonts/Inter-600.woff2') format('woff2');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Inter';
    src: url('/fonts/Inter-700.woff2') format('woff2');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

body, * {
    font-family: var(--afr-font-family), 'Vazirmatn', 'Inter', Tahoma, Arial, sans-serif !important;
}

/* نقاط محو پس‌زمینه (Login — SelectDateCompany در SelectDateCompany.razor.css) */
.bg-blur {
    position: absolute;
    z-index: 1;
    border-radius: 50%;
    filter: blur(80px); /* بلور بیشتر برای نرمی بیشتر */
    opacity: 0.35;
    pointer-events: none;
}

    .bg-blur.red {
        width: 240px;
        height: 160px;
        background: radial-gradient(circle, #ea4261 50%, transparent 100%);
        top: 80px;
        left: 2vw;
    }

    .bg-blur.yellow {
        width: 160px;
        height: 120px;
        background: radial-gradient(circle, #fad623 60%, transparent 100%);
        top: 40vh;
        right: 8vw;
    }

    .bg-blur.blue {
        width: 300px;
        height: 200px;
        background: radial-gradient(circle, #2bc0fa 65%, transparent 100%);
        bottom: 4vh;
        left: 30vw;
    }

/* استایل کلی ظرف داشبورد */
.dashboard-container {
    padding: 30px;
}

.dashboard-title {
    color: #ffffff;
    font-weight: 800;
    text-shadow: 0 0 20px rgba(255,255,255,0.2);
}

.dashboard-subtitle {
    color: #a0a0a0;
}

/* استایل کارت‌های KPI */
.kpi-card {
    padding: 24px;
    background: rgba(255, 255, 255, 0.03) !important;
    backdrop-filter: blur(15px);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 16px;
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

    .kpi-card:hover {
        transform: translateY(-8px);
        background: rgba(255, 255, 255, 0.06) !important;
    }

.kpi-content {
    display: flex;
    align-items: center;
    gap: 20px;
}

.kpi-icon {
    font-size: 3rem !important;
    opacity: 0.8;
}

.kpi-number {
    font-size: 1.8rem;
    font-weight: 900;
    color: white;
    font-family: var(--afr-font-family), sans-serif;
}

.kpi-label {
    color: #b0b0b0;
    font-size: 0.9rem;
}

/* افکت‌های نوری اختصاصی برای هر کارت */
.sales-glow {
    border-right: 4px solid #00c853;
    box-shadow: 0 10px 30px rgba(0, 200, 83, 0.1);
}

    .sales-glow .kpi-icon {
        color: #00c853;
    }

.bpms-glow {
    border-right: 4px solid #2979ff;
    box-shadow: 0 10px 30px rgba(41, 121, 255, 0.1);
}

    .bpms-glow .kpi-icon {
        color: #2979ff;
    }

.warning-glow {
    border-right: 4px solid #ff9100;
    box-shadow: 0 10px 30px rgba(255, 145, 0, 0.1);
}

    .warning-glow .kpi-icon {
        color: #ff9100;
    }

/* استایل کارت نمودار */
.chart-card {
    padding: 30px;
    background: rgba(20, 20, 30, 0.5) !important;
    border-radius: 20px;
    border: 1px solid rgba(255,255,255,0.05);
}

.chart-title {
    color: white;
    border-bottom: 1px solid rgba(255,255,255,0.1);
    padding-bottom: 10px;
}
/* استایل شیشه‌ای هدر — جزئیات در shell-chrome.css */
.main-appbar {
    backdrop-filter: blur(12px);
}

.brand-name {
    font-weight: 800 !important;
    letter-spacing: 0.5px;
    color: var(--afr-chrome-text, #008cce);
}

.header-logo-section {
    display: flex;
    align-items: center;
}

/* استایل اطلاعات کاربر و شرکت */
.session-info-container {
    background: rgba(255, 255, 255, 0.05);
    padding: 4px 16px;
    border-radius: 50px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.info-item {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.info-label {
    font-size: 0.65rem;
    color: var(--afr-session-label, #64748b);
}

.info-value {
    font-size: 0.8rem;
    color: var(--afr-session-value, #008cce);
    font-weight: 600;
}

.info-divider {
    width: 1px;
    height: 20px;
    background: var(--afr-chrome-divider, rgba(0, 140, 206, 0.12));
}

.session-info-pill {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 6px 14px;
    border-radius: var(--afr-radius-pill, 999px);
    background: color-mix(in srgb, var(--afr-brand-primary, #008cce) 10%, transparent);
    border: 1px solid color-mix(in srgb, var(--afr-brand-primary, #008cce) 22%, transparent);
}

.session-info-pill--compact {
    gap: 6px;
    padding: 6px 10px;
    max-width: min(52vw, 220px);
}

.session-info-pill__compact-text {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--afr-chrome-text, #0f172a);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.header-actions {
    display: flex;
    align-items: center;
}
/* تنظیم چیدمان بخش راست (لوگو و منو) */
.header-right-section {
    display: flex;
    align-items: center;
    gap: 8px;
}

.header-logo {
    height: 32px;
    width: auto;
    margin-right: 5px; /* فاصله لوگو از دکمه منو */
    filter: drop-shadow(0 0 5px rgba(126, 111, 255, 0.4));
}

/* استایل جدید پروفایل کاربر */
.user-profile-wrapper {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 0 15px;
    border-left: 1px solid rgba(255, 255, 255, 0.1);
    margin-left: 5px;
}

.user-text-info {
    display: flex;
    flex-direction: column;
    align-items: flex-start; /* متون را از سمت راست (در RTL) تراز می‌کند */
    text-align: left;
}

.user-name {
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--afr-user-name, #0f172a);
    line-height: 1.2;
}

.user-code {
    font-size: 0.75rem;
    color: var(--afr-user-code, #4d535a);
    font-family: var(--afr-font-family), 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    letter-spacing: 0.5px;
}

.user-avatar {
    border: 1px solid rgba(126, 111, 255, 0.3) !important;
    background: rgba(126, 111, 255, 0.1);
}

/* اصلاح تراز کپسول وسط برای مانیتورهای کوچک */
@media (max-width: 1200px) {
    .session-info-pill {
        padding: 4px 10px;
        gap: 8px;
    }

    .info-block {
        min-width: 60px;
    }
}
/* ظرف اصلی سمت چپ هدر */
.header-left-section {
    display: flex;
    align-items: center; /* تراز کردن همه اجزا در مرکز عمودی */
    gap: 5px;
    height: 100%;
}

/* خط جداکننده عمودی بین آیکون‌ها */
.vertical-divider {
    width: 1px;
    height: 24px;
    background: var(--afr-chrome-divider, rgba(0, 1, 110, 0.12));
    margin: 0 8px;
}

/* استایل پروفایل کاربر */
.user-profile-wrapper {
    display: flex;
    align-items: center; /* تراز کردن متن و آواتار در یک ردیف */
    gap: 10px;
    padding-left: 5px;
}

.user-text-info {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    line-height: 1.1; /* چسباندن نام و کد به هم برای جا شدن در هدر */
}

.user-name {
    font-size: 0.8rem !important;
    font-weight: 600;
    color: var(--afr-user-name, #0f172a);
    white-space: nowrap;
}

.user-code {
    font-size: 0.7rem !important;
    color: var(--afr-user-code, #4d535a);
    font-family: var(--afr-font-family), 'Segoe UI', Tahoma, sans-serif;
}

.user-avatar-small {
    width: 28px !important;
    height: 28px !important;
    background: rgba(126, 111, 255, 0.2) !important;
    border: 1px solid rgba(126, 111, 255, 0.4) !important;
}

.user-profile-menu-trigger {
    cursor: pointer;
}

/* اصلاح کلی هدر برای اطمینان از تراز بودن */
.main-appbar .mud-toolbar {
    padding-left: 16px;
    padding-right: 16px;
    min-height: 64px; /* ارتفاع استاندارد هدر */
    display: flex;
    align-items: center;
}
/* ===== Company session guard (freeze workspace until company selected) ===== */

.main-content-with-session-guard {
    position: relative;
}

.session-blocker-overlay {
    position: absolute;
    inset: 0;
    z-index: 1200;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(10, 12, 20, 0.72);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    pointer-events: all;
}

.session-blocker-overlay__text {
    color: rgba(255, 255, 255, 0.92);
    text-align: center;
    padding: 12px 20px;
    border-radius: 12px;
    background: rgba(30, 30, 45, 0.65);
    border: 1px solid rgba(255, 255, 255, 0.12);
}

/* ظرف اصلی پنل ها */
.tabpanel {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 20px;
    padding: 20px;
    direction: rtl;
}

/* استایل کارت‌های هر فرآیند */
.tabchildstyle {
    background: rgba(255, 255, 255, 0.05); /* افکت شیشه‌ای */
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 16px;
    padding: 20px;
    transition: all 0.3s ease;
    display: flex;
    flex-direction: column;
    box-shadow: 0 4px 15px rgba(0,0,0,0.2);
}

    .tabchildstyle:hover {
        transform: translateY(-5px);
        border-color: #00a8ff; /* آبی روشن برگرفته از لوگو */
        box-shadow: 0 8px 25px rgba(0, 168, 255, 0.15);
    }

/* تیتر هر فرآیند */
.childheader {
    font-size: 1.1rem;
    font-weight: 700;
    color: #ffffff;
    margin-bottom: 15px;
    border-right: 4px solid #00a8ff;
    padding-right: 12px;
    display: block;
}

/* کانتینر دکمه‌ها */
.buttonsContainer {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

/* استایل دکمه‌ها */
.buttonstyle {
    background: rgba(0, 168, 255, 0.1) !important;
    border: 1px solid rgba(0, 168, 255, 0.3) !important;
    color: #e0e0e0 !important;
    border-radius: 10px !important;
    font-size: 0.85rem !important;
    padding: 6px 14px !important;
    text-transform: none !important;
    transition: all 0.2s !important;
}

    .buttonstyle:hover {
        background: #00a8ff !important;
        color: white !important;
        box-shadow: 0 0 12px rgba(0, 168, 255, 0.5);
    }

/* استایل هدر تب ها در سمت راست */
::deep .mud-tabs-tabbar-vertical {
    border-left: 1px solid rgba(255,255,255,0.1);
    background: rgba(15, 18, 30, 0.5);
}

::deep .mud-tab {
    justify-content: flex-start !important;
    padding: 12px 24px !important;
    min-height: 50px !important;
    color: #9e9e9e !important;
}

::deep .mud-tab-active {
    color: #00a8ff !important;
    background: rgba(0, 168, 255, 0.05);
    font-weight: bold;
}

/* کانتینر اصلی صفحه */
.signature-page {
    padding: 24px;
    background: transparent;
}

/* پنل فیلترها با استایل Glassmorphism */
.filter-section {
    background: rgba(35, 40, 65, 0.6) !important;
    backdrop-filter: blur(12px);
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    border-radius: 20px !important;
    margin-bottom: 24px;
    padding: 20px !important;
}

/* استایل خاص برای Toggle Group وضعیت‌ها */
::deep .mud-toggle-group {
    background: rgba(0, 0, 0, 0.2);
    border-radius: 12px;
    padding: 4px;
}

::deep .mud-toggle-item {
    border-radius: 10px !important;
    margin: 0 2px;
    transition: all 0.3s ease;
}

/* استایل مدرن جدول */
::deep .mud-table {
    background: rgba(30, 35, 55, 0.5) !important;
    border-radius: 20px !important;
    border: 1px solid rgba(255, 255, 255, 0.05) !important;
}

::deep .mud-table-head {
    background: rgba(255, 255, 255, 0.03) !important;
}

::deep .mud-table-row {
    transition: background 0.2s;
}

    ::deep .mud-table-row:hover {
        background: rgba(0, 168, 255, 0.05) !important;
    }


/* استایل چیپ‌های وضعیت */
.status-chip {
    font-weight: 600;
    letter-spacing: 0.5px;
    padding: 0 12px !important;
}

/*--------------------------------------------------------------------------------*/
/* حذف رنگ بنفش و جایگزینی با آبی برند */
:root {
    --brand-blue: #00A8FF;
    --brand-blue-hover: #0086cc;
    --surface-light: rgba(255, 255, 255, 0.05);
}

/* اصلاح استایل دکمه جستجو */
.search-btn {
    background-color: var(--brand-blue) !important;
    color: white !important;
    height: 54px;
    border-radius: 12px !important;
    font-weight: bold;
    transition: all 0.3s ease;
}

    .search-btn:hover {
        background-color: var(--brand-blue-hover) !important;
        box-shadow: 0 0 15px rgba(0, 168, 255, 0.4) !important;
        transform: translateY(-1px);
    }

/* اصلاح Toggle Group (حذف بنفش) */
::deep .mud-toggle-group {
    background: rgba(0, 0, 0, 0.2) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
}

::deep .mud-toggle-item.mud-selected {
    background-color: var(--brand-blue) !important;
    color: white !important;
}

/* استایل فیلد تاریخ */
::deep .modern-datepicker .mud-input-control {
    background: var(--surface-light);
    border-radius: 12px;
    padding: 4px 12px;
    border: 1px solid rgba(255, 255, 255, 0.1);
}

::deep .mud-input-adornment-start {
    color: var(--brand-blue) !important;
}
/* BPMS — fallback when scoped bundle is stale; primary: OperateAnbarFactor.razor.css */
@import url('_content/Afrandeh.UI.Shared/Afrandeh.UI.Shared.bundle.scp.css');

/* =====================================================
   CRM Operation - استایل‌های کانبان
   این بلوک را به انتهای فایل site.css اضافه کنید
   ===================================================== */

/* ===== صفحه اصلی ===== */
.crm-page {
    padding: 24px 28px;
    direction: rtl;
}

.crm-page-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    margin-bottom: 24px;
}

.crm-title {
    font-size: 22px;
    font-weight: 800;
    color: #ffffff;
    letter-spacing: -0.3px;
}

.crm-subtitle {
    font-size: 12px;
    color: rgba(255, 255, 255, 0.35);
    margin-top: 4px;
}

/* ===== تب‌بار ===== */
.crm-tabheader {
    background: rgba(10, 13, 20, 0.7) !important;
    border-left: 1px solid rgba(255, 255, 255, 0.06) !important;
}

.crm-tab-item {
    justify-content: flex-start !important;
    padding: 10px 20px !important;
    min-height: 46px !important;
    color: rgba(255, 255, 255, 0.45) !important;
    font-size: 13px !important;
    border-right: 3px solid transparent !important;
    transition: all 0.2s ease !important;
}

    .crm-tab-item:hover {
        color: rgba(255, 255, 255, 0.8) !important;
        background: rgba(255, 255, 255, 0.03) !important;
    }

.mud-tab-active.crm-tab-item {
    color: #00a8ff !important;
    background: rgba(0, 168, 255, 0.06) !important;
    border-right-color: #00a8ff !important;
    font-weight: 700 !important;
}

.crm-tabpanel-wrapper {
    padding: 0 !important;
}

/* ===== کانتینر کانبان ===== */
.crm-kanban-container {
    display: flex !important;
    flex-direction: row !important;
    gap: 14px !important;
    padding: 20px !important;
    overflow-x: auto;
    align-items: flex-start;
    min-height: 500px;
}

    /* اسکرول افقی زیبا */
    .crm-kanban-container::-webkit-scrollbar {
        height: 6px;
    }

    .crm-kanban-container::-webkit-scrollbar-track {
        background: rgba(255,255,255,0.03);
        border-radius: 4px;
    }

    .crm-kanban-container::-webkit-scrollbar-thumb {
        background: rgba(255,255,255,0.12);
        border-radius: 4px;
    }

/* ===== ستون کانبان (یکسان) ===== */
.crm-column {
    flex: 1 1 0;
    min-width: 220px;
    max-width: 280px;
    border-radius: 14px;
    background: rgba(20, 24, 36, 0.7);
    border: 1px solid rgba(255, 255, 255, 0.07);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    transition: box-shadow 0.2s;
}

/* ===== هدر ستون ===== */
.crm-column-header {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 14px 16px 12px;
    border-bottom: 1px solid rgba(255,255,255,0.05);
    position: relative;
}

/* نوار رنگی بالای ستون */
.crm-column-accent {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    height: 3px;
    border-radius: 14px 14px 0 0;
}

.crm-column-title {
    font-size: 13px;
    font-weight: 700;
    color: #e0e0e0;
    flex: 1;
}

.crm-column-badge {
    font-size: 11px;
    font-weight: 700;
    padding: 2px 9px;
    border-radius: 20px;
    background: rgba(255,255,255,0.07);
    color: rgba(255,255,255,0.5);
}

/* ===== DropZone ===== */
.crm-dropzone {
    padding: 10px !important;
    flex: 1;
    min-height: 200px !important;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

/* ===== کارت آیتم ===== */
.crm-card {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.08);
    cursor: pointer;
    transition: all 0.2s ease;
    direction: rtl;
    width: 100%;
}

    .crm-card:hover {
        background: rgba(255, 255, 255, 0.09);
        border-color: rgba(255, 255, 255, 0.18);
        transform: translateY(-2px);
        box-shadow: 0 6px 18px rgba(0,0,0,0.3);
    }

.crm-card-avatar {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    font-weight: 700;
    flex-shrink: 0;
    background: rgba(0, 168, 255, 0.15);
    color: #4dc8ff;
    border: 1px solid rgba(0, 168, 255, 0.25);
}

.crm-card-info {
    display: flex;
    flex-direction: column;
    gap: 2px;
    flex: 1;
    min-width: 0;
}

.crm-card-name {
    font-size: 12.5px;
    font-weight: 600;
    color: #e0e0e0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.crm-card-sub {
    font-size: 10.5px;
    color: rgba(255,255,255,0.3);
}

.crm-card-arrow {
    font-size: 18px;
    color: rgba(255,255,255,0.2);
    flex-shrink: 0;
}

/* ===== رنگ‌های ستون ===== */

/* آبی */
.crm-col-blue .crm-column-accent {
    background: linear-gradient(90deg, #00a8ff, #0077cc);
}

.crm-col-blue .crm-column-header {
    background: rgba(0, 168, 255, 0.05);
}

.crm-col-blue .crm-column-badge {
    background: rgba(0,168,255,0.15);
    color: #5ecfff;
}

.crm-col-blue {
    border-top: none;
    box-shadow: 0 0 0 1px rgba(0,168,255,0.15);
}

    .crm-col-blue:hover {
        box-shadow: 0 8px 28px rgba(0,168,255,0.12), 0 0 0 1px rgba(0,168,255,0.25);
    }

/* بنفش */
.crm-col-purple .crm-column-accent {
    background: linear-gradient(90deg, #7c6bff, #5040cc);
}

.crm-col-purple .crm-column-header {
    background: rgba(124, 107, 255, 0.05);
}

.crm-col-purple .crm-column-badge {
    background: rgba(124,107,255,0.15);
    color: #b09fff;
}

.crm-col-purple {
    border-top: none;
    box-shadow: 0 0 0 1px rgba(124,107,255,0.15);
}

    .crm-col-purple:hover {
        box-shadow: 0 8px 28px rgba(124,107,255,0.12), 0 0 0 1px rgba(124,107,255,0.25);
    }

/* فیروزه‌ای */
.crm-col-teal .crm-column-accent {
    background: linear-gradient(90deg, #00bcd4, #00838f);
}

.crm-col-teal .crm-column-header {
    background: rgba(0, 188, 212, 0.05);
}

.crm-col-teal .crm-column-badge {
    background: rgba(0,188,212,0.15);
    color: #4dd8ed;
}

.crm-col-teal {
    border-top: none;
    box-shadow: 0 0 0 1px rgba(0,188,212,0.15);
}

    .crm-col-teal:hover {
        box-shadow: 0 8px 28px rgba(0,188,212,0.12), 0 0 0 1px rgba(0,188,212,0.25);
    }

/* نارنجی */
.crm-col-orange .crm-column-accent {
    background: linear-gradient(90deg, #ff9100, #cc6d00);
}

.crm-col-orange .crm-column-header {
    background: rgba(255, 145, 0, 0.05);
}

.crm-col-orange .crm-column-badge {
    background: rgba(255,145,0,0.15);
    color: #ffba55;
}

.crm-col-orange {
    border-top: none;
    box-shadow: 0 0 0 1px rgba(255,145,0,0.15);
}

    .crm-col-orange:hover {
        box-shadow: 0 8px 28px rgba(255,145,0,0.12), 0 0 0 1px rgba(255,145,0,0.25);
    }

/* سبز */
.crm-col-green .crm-column-accent {
    background: linear-gradient(90deg, #00c853, #00922a);
}

.crm-col-green .crm-column-header {
    background: rgba(0, 200, 83, 0.05);
}

.crm-col-green .crm-column-badge {
    background: rgba(0,200,83,0.15);
    color: #4de88a;
}

.crm-col-green {
    border-top: none;
    box-shadow: 0 0 0 1px rgba(0,200,83,0.15);
}

    .crm-col-green:hover {
        box-shadow: 0 8px 28px rgba(0,200,83,0.12), 0 0 0 1px rgba(0,200,83,0.25);
    }

/* صورتی */
.crm-col-pink .crm-column-accent {
    background: linear-gradient(90deg, #e91e8c, #a80060);
}

.crm-col-pink .crm-column-header {
    background: rgba(233, 30, 140, 0.05);
}

.crm-col-pink .crm-column-badge {
    background: rgba(233,30,140,0.15);
    color: #ff6ec7;
}

.crm-col-pink {
    border-top: none;
    box-shadow: 0 0 0 1px rgba(233,30,140,0.15);
}

    .crm-col-pink:hover {
        box-shadow: 0 8px 28px rgba(233,30,140,0.12), 0 0 0 1px rgba(233,30,140,0.25);
    }

/* آواتار کارت — رنگ متناسب با ستون */
.crm-col-purple .crm-card-avatar {
    background: rgba(124,107,255,0.15);
    color: #b09fff;
    border-color: rgba(124,107,255,0.25);
}

.crm-col-teal .crm-card-avatar {
    background: rgba(0,188,212,0.15);
    color: #4dd8ed;
    border-color: rgba(0,188,212,0.25);
}

.crm-col-orange .crm-card-avatar {
    background: rgba(255,145,0,0.15);
    color: #ffba55;
    border-color: rgba(255,145,0,0.25);
}

.crm-col-green .crm-card-avatar {
    background: rgba(0,200,83,0.15);
    color: #4de88a;
    border-color: rgba(0,200,83,0.25);
}

.crm-col-pink .crm-card-avatar {
    background: rgba(233,30,140,0.15);
    color: #ff6ec7;
    border-color: rgba(233,30,140,0.25);
}

/* ===== لودینگ ===== */
.crm-loading {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 300px;
    gap: 16px;
}

.crm-loading-text {
    font-size: 13px;
    color: rgba(255,255,255,0.35);
}