@font-face {
        font-family: iransans;
        src: url('/style/fonts/woff2/IRANSansWeb(FaNum).woff2') format('woff2');
        font-weight: 400;
        font-display: swap;
    }
    @font-face {
        font-family: iransans;
        src: url('/style/fonts/woff2/IRANSansWeb(FaNum)_Medium.woff2') format('woff2');
        font-weight: 500;
        font-display: swap;
    }
    @font-face {
        font-family: iransans;
        src: url('/style/fonts/woff2/IRANSansWeb(FaNum)_Bold.woff2') format('woff2');
        font-weight: 700;
        font-display: swap;
    }
    :root {
        --crm-bg: #f3f6fb;
        --crm-surface: #ffffff;
        --crm-navy: #224d76;
        --crm-navy-soft: #2f688f;
        --crm-gold: #f6b422;
        --crm-teal: #61d3d1;
        --crm-text: #274b73;
        --crm-muted: #7e93ad;
        --crm-border: #e6edf7;
        --zarrin-header: #63cac8;
    }
    body,
    a,
    input,
    button,
    select,
    textarea {
        font-family: iransans, Tahoma, sans-serif !important;
    }
    body {
        background-color: var(--crm-bg);
        font-size: 14px;
        color: #274b73;
        line-height: 1.6;
    }
    .uk-notification-message .crm-toast-success {
        direction: rtl;
        text-align: right;
        display: block;
        color: #14765f;
        background: #f4fffb;
        border: 1px solid #58c9a7;
        border-right-width: 5px;
        border-radius: 8px;
        padding: 12px 16px;
        box-shadow: 0 10px 26px rgba(39, 75, 115, 0.12);
        font-weight: 700;
    }
    .uk-notification-message-success {
        direction: rtl;
        background: transparent !important;
        box-shadow: none;
        border: 0;
        padding: 0;
    }
    .uk-notification-message-success .crm-toast-success {
        padding-left: 44px;
    }
    .uk-notification-message-success .uk-notification-close {
        right: auto;
        left: 12px;
        top: 50%;
        transform: translateY(-50%);
        background: transparent !important;
        border: 0;
        color: #14765f;
        opacity: .75;
        padding: 4px;
        border-radius: 0;
    }
    .uk-notification-message-success .uk-notification-close:hover {
        background: transparent !important;
        color: #0f5f4e;
        opacity: 1;
    }
    .crm-data-table {
        border-collapse: separate;
        border-spacing: 0;
        overflow: hidden;
        border: 1px solid #d9e5f2;
        border-radius: 10px;
        background: #ffffff;
        box-shadow: 0 10px 26px rgba(39, 75, 115, 0.08);
    }
    .crm-person-list-card {
        border-radius: 12px;
        border: 1px solid #dde8f4;
        box-shadow: 0 12px 30px rgba(39, 75, 115, 0.08);
    }
    .crm-list-toolbar {
        display: grid;
        grid-template-columns: minmax(170px, 1fr) minmax(260px, 420px) auto;
        align-items: center;
        gap: 12px;
        margin-bottom: 14px;
        padding: 10px;
        background: #f8fbff;
        border: 1px solid #e1ebf6;
        border-radius: 10px;
    }
    .crm-list-toolbar h3 {
        margin: 0;
        color: var(--crm-navy);
        font-size: 22px;
        font-weight: 800;
        line-height: 1.35;
    }
    .crm-list-toolbar span {
        display: block;
        margin-top: 3px;
        color: var(--crm-muted);
        font-size: 12px;
        font-weight: 500;
    }
    .crm-list-search {
        height: 52px;
        display: grid;
        grid-template-columns: 40px 1fr;
        align-items: center;
        margin-bottom: 0 !important;
        background: #ffffff;
        border: 1px solid #d7e4f1;
        border-radius: 12px;
        padding: 0 12px;
    }
    .crm-list-search input {
        width: 100%;
        height: 50px;
        border: 0;
        outline: 0;
        background: transparent;
        color: var(--crm-text);
        font-size: 18px;
        font-weight: 600;
    }
    .crm-list-add {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        height: 52px !important;
        line-height: 1 !important;
        border-radius: 12px;
        padding: 0 24px;
        white-space: nowrap;
        background: var(--crm-navy-soft);
        border: 1px solid #245e86;
        font-weight: 700;
        font-size: 18px;
    }
    .crm-data-table thead th {
        background: #edf5fb;
        color: #214d74;
        font-weight: 800;
        border-bottom: 1px solid #d6e3f0;
        white-space: nowrap;
        text-align: right;
    }
    .crm-data-table tbody tr:nth-child(odd) {
        background: #ffffff;
    }
    .crm-data-table tbody tr:nth-child(even) {
        background: #f7fbff;
    }
    .crm-data-table tbody tr {
        transition: background-color .18s ease, box-shadow .18s ease, transform .18s ease;
    }
    .crm-data-table.uk-table-hover tbody tr:hover,
    .crm-data-table tbody tr:hover {
        background: #eef9f8 !important;
        box-shadow: inset 4px 0 0 #61d3d1;
        transform: translateY(-1px);
    }
    .crm-data-table td,
    .crm-data-table th {
        border-bottom: 1px solid #dce7f3;
        vertical-align: middle;
    }
    .crm-data-table tbody tr:last-child td {
        border-bottom: 0;
    }
    .financial-bedehi-page {
        direction: rtl;
        padding: 8px 0 36px;
    }
    .financial-report-card {
        overflow: hidden;
        border: 1px solid #d7e5f2;
        border-radius: 14px;
        background: #ffffff;
        box-shadow: 0 18px 44px rgba(36, 59, 90, 0.1);
    }
    .financial-report-head {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 16px;
        padding: 18px 20px;
        background: linear-gradient(135deg, #f8fbff 0%, #eef9f8 100%);
        border-bottom: 1px solid #dce9f5;
    }
    .financial-report-eyebrow {
        display: inline-flex;
        align-items: center;
        height: 24px;
        padding: 0 10px;
        border-radius: 999px;
        background: #dff6f2;
        color: #14796d;
        font-size: 12px;
        font-weight: 800;
    }
    .financial-report-head h3 {
        margin: 8px 0 0;
        color: var(--crm-navy);
        font-size: 22px;
        font-weight: 900;
        line-height: 1.35;
    }
    .financial-report-stats {
        display: flex;
        gap: 10px;
        flex-wrap: wrap;
    }
    .financial-report-stats div {
        min-width: 112px;
        padding: 10px 12px;
        border: 1px solid #d7e7f4;
        border-radius: 10px;
        background: rgba(255, 255, 255, 0.86);
        box-shadow: 0 8px 18px rgba(39, 75, 115, 0.06);
    }
    .financial-report-stats span {
        display: block;
        margin-bottom: 4px;
        color: var(--crm-muted);
        font-size: 11px;
        font-weight: 700;
    }
    .financial-report-stats strong {
        color: var(--crm-navy);
        font-size: 15px;
        font-weight: 900;
    }
    .financial-table-wrap {
        overflow-x: auto;
        padding: 16px;
        background: #fbfdff;
    }
    .financial-bedehi-table {
        min-width: 920px;
        margin: 0;
        font-size: 13px;
    }
    .financial-bedehi-table thead th {
        padding: 14px 12px;
        background: #eaf4fb;
        color: #173a5c;
        font-size: 12px;
    }
    .financial-bedehi-table tbody td {
        padding: 11px 12px;
        color: #24466c;
        font-weight: 600;
        white-space: nowrap;
    }
    .financial-bedehi-table a {
        color: #1f6fa8;
        font-weight: 800;
    }
    .financial-amount,
    .financial-total {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-width: 92px;
        min-height: 28px;
        padding: 0 10px;
        border-radius: 999px;
        direction: ltr;
        background: #eef9f8;
        color: #0f766e;
        font-weight: 900;
    }
    .financial-kind {
        display: inline-flex;
        align-items: center;
        min-height: 26px;
        padding: 0 9px;
        border-radius: 999px;
        background: #eef2ff;
        color: #3552a3;
        font-size: 12px;
        font-weight: 900;
    }
    .financial-total {
        background: #fff7e6;
        color: #a45b00;
    }
    .marketing-list-page {
        direction: rtl;
        padding: 8px 0 36px;
    }
    .marketing-list-card {
        overflow: visible;
        border: 1px solid #d7e5f2;
        border-radius: 14px;
        background: #ffffff;
        box-shadow: 0 18px 44px rgba(36, 59, 90, 0.1);
    }
    .marketing-list-head {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 16px;
        padding: 18px 20px;
        background: linear-gradient(135deg, #f7fbff 0%, #eef9f8 100%);
        border-bottom: 1px solid #dce9f5;
        border-radius: 13px 13px 0 0;
    }
    .marketing-list-eyebrow {
        display: inline-flex;
        align-items: center;
        height: 24px;
        padding: 0 10px;
        border-radius: 999px;
        background: #dff6f2;
        color: #14796d;
        font-size: 12px;
        font-weight: 800;
        letter-spacing: 0;
    }
    .marketing-list-head h3 {
        margin: 8px 0 0;
        color: var(--crm-navy);
        font-size: 22px;
        font-weight: 900;
        line-height: 1.35;
    }
    .marketing-list-head p {
        margin: 4px 0 0;
        color: var(--crm-muted);
        font-size: 13px;
        font-weight: 600;
    }
    .marketing-list-stats {
        display: flex;
        gap: 10px;
        flex-wrap: wrap;
    }
    .marketing-list-stats div {
        min-width: 112px;
        padding: 10px 12px;
        border: 1px solid #d7e7f4;
        border-radius: 10px;
        background: rgba(255, 255, 255, 0.88);
        box-shadow: 0 8px 18px rgba(39, 75, 115, 0.06);
    }
    .marketing-list-stats span {
        display: block;
        margin-bottom: 4px;
        color: var(--crm-muted);
        font-size: 11px;
        font-weight: 700;
    }
    .marketing-list-stats strong {
        color: var(--crm-navy);
        font-size: 15px;
        font-weight: 900;
    }
    .marketing-table-wrap {
        overflow: visible;
        padding: 16px;
        background: #fbfdff;
    }
    .marketing-leads-table {
        table-layout: fixed;
        width: 100%;
        min-width: 0;
        margin: 0;
        overflow: visible;
        font-size: 13px;
    }
    .marketing-leads-table.crm-data-table tbody tr {
        transition: none;
    }
    .marketing-leads-table.crm-data-table.uk-table-hover tbody tr:hover,
    .marketing-leads-table.crm-data-table tbody tr:hover {
        transform: none;
    }
    .marketing-leads-table thead th {
        padding: 14px 12px;
        background: #eaf4fb;
        color: #173a5c;
        font-size: 12px;
    }
    .marketing-leads-table tbody td {
        padding: 11px 12px;
        color: #24466c;
        font-weight: 600;
        overflow-wrap: anywhere;
        white-space: normal;
    }
    .marketing-leads-table a {
        color: #1f6fa8;
        font-weight: 800;
    }
    .marketing-leads-table th:first-child,
    .marketing-leads-table td:first-child {
        text-align: center;
    }
    .marketing-row-code,
    .marketing-status,
    .marketing-note-action,
    .marketing-map-link {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-height: 28px;
        padding: 0 10px;
        border-radius: 999px;
        font-size: 12px;
        font-weight: 900;
        white-space: nowrap;
    }
    .marketing-row-owner,
    .marketing-date-day,
    .marketing-date-time {
        display: block;
        margin-top: 5px;
        direction: ltr;
        text-align: center;
        white-space: nowrap;
    }
    .marketing-row-owner,
    .marketing-date-time {
        color: #71859b;
        font-size: 11px;
        font-weight: 700;
    }
    .marketing-date-day {
        margin-top: 0;
        color: #24466c;
        font-weight: 800;
    }
    .marketing-row-code {
        direction: ltr;
        background: #eef2ff;
        color: #3552a3;
    }
    .marketing-status {
        background: #eef9f8;
        color: #0f766e;
    }
    .marketing-note-action {
        background: #fff7e6;
        color: #9a5a00 !important;
    }
    .marketing-note-action.is-done {
        background: #e9f8ef;
        color: #177245 !important;
    }
    .marketing-map-link {
        background: #edf5fb;
        color: #1f6fa8 !important;
    }
    .marketing-desc-row td {
        background: #f7fbff;
        color: #62748a;
        font-size: 12px;
        line-height: 1.8;
        white-space: normal;
    }
    .marketing-desc-text {
        display: -webkit-box;
        overflow: hidden;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 3;
        line-clamp: 3;
        overflow-wrap: anywhere;
    }
    .marketing-summary-row td {
        background: #f0faf8 !important;
        color: var(--crm-navy);
        font-weight: 900;
    }
    .marketing-list-footer {
        display: flex;
        justify-content: flex-end;
        padding: 0 16px 16px;
        background: #fbfdff;
    }
    .marketing-next-page {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-width: 132px;
        height: 40px;
        border-radius: 10px;
        background: linear-gradient(135deg, #22b8a8 0%, #2387c8 100%);
        color: #ffffff !important;
        font-weight: 900;
        box-shadow: 0 10px 22px rgba(35, 135, 200, 0.18);
    }
    .marketing-edit-page {
        direction: rtl;
        padding: 8px 0 36px;
    }
    .marketing-edit-card {
        overflow: hidden;
        max-width: 780px;
        border: 1px solid #d7e5f2;
        border-radius: 14px;
        background: #ffffff;
        box-shadow: 0 18px 44px rgba(36, 59, 90, 0.1);
    }
    .marketing-edit-head {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 16px;
        padding: 18px 20px;
        background: linear-gradient(135deg, #f7fbff 0%, #eef9f8 100%);
        border-bottom: 1px solid #dce9f5;
    }
    .marketing-edit-head h3 {
        margin: 8px 0 0;
        color: var(--crm-navy);
        font-size: 22px;
        font-weight: 900;
        line-height: 1.35;
    }
    .marketing-edit-head p {
        margin: 4px 0 0;
        color: var(--crm-muted);
        font-size: 13px;
        font-weight: 600;
    }
    .marketing-edit-back,
    .marketing-edit-cancel {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-width: 116px;
        height: 40px;
        border: 1px solid #cfe0ef;
        border-radius: 10px;
        background: #ffffff;
        color: var(--crm-navy) !important;
        font-weight: 900;
        white-space: nowrap;
    }
    .marketing-edit-alert {
        margin: 16px 20px 0;
        padding: 12px 14px;
        border: 1px solid #bfe8d3;
        border-radius: 10px;
        background: #f0fbf5;
        color: #177245;
        font-weight: 800;
    }
    .marketing-lead-summary {
        display: grid;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 10px;
        padding: 16px 20px 0;
    }
    .marketing-lead-summary div {
        min-width: 0;
        padding: 12px;
        border: 1px solid #dce9f5;
        border-radius: 10px;
        background: #fbfdff;
    }
    .marketing-lead-summary span {
        display: block;
        margin-bottom: 5px;
        color: var(--crm-muted);
        font-size: 11px;
        font-weight: 700;
    }
    .marketing-lead-summary strong {
        display: block;
        overflow: hidden;
        color: var(--crm-navy);
        font-size: 14px;
        font-weight: 900;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    .marketing-edit-form {
        padding: 18px 20px 20px;
    }
    .portal-main .marketing-edit-form .uk-fieldset {
        display: grid;
        grid-template-columns: minmax(220px, 1fr) auto;
        align-items: end;
        gap: 14px;
    }
    .portal-main .marketing-edit-form .marketing-edit-actions {
        display: flex;
        gap: 10px;
        align-items: center;
    }
    .portal-main .marketing-edit-form .uk-button {
        min-width: 132px;
        width: auto;
        padding: 0 18px;
    }
    @media (max-width: 760px) {
        .marketing-edit-head,
        .marketing-list-head {
            align-items: stretch;
            flex-direction: column;
        }
        .marketing-lead-summary {
            grid-template-columns: 1fr;
        }
        .portal-main .marketing-edit-form .uk-fieldset {
            grid-template-columns: 1fr;
        }
        .portal-main .marketing-edit-form .marketing-edit-actions {
            flex-direction: column;
            align-items: stretch;
        }
        .portal-main .marketing-edit-form .uk-button,
        .marketing-edit-cancel,
        .marketing-edit-back {
            width: 100%;
        }
    }
    .crm-table-action {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 34px !important;
        min-width: 34px;
        height: 34px !important;
        min-height: 34px;
        box-sizing: border-box;
        border-radius: 8px;
        border: 1px solid #2f688f !important;
        background: #ffffff !important;
        color: #224d76 !important;
        font-weight: 700;
        padding: 0 !important;
        line-height: 1;
        white-space: nowrap;
    }
    .crm-table-action:hover {
        background: #eef9f8 !important;
        border-color: #61d3d1 !important;
        color: #0f5f5b !important;
    }
    .crm-editor-page {
        color: var(--crm-text);
    }
    .crm-editor-layout {
        display: grid;
        grid-template-columns: minmax(0, 1fr) 210px;
        gap: 14px;
        align-items: start;
    }
    .crm-editor-layout-single {
        grid-template-columns: minmax(0, 1fr);
    }
    .crm-editor-card,
    .crm-editor-list {
        border: 1px solid #dde8f4;
        border-radius: 12px;
        box-shadow: 0 12px 30px rgba(39, 75, 115, 0.08);
    }
    .crm-editor-head {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        margin-bottom: 16px;
        padding-bottom: 12px;
        border-bottom: 1px solid #e1ebf6;
    }
    .crm-editor-head h3,
    .crm-editor-list h4 {
        margin: 0;
        color: var(--crm-navy);
        font-weight: 800;
    }
    .crm-editor-head span,
    .crm-editor-empty {
        color: var(--crm-muted);
        font-size: 13px;
    }
    .crm-editor-head-actions {
        display: flex;
        align-items: center;
        gap: 8px;
        flex: 0 0 auto;
    }
    .portal-main .crm-editor-new-page {
        width: auto !important;
        min-width: 104px;
        height: 38px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        flex: 0 0 auto;
        padding: 0 18px;
        white-space: nowrap;
    }
    .crm-editor-meta,
    .crm-editor-filter {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 12px;
        margin-bottom: 16px;
    }
    .crm-editor-meta {
        padding: 12px;
        background: #f8fbff;
        border: 1px solid #e1ebf6;
        border-radius: 10px;
    }
    .crm-editor-meta div,
    .crm-editor-list-summary {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 8px;
    }
    .crm-editor-meta span,
    .crm-editor-content-meta,
    .crm-editor-list-summary span {
        color: var(--crm-muted);
        font-size: 12px;
    }
    .crm-editor-meta strong,
    .crm-editor-list-summary strong {
        color: var(--crm-navy);
        font-weight: 800;
    }
    .crm-editor-meta strong {
        flex: 1 1 auto;
        text-align: center;
    }
    .crm-editor-filter {
        align-items: end;
        padding: 14px;
        background: #f8fbff;
        border: 1px solid #e1ebf6;
        border-radius: 12px;
    }
    .crm-editor-filter .uk-margin {
        margin: 0 !important;
    }
    .crm-editor-filter-actions {
        display: flex;
        justify-content: flex-end;
        gap: 8px;
    }
    .portal-main .crm-editor-filter-actions .uk-button,
    .portal-main .crm-editor-edit-link {
        width: auto !important;
        min-width: 92px;
        height: 40px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        flex: 0 0 auto;
        padding: 0 16px;
        white-space: nowrap;
    }
    .portal-main .crm-editor-filter-actions .uk-button {
        border: 0;
        background: linear-gradient(135deg, #22b8a8 0%, #2387c8 100%);
        color: #ffffff !important;
        box-shadow: 0 8px 18px rgba(35, 135, 200, 0.18);
    }
    .portal-main .crm-editor-filter-actions .uk-button:hover {
        background: linear-gradient(135deg, #1faeae 0%, #1f78bd 100%);
        color: #ffffff !important;
    }
    .pb-form-head {
        gap: 12px;
    }
    .pb-form-footer {
        gap: 12px;
        flex-wrap: wrap;
    }
    .pb-form-actions {
        display: flex;
        align-items: center;
        justify-content: flex-start;
        gap: 8px;
        flex: 0 0 auto;
    }
    .portal-main .pb-form-actions .uk-button {
        width: auto !important;
        min-width: 104px;
        height: 40px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 6px;
        flex: 0 0 auto;
        padding: 0 16px;
        white-space: nowrap;
    }
    .crm-phonebook-head {
        gap: 14px;
    }
    .crm-phonebook-tools {
        display: flex;
        align-items: center;
        gap: 10px;
        flex: 1 1 auto;
        justify-content: flex-start;
        max-width: 540px;
    }
    .crm-phonebook-search {
        flex: 1 1 auto;
        min-width: 260px;
    }
    .crm-phonebook-search .uk-search-input {
        width: 100%;
        height: 42px;
    }
    .portal-main .crm-phonebook-add {
        width: auto !important;
        min-width: 106px;
        height: 38px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 5px;
        flex: 0 0 auto;
        padding: 0 12px;
        font-size: 13px;
        white-space: nowrap;
    }
    .crm-phonebook-table thead th {
        text-align: right;
    }
    .crm-phonebook-table tbody td {
        text-align: right;
    }
    .crm-phonebook-table thead th.uk-text-center,
    .crm-phonebook-table tbody td.uk-text-center {
        text-align: center;
    }
    .crm-editor-list-summary {
        width: fit-content;
        margin: 0 0 12px;
        padding: 8px 12px;
        background: #eef9f8;
        border: 1px solid #c9efed;
        border-radius: 999px;
    }
    .crm-editor-empty-state {
        padding: 18px;
        border: 1px dashed #c8d7e6;
        border-radius: 12px;
        color: var(--crm-muted);
        text-align: center;
    }
    .crm-editor-content-list {
        display: grid;
        gap: 10px;
    }
    .crm-editor-content-item {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 14px;
        padding: 14px;
        border: 1px solid #e1ebf6;
        border-radius: 12px;
        background: #ffffff;
    }
    .crm-editor-content-item:hover {
        border-color: #61d3d1;
        box-shadow: 0 10px 22px rgba(39, 75, 115, 0.08);
    }
    .crm-editor-content-actions {
        display: flex;
        align-items: center;
        gap: 8px;
        flex: 0 0 auto;
    }
    .portal-main .crm-editor-content-actions .uk-button {
        width: auto !important;
        min-width: 82px;
        height: 40px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        padding: 0 14px;
        border-radius: 8px;
        font-weight: 800;
        white-space: nowrap;
    }
    .portal-main .crm-editor-view-link {
        border: 0;
        color: #ffffff !important;
        background: linear-gradient(135deg, #22b8a8 0%, #2387c8 100%);
    }
    .crm-editor-content-title {
        display: flex;
        align-items: center;
        gap: 10px;
        margin-bottom: 7px;
    }
    .crm-editor-content-title span {
        display: inline-flex;
        align-items: center;
        height: 24px;
        padding: 0 9px;
        border-radius: 999px;
        background: #eef9f8;
        color: #0f6f66;
        font-size: 12px;
        white-space: nowrap;
    }
    .crm-editor-content-title h4 {
        margin: 0;
        color: var(--crm-navy);
        font-size: 16px;
        font-weight: 800;
    }
    .crm-editor-content-meta {
        display: flex;
        flex-wrap: wrap;
        gap: 8px 14px;
    }
    .crm-editor-toolbar {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
        margin: 8px 0 10px;
        padding: 10px;
        background: #f8fbff;
        border: 1px solid #e1ebf6;
        border-radius: 10px;
    }
    .crm-editor-toolbar button {
        height: 34px;
        border: 1px solid #d2e2f1;
        border-radius: 8px;
        background: #ffffff;
        color: var(--crm-navy);
        font-weight: 700;
        cursor: pointer;
        padding: 0 12px;
    }
    .crm-editor-toolbar button:hover {
        background: #eef9f8;
        border-color: #61d3d1;
    }
    .crm-rich-editor {
        width: 100%;
        max-width: none;
        height: 800px;
        overflow-y: auto;
        margin: 0;
        padding: 38px 52px;
        background: #ffffff;
        border: 1px solid #edf1f5;
        border-radius: 6px;
        box-sizing: border-box;
        color: #111827;
        font-size: 16px;
        line-height: 1.9;
        text-align: justify;
        outline: 0;
        box-shadow: 0 14px 42px rgba(15, 23, 42, 0.06);
    }
    .crm-rich-editor:focus {
        border-color: #cbd5e1;
        box-shadow: 0 16px 48px rgba(15, 23, 42, 0.08), 0 0 0 3px rgba(203, 213, 225, 0.28);
    }
    .crm-rich-editor h1 {
        margin: 0 0 28px;
        color: #0f172a;
        font-size: 26px;
        font-weight: 900;
        line-height: 1.55;
        text-align: center;
    }
    .crm-rich-editor h2 {
        margin: 26px 0 10px;
        color: #111827;
        border-right: 0;
        padding-right: 0;
        font-size: 21px;
        font-weight: 900;
        line-height: 1.55;
        text-align: right;
    }
    .crm-rich-editor h3 {
        margin: 22px 0 8px;
        color: #111827;
        font-size: 18px;
        font-weight: 900;
        line-height: 1.6;
    }
    .crm-rich-editor p {
        margin: 0 0 8px;
    }
    .crm-rich-editor ul,
    .crm-rich-editor ol {
        margin: 6px 0 10px;
        padding-right: 28px;
        padding-left: 0;
    }
    .crm-rich-editor li {
        margin-bottom: 3px;
    }
    .crm-rich-editor img,
    .crm-rich-editor .crm-editor-image {
        display: block;
        max-width: 100%;
        height: auto;
        margin: 18px auto;
        border-radius: 4px;
    }
    .crm-rich-editor table {
        width: 100%;
        border-collapse: collapse;
        margin: 14px 0;
    }
    .crm-rich-editor th,
    .crm-rich-editor td {
        border: 1px solid #d7e4f1;
        padding: 9px;
        text-align: right;
    }
    .crm-rich-editor pre {
        direction: ltr;
        text-align: left;
        overflow: auto;
        background: #f4f7fb;
        border: 1px solid #d7e4f1;
        border-radius: 10px;
        padding: 14px;
        line-height: 1.8;
    }
    .crm-rich-editor .download-entry {
        margin: 12px 0;
        padding: 12px;
        border: 1px solid #d7e4f1;
        border-radius: 10px;
        background: #f8fbff;
    }
    .crm-rich-editor .download-title {
        display: block;
        color: var(--crm-navy);
        margin-bottom: 5px;
    }
    .crm-rich-editor .download-link {
        color: #0f6f66;
        border-bottom: 1px dashed #0f6f66;
    }
    .crm-editor-submit {
        margin-top: 14px;
        min-width: 160px;
        border-radius: 9px;
        font-weight: 800;
    }
    .crm-editor-list {
        position: sticky;
        top: 12px;
    }
    .crm-editor-list-item {
        display: block;
        padding: 11px 0;
        border-bottom: 1px solid #e1ebf6;
    }
    .crm-editor-list-item:last-child {
        border-bottom: 0;
    }
    .crm-editor-list-item strong {
        display: flex;
        align-items: center;
        gap: 8px;
        color: var(--crm-navy);
        font-weight: 800;
    }
    .crm-editor-list-item strong span {
        display: inline-flex;
        align-items: center;
        height: 24px;
        padding: 0 8px;
        border-radius: 999px;
        background: #eef9f8;
        color: #0f6f66;
        font-size: 12px;
        white-space: nowrap;
    }
    .crm-editor-list-item > span {
        display: block;
        margin-top: 4px;
        direction: ltr;
        text-align: left;
        color: var(--crm-muted);
        font-size: 12px;
    }
    .crm-editor-modal {
        position: fixed;
        inset: 0;
        display: none;
        align-items: center;
        justify-content: center;
        background: rgba(26, 55, 89, .36);
        z-index: 9999;
    }
    .crm-editor-modal.is-open {
        display: flex;
    }
    .crm-editor-modal-box {
        width: min(520px, calc(100vw - 28px));
        background: #ffffff;
        border: 1px solid #d7e4f1;
        border-radius: 12px;
        padding: 18px;
        box-shadow: 0 18px 42px rgba(39, 75, 115, 0.22);
    }
    .crm-editor-modal-box h3 {
        margin-top: 0;
        color: var(--crm-navy);
        font-weight: 800;
    }
    .crm-editor-modal-box label {
        display: block;
        margin-top: 10px;
        margin-bottom: 6px;
        font-weight: 700;
    }
    .crm-editor-modal-actions {
        display: flex;
        gap: 8px;
        margin-top: 14px;
    }
    @media (max-width: 760px) {
        .crm-editor-layout {
            grid-template-columns: 1fr;
        }
        .crm-editor-list {
            position: static;
        }
        .crm-editor-meta,
        .crm-editor-filter {
            grid-template-columns: 1fr;
        }
        .crm-editor-content-item,
        .crm-editor-content-title {
            align-items: flex-start;
            flex-direction: column;
        }
    }
    @media (max-width: 900px) {
        .crm-list-toolbar {
            grid-template-columns: 1fr auto;
            gap: 10px;
        }
        .crm-list-toolbar > div {
            grid-column: 1 / -1;
            grid-row: 1;
        }
        .crm-list-search {
            grid-column: 1;
            grid-row: 2;
        }
        .crm-list-add {
            grid-column: 2;
            grid-row: 2;
            text-align: center;
        }
    }
    @media (max-width: 560px) {
        .crm-list-toolbar {
            grid-template-columns: 1fr;
        }
        .crm-list-search {
            grid-column: auto;
            grid-row: auto;
        }
        .crm-list-add {
            width: 100%;
        }
    }
    a {
        color: #1f4f8a;
        text-decoration: none;
        transition: color .2s ease;
    }
    a:hover {
        color: #0f6f66;
    }
    .uk-container {
        width: min(1280px, calc(100% - 32px));
        max-width: 1280px !important;
        margin-left: auto !important;
        margin-right: auto !important;
        padding-left: 0;
        padding-right: 0;
    }
    .zarrin-wrap {
        display: none;
    }
    .zarrin-navbar {
        background: linear-gradient(90deg, #16756f 0%, #136a65 55%, #0f5f5b 100%);
        border-radius: 10px;
        border: 1px solid #0f5f5b;
        padding: 9px 14px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 16px;
    }
    .zarrin-navbar ul {
        list-style: none;
        margin: 0;
        padding: 0;
        display: flex;
        gap: 16px;
        align-items: center;
    }
    .zarrin-navbar a {
        color: #fff !important;
        font-weight: 600;
        text-decoration: none;
        font-size: 15px;
    }
    .zarrin-title {
        font-size: 42px;
        color: #f0f0f0;
        font-weight: 600;
    }
    .zarrin-left {
        display: flex;
        align-items: center;
        gap: 12px;
    }
    .zarrin-mobile-link {
        display: none;
        color: #fff;
        font-weight: 700;
        text-decoration: none;
    }
    .zarrin-login-btn {
        margin-top: 0;
        height: 34px;
        line-height: 32px;
        padding: 0 12px;
        background-color: #174bcf;
        color: #fff;
        font-size: 14px;
    }
    .zarrin-breadcrumb {
        padding-right: 5px;
        margin-top: 8px;
        margin-bottom: 6px;
        list-style: none;
        display: flex;
        gap: 10px;
        align-items: center;
    }
    .zarrin-breadcrumb li {
        list-style: none;
        color: #29486e;
        font-weight: 600;
        font-size: 15px;
    }
    .zarrin-breadcrumb li + li:before {
        content: '/';
        margin-left: 10px;
        color: #90a4c2;
    }
    .zarrin-footer {
        margin-top: 14px;
        text-align: center;
        color: #6f7f98;
        font-size: 13px;
    }
    .portal-shell {
        margin-top: 10px;
        padding: 0;
        background: transparent;
        border: 0;
        border-radius: 0;
    }
    .portal-layout {
        display: grid;
        grid-template-columns: 1fr 238px;
        gap: 14px;
        direction: ltr;
    }
    .portal-main,
    .portal-sidebar {
        direction: rtl;
    }
    .portal-main {
        min-width: 0;
    }
    .portal-sidebar {
        background: linear-gradient(180deg, #7ed9d7 0%, #61cfcf 100%);
        border-radius: 14px;
        padding: 12px 10px;
        color: #fff;
        min-height: 100%;
        width: 238px;
        box-shadow: 0 8px 28px rgba(51, 154, 161, 0.28);
        position: sticky;
        top: 10px;
        align-self: start;
    }
    .sidebar-brand {
        border: 1px solid rgba(255,255,255,0.22);
        border-radius: 10px;
        padding: 10px;
        margin-bottom: 10px;
        background: rgba(19, 106, 101, 0.28);
    }
    .sidebar-brand-title {
        margin: 0;
        color: #ffffff;
        font-size: 32px;
        font-weight: 900;
        line-height: 1;
    }
    .sidebar-brand-sub {
        margin-top: 4px;
        color: rgba(255,255,255,.78);
        font-size: 12px;
        font-weight: 500;
    }
    .sidebar-menu {
        margin: 0;
        padding: 0;
        list-style: none;
    }
    .sidebar-menu li {
        margin-bottom: 6px;
    }
    .sidebar-menu a {
        display: grid;
        grid-template-columns: 28px 1fr;
        align-items: center;
        gap: 8px;
        padding: 10px 8px;
        border-radius: 9px;
        color: #e9fffc;
        text-decoration: none;
        font-weight: 600;
        font-size: 15px;
        transition: background-color .2s ease, color .2s ease, transform .2s ease, box-shadow .2s ease;
    }
    .sidebar-menu a:hover {
        background: rgba(12, 82, 76, 0.28);
        color: #ffffff;
        box-shadow: inset 0 0 0 1px rgba(255,255,255,0.16);
        transform: translateX(-2px);
    }
    .sidebar-menu .active {
        background: rgba(255,255,255,0.24);
        color: #ffffff;
        border: 1px solid rgba(255,255,255,0.36);
    }
    .sidebar-menu .icon {
        width: 26px;
        height: 26px;
        border-radius: 8px;
        background: rgba(255,255,255,0.14);
        display: inline-flex;
        justify-content: center;
        align-items: center;
        font-size: 13px;
    }
    .sidebar-menu .active .icon {
        background: rgba(255,255,255,0.28);
    }
    .sidebar-logout {
        margin-top: 12px;
        border: 1px solid rgba(255,255,255,0.2);
        border-radius: 10px;
        text-align: center;
        padding: 10px;
        color: #d6fff9;
        font-weight: 800;
    }
    .sidebar-section-title {
        margin: 10px 6px 8px;
        color: #f4ffff;
        font-size: 12px;
        font-weight: 700;
        border-top: 1px solid rgba(255,255,255,0.24);
        padding-top: 10px;
    }
    .sidebar-menu.sidebar-actions a {
        padding: 8px 10px;
        font-size: 13px;
        border: 1px solid rgba(255,255,255,0.38);
        background: rgba(255,255,255,0.14);
        color: #f3ffff;
        border-radius: 10px;
        box-shadow: inset 0 1px 0 rgba(255,255,255,0.35);
        font-weight: 700;
    }
    .sidebar-menu.sidebar-actions a:hover {
        background: rgba(12, 82, 76, 0.34);
        color: #ffffff;
        box-shadow: inset 0 0 0 1px rgba(255,255,255,0.18), 0 8px 18px rgba(15, 91, 84, 0.16);
    }
    .sidebar-menu.sidebar-actions .icon {
        background: rgba(19, 106, 101, 0.5);
        color: #fff;
    }
    .sidebar-groups {
        margin-top: 6px;
    }
    .sidebar-group {
        margin-bottom: 8px;
        border-radius: 10px;
        border: 1px solid rgba(255,255,255,0.22);
        background: rgba(255,255,255,0.08);
        overflow: hidden;
    }
    .sidebar-group summary {
        list-style: none;
        cursor: pointer;
        padding: 8px 10px;
        color: #f4ffff;
        font-size: 13px;
        font-weight: 700;
        background: rgba(19,106,101,0.24);
        border-bottom: 1px solid rgba(255,255,255,0.2);
    }
    .sidebar-group summary::-webkit-details-marker {
        display: none;
    }
    .sidebar-group summary:before {
        content: '▸';
        margin-left: 8px;
        display: inline-block;
        transform: rotate(0deg);
        transition: transform .2s ease;
    }
    .sidebar-group[open] summary:before {
        transform: rotate(90deg);
    }
    .sidebar-submenu {
        margin: 0;
        padding: 8px;
        list-style: none;
    }
    .sidebar-submenu li {
        margin-bottom: 6px;
    }
    .sidebar-submenu li:last-child {
        margin-bottom: 0;
    }
    .sidebar-flat .menu-head {
        color: #f7ffff;
        font-size: 12px;
        font-weight: 700;
        margin: 10px 8px 6px;
        opacity: .95;
    }
    .sidebar-flat .menu-item {
        margin-bottom: 6px;
    }
    .sidebar-flat .menu-item a {
        padding: 8px 10px;
        border-radius: 10px;
        border: 1px solid rgba(255,255,255,0.3);
        background: rgba(255,255,255,0.14);
        color: #f8ffff;
        font-size: 14px;
        font-weight: 600;
    }
    .sidebar-flat .menu-item a:hover {
        background: rgba(12, 82, 76, 0.30);
        color: #ffffff;
    }
    .sidebar-foot {
        margin-top: 10px;
        border-top: 1px solid rgba(255,255,255,0.3);
        padding-top: 10px;
    }
    .sidebar-foot .dark-row,
    .sidebar-foot .user-row {
        display: flex;
        justify-content: space-between;
        align-items: center;
        color: #f4ffff;
        font-size: 13px;
        margin-bottom: 8px;
    }
    .sidebar-foot .dark-row {
        width: 100%;
        border: 0;
        background: transparent;
        cursor: pointer;
        font-family: inherit;
        direction: rtl;
    }
    .sidebar-foot .dark-row .night-icon {
        width: 24px;
        height: 24px;
        border-radius: 50%;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        background: rgba(255,255,255,.16);
    }
    .sidebar-foot .logout-btn {
        display: block;
        text-align: center;
        padding: 9px;
        border: 1px solid rgba(255,255,255,0.4);
        border-radius: 10px;
        color: #fff;
        background: rgba(19,106,101,0.22);
        font-weight: 700;
    }
    .portal-head {
        display: grid;
        grid-template-columns: 1fr auto;
        gap: 10px;
        align-items: center;
        margin-bottom: 12px;
        background: linear-gradient(90deg, #7ed9d7 0%, #61cfcf 100%);
        border-radius: 14px;
        padding: 12px 16px;
    }
    .portal-title {
        margin: 0;
        color: #ffffff;
        font-size: 34px;
        font-weight: 700;
    }
    .portal-sub {
        margin: 2px 0 0;
        color: rgba(255,255,255,0.92);
        font-size: 14px;
    }
    .portal-domain {
        color: #ffffff;
        font-size: 12px;
        background: rgba(255,255,255,0.22);
        border: 1px solid rgba(255,255,255,0.35);
        border-radius: 999px;
        padding: 4px 10px;
        white-space: nowrap;
    }
    .portal-toolbar {
        background: var(--crm-surface);
        border: 1px solid var(--crm-border);
        border-radius: 14px;
        padding: 10px;
        display: grid;
        grid-template-columns: 1fr 2fr auto;
        gap: 10px;
        align-items: center;
        margin-bottom: 12px;
    }
    .portal-user {
        color: #365073;
        font-weight: 600;
        font-size: 16px;
    }
    .portal-search {
        display: block;
    }
    .portal-search-form {
        margin: 0;
    }
    .portal-search-input {
        width: 100%;
        border: 1px solid var(--crm-border);
        background: #f8fbff;
        border-radius: 9px;
        padding: 9px 12px;
        color: #6c7e96;
        outline: none;
        font-size: 16px;
    }
    .portal-search-input:focus {
        border-color: #8cc6ff;
        box-shadow: 0 0 0 3px rgba(59,130,246,0.14);
    }
    .portal-tools {
        display: flex;
        gap: 8px;
    }
    .portal-icon-btn {
        width: 32px;
        height: 32px;
        border-radius: 9px;
        border: 1px solid var(--crm-border);
        background: #f8fbff;
        color: #35527a;
        font-weight: 700;
        display: inline-flex;
        justify-content: center;
        align-items: center;
    }
    .shift-status-card {
        margin-bottom: 12px;
        border-radius: 8px;
        border: 2px solid #8adbc2;
        background: linear-gradient(180deg, #ffffff 0%, #fbfefd 100%);
        padding: 20px 28px;
        display: grid;
        grid-template-columns: 280px minmax(320px, 1fr) 280px;
        gap: 20px;
        align-items: center;
        min-height: 116px;
        box-sizing: border-box;
        box-shadow: inset 0 0 0 1px rgba(255,255,255,.8), 0 8px 22px rgba(39, 117, 106, .05);
    }
    .shift-status-card.is-open {
        border-color: #8adbc2;
        background: linear-gradient(180deg, #ffffff 0%, #fbfefd 100%);
    }
    .shift-status-card.is-closed {
        border-color: #ef8e8e;
        background: linear-gradient(180deg, #fffafa 0%, #fff1f1 100%);
    }
    .shift-status-state {
        display: flex;
        align-items: center;
        justify-content: flex-start;
        gap: 16px;
        min-width: 0;
        padding-right: 8px;
        box-sizing: border-box;
    }
    .shift-status-state-icon {
        order: -1;
        width: 64px;
        height: 64px;
        border-radius: 50%;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        font-size: 28px;
        border: 0;
        color: #ffffff;
        background: linear-gradient(135deg, #24be82 0%, #109a61 100%);
        box-shadow: 0 10px 22px rgba(18, 154, 97, .22);
        flex-shrink: 0;
    }
    .shift-status-card.is-closed .shift-status-state-icon {
        color: #ffffff;
        background: linear-gradient(135deg, #eb6868 0%, #c73333 100%);
        box-shadow: 0 10px 22px rgba(199, 51, 51, .18);
    }
    .shift-status-title {
        color: #1b9e5e;
        font-size: 23px;
        font-weight: 800;
        line-height: 1.4;
        white-space: nowrap;
    }
    .shift-status-card.is-closed .shift-status-title {
        color: #c83d3d;
    }
    .shift-status-subtitle {
        margin-top: 6px;
        font-size: 15px;
        color: #6f7884;
        font-weight: 600;
    }
    .shift-status-times {
        display: flex;
        flex-direction: row-reverse;
        align-items: center;
        justify-content: center;
        gap: 28px;
    }
    .shift-status-clock {
        width: 44px;
        height: 44px;
        border-radius: 50%;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        border: 3px solid #1eb876;
        color: #18a865;
        font-size: 23px;
        font-weight: 800;
        line-height: 1;
        flex-shrink: 0;
    }
    .shift-status-card.is-closed .shift-status-clock {
        border-color: #dd5454;
        color: #ca3939;
    }
    .shift-status-time-block {
        text-align: center;
        min-width: 116px;
    }
    .shift-status-caption {
        color: #69717d;
        font-size: 15px;
        font-weight: 700;
    }
    .shift-status-time-value {
        margin-top: 6px;
        color: #1f2d3d;
        font-size: 28px;
        line-height: 1;
        font-weight: 800;
        direction: ltr;
        letter-spacing: 0;
    }
    .shift-status-card.is-open .shift-status-time-value {
        color: #14a05f;
    }
    .shift-status-card.is-closed .shift-status-time-value {
        color: #c83737;
    }
    .shift-status-action {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        justify-self: start;
        gap: 16px;
        width: 250px;
        height: 78px;
        border-radius: 7px;
        padding: 0 28px;
        box-sizing: border-box;
        background: linear-gradient(135deg, #2abb87 0%, #1aa56f 100%);
        color: #ffffff !important;
        font-size: 23px;
        font-weight: 800;
        box-shadow: 0 10px 24px rgba(18, 133, 91, 0.22);
    }
    .shift-status-card.is-open .shift-status-action {
        width: 225px;
        height: 70px;
        padding: 0 25px;
        font-size: 21px;
        background: linear-gradient(135deg, #e76060 0%, #cb3939 100%);
        box-shadow: 0 8px 18px rgba(186, 44, 44, 0.2);
    }
    .shift-status-card.is-closed .shift-status-action {
        background: linear-gradient(135deg, #2abb87 0%, #1aa56f 100%);
        box-shadow: 0 10px 24px rgba(18, 133, 91, 0.22);
    }
    .shift-status-action-box {
        width: 22px;
        height: 22px;
        border: 2px solid rgba(255,255,255,0.95);
        border-radius: 2px;
        background: #ffffff;
        flex-shrink: 0;
    }
    .shift-status-action-label {
        line-height: 1;
    }
    @media (max-width: 1200px) {
        .shift-status-card {
            grid-template-columns: 230px minmax(280px, 1fr) 230px;
            gap: 16px;
            padding: 18px 22px;
        }
        .shift-status-state {
            justify-content: flex-start;
        }
        .shift-status-times {
            justify-content: center;
            gap: 18px;
        }
        .shift-status-action {
            width: 220px;
            min-width: 0;
            height: 70px;
            justify-self: start;
            font-size: 21px;
        }
        .shift-status-card.is-open .shift-status-action {
            width: 198px;
            height: 63px;
            padding: 0 22px;
            font-size: 19px;
        }
    }
    @media (max-width: 1050px) {
        .shift-status-card {
            grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
            gap: 16px 20px;
            padding: 18px 20px;
        }
        .shift-status-state {
            grid-column: 1;
            justify-content: flex-start;
        }
        .shift-status-times {
            grid-column: 2;
            justify-content: flex-end;
        }
        .shift-status-action {
            grid-column: 1 / -1;
            width: min(100%, 360px);
            height: 64px;
            justify-self: center;
        }
    }
    @media (max-width: 768px) {
        .shift-status-card {
            width: auto;
            margin: 0 12px 12px;
            grid-template-columns: 1fr;
            padding: 18px 16px 16px;
            gap: 14px;
            min-height: auto;
            box-sizing: border-box;
            text-align: center;
        }
        .shift-status-state {
            grid-column: 1;
            justify-content: center;
            gap: 12px;
            padding-right: 0;
        }
        .shift-status-state-icon {
            width: 52px;
            height: 52px;
            font-size: 24px;
        }
        .shift-status-title {
            font-size: 21px;
        }
        .shift-status-subtitle {
            margin-top: 4px;
            font-size: 13px;
        }
        .shift-status-times {
            grid-column: 1;
            width: 100%;
            display: grid;
            grid-template-columns: 42px minmax(0, 1fr) minmax(0, 1fr);
            gap: 8px;
            direction: ltr;
            padding: 0 4px;
            box-sizing: border-box;
        }
        .shift-status-clock {
            width: 38px;
            height: 38px;
            font-size: 20px;
            border-width: 2px;
        }
        .shift-status-time-block {
            min-width: 0;
        }
        .shift-status-caption {
            font-size: 13px;
        }
        .shift-status-time-value {
            margin-top: 4px;
            font-size: 25px;
        }
        .shift-status-action {
            grid-column: 1;
            width: calc(100% - 24px);
            height: 56px;
            margin: 2px auto 0;
            justify-self: center;
            padding: 0 22px;
            gap: 12px;
            font-size: 21px;
        }
        .shift-status-card.is-open .shift-status-action {
            width: calc(90% - 22px);
            height: 50px;
            padding: 0 20px;
            font-size: 19px;
        }
        .shift-status-action-box {
            width: 18px;
            height: 18px;
        }
    }
    .portal-kpi-grid {
        display: grid;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 12px;
        margin-bottom: 12px;
    }
    .portal-card {
        background: var(--crm-surface);
        border: 1px solid var(--crm-border);
        border-radius: 14px;
        padding: 14px;
        min-height: 94px;
        box-shadow: 0 4px 16px rgba(31,79,138,0.06);
    }
    .portal-kpi-label {
        color: #4f6688;
        font-size: 14px;
        font-weight: 600;
    }
    .portal-kpi-value {
        margin-top: 4px;
        color: var(--crm-text);
        font-size: 42px;
        line-height: 1;
        font-weight: 700;
    }
    .portal-kpi-note {
        margin-top: 3px;
        color: #18a957;
        font-size: 13px;
        font-weight: 600;
    }
    .portal-status-row {
        display: grid;
        grid-template-columns: repeat(5, minmax(0, 1fr));
        gap: 8px;
        margin-bottom: 12px;
    }
    .portal-status-item {
        background: #fff;
        border: 1px solid var(--crm-border);
        border-radius: 12px;
        padding: 8px 10px;
        box-shadow: 0 2px 10px rgba(31,79,138,0.05);
    }
    .portal-status-key {
        color: #4e6484;
        font-weight: 600;
        font-size: 12px;
    }
    .portal-status-value {
        margin-top: 3px;
        color: #183358;
        font-size: 12px;
    }
    .portal-actions {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
        margin: 0 0 10px;
    }
    .portal-actions .uk-button {
        border-radius: 999px;
        border: 1px solid #cfd9eb;
        background: #fff;
        color: #264268;
        font-weight: 600;
        font-size: 14px;
    }
    .portal-actions .late-link { color: #fff !important; background: #e3363a; border-color: #e3363a; }
    .portal-actions .wallet-link { color: #fff !important; background: #1fa768; border-color: #1fa768; }
    .portal-actions .chat-link,
    .portal-actions .report-link { color: #fff !important; background: #305ec4; border-color: #305ec4; }
    .portal-shift {
        margin-top: 2px;
        margin-bottom: 12px;
        padding: 10px 12px;
        border-radius: 12px;
        background: #ecf7f6;
        border: 1px solid #d4e5fb;
    }
    .portal-shift a { color: #2557aa; font-weight: 700; }
    .portal-calllog {
        margin-top: 0;
        margin-bottom: 10px;
        border-radius: 14px;
        padding: 14px;
        background: linear-gradient(120deg, #69cfcf 0%, #4daeb8 100%);
        color: #fff;
    }
    .portal-calllog .label { font-size: 12px; opacity: 0.9; }
    .portal-calllog .value { font-size: 18px; font-weight: 700; margin-top: 4px; }
    .portal-calllog .chip {
        display: inline-block;
        margin-top: 4px;
        padding: 6px 10px;
        border-radius: 8px;
        background: rgba(255,255,255,0.22);
    }
    .portal-widgets {
        display: grid;
        grid-template-columns: 1.1fr 1fr;
        gap: 12px;
        margin-bottom: 12px;
    }
    .portal-widgets .widget-card:last-child {
        grid-column: 1 / -1;
    }
    .widget-card {
        background: #fff;
        border: 1px solid var(--crm-border);
        border-radius: 14px;
        padding: 12px;
        min-height: 250px;
        box-shadow: 0 4px 16px rgba(31,79,138,0.06);
    }
    .widget-title {
        margin: 0 0 10px;
        color: #285078;
        font-size: 18px;
        font-weight: 700;
    }
    .donut-wrap {
        width: 152px;
        height: 152px;
        margin: 8px auto;
        border-radius: 50%;
        background: conic-gradient(#4f8ce6 0 26%, #5266d8 26% 48%, #f35d6f 48% 68%, #3caf66 68% 84%, #f4b321 84% 100%);
        position: relative;
    }
    .donut-wrap:after {
        content: '';
        position: absolute;
        inset: 40px;
        background: #fff;
        border-radius: 50%;
    }
    .donut-text {
        position: relative;
        text-align: center;
        margin-top: -98px;
        z-index: 2;
        color: #17365f;
        font-weight: 800;
        font-size: 28px;
        line-height: 1.1;
    }
    .donut-text small {
        display: block;
        font-size: 14px;
        color: #60779a;
        font-weight: 700;
    }
    .spark-line {
        width: 100%;
        height: 170px;
        border: 1px solid #e4ecf8;
        border-radius: 8px;
        background: linear-gradient(180deg, #fafdff 0%, #f0f6ff 100%);
    }
    .activity-list {
        margin: 0;
        padding: 0;
        list-style: none;
    }
    .activity-list li {
        display: grid;
        grid-template-columns: auto 1fr;
        gap: 12px;
        padding: 6px 0;
        border-bottom: 1px dashed #d7e2f2;
        color: #2f4a71;
    }
    .activity-list li:last-child {
        border-bottom: 0;
    }
    .activity-time {
        color: #6b7f9d;
        font-weight: 600;
    }
    .dash-table-wrap {
        margin-top: 12px;
        border: 1px solid var(--crm-border);
        border-radius: 14px;
        overflow: hidden;
        background: #fff;
        box-shadow: 0 4px 16px rgba(31,79,138,0.06);
    }
    .dash-table-wrap .uk-table { margin: 0; }
    .dash-table-wrap th {
        background: #f7fbff;
        font-weight: 600;
        color: #4b5563;
    body.crm-night-mode {
        --crm-bg: #0f1724;
        --crm-surface: #172333;
        --crm-text: #d9e7f2;
        --crm-muted: #8fa4b8;
        --crm-border: #26384b;
        background: #0f1724;
        color: #d9e7f2;
    }
    body.crm-night-mode .portal-head,
    body.crm-night-mode .crm-header-profile,
    body.crm-night-mode .crm-profile-menu,
    body.crm-night-mode .crm-header-search .portal-search-form {
        background: #172333;
        border-color: #26384b;
        box-shadow: 0 10px 32px rgba(2, 8, 23, .28);
    }
    body.crm-night-mode .portal-layout {
        background: #111b29;
        box-shadow: 0 12px 48px rgba(2, 8, 23, .34);
    }
    body.crm-night-mode .portal-main {
        background: linear-gradient(180deg, #111b29 0%, #0f1724 100%);
    }
    body.crm-night-mode .portal-sidebar {
        background: linear-gradient(180deg, #1f8f82 0%, #116457 58%, #1a7568 100%);
        box-shadow: inset 1px 0 0 rgba(255,255,255,.12), -10px 0 34px rgba(2, 8, 23, .34);
    }
    body.crm-night-mode .crm-brand,
    body.crm-night-mode .crm-brand:hover,
    body.crm-night-mode .crm-standalone-head strong,
    body.crm-night-mode .crm-header-profile-meta strong,
    body.crm-night-mode .crm-profile-menu-person strong,
    body.crm-night-mode .crm-profile-menu-stats strong,
    body.crm-night-mode .crm-profile-menu-links a,
    body.crm-night-mode .portal-main .uk-card-title,
    body.crm-night-mode .crm-login-title,
    body.crm-night-mode .portal-user,
    body.crm-night-mode .crm-info-value,
    body.crm-night-mode .portal-kpi-value,
    body.crm-night-mode .dash-table-title {
        color: #e8f3fb;
    }
    body.crm-night-mode .crm-header-profile-meta span,
    body.crm-night-mode .crm-standalone-head span,
    body.crm-night-mode .crm-profile-menu-person span,
    body.crm-night-mode .crm-profile-menu-stats span,
    body.crm-night-mode .operator-caret,
    body.crm-night-mode .portal-main .uk-form-label,
    body.crm-night-mode .crm-login-field,
    body.crm-night-mode .crm-info-label,
    body.crm-night-mode .crm-info-hint,
    body.crm-night-mode .portal-kpi-label,
    body.crm-night-mode .portal-kpi-note,
    body.crm-night-mode .dash-table-count,
    body.crm-night-mode .activity-time {
        color: #9fb2c5;
    }
    body.crm-night-mode .portal-main .uk-card.uk-card-default,
    body.crm-night-mode .portal-main > div:not(.portal-head):not(.portal-toolbar):not(.crm-info-grid):not(.portal-kpi-grid):not(.portal-status-row):not(.portal-shift):not(.portal-calllog):not(.portal-widgets):not(.bottom-grid):not(.dash-table-wrap):not(.crm-login-section),
    body.crm-night-mode .crm-login-card,
    body.crm-night-mode .crm-info-item,
    body.crm-night-mode .portal-card,
    body.crm-night-mode .widget-card,
    body.crm-night-mode .dash-table-wrap,
    body.crm-night-mode .mini-panel {
        background: #172333;
        border-color: #26384b;
        box-shadow: 0 10px 30px rgba(2, 8, 23, .28);
    }
    body.crm-night-mode .portal-main .uk-input,
    body.crm-night-mode .portal-main .uk-select,
    body.crm-night-mode .portal-main .uk-textarea,
    body.crm-night-mode .crm-login-field input,
    body.crm-night-mode .crm-header-search .portal-search-input {
        background: #101a28;
        border-color: #2c4155;
        color: #e4eef7;
    }
    body.crm-night-mode .portal-main .uk-input:focus,
    body.crm-night-mode .portal-main .uk-select:focus,
    body.crm-night-mode .portal-main .uk-textarea:focus,
    body.crm-night-mode .crm-login-field input:focus {
        border-color: #43c4b5;
        box-shadow: 0 0 0 3px rgba(67, 196, 181, .18);
        background: #132033;
    }
    body.crm-night-mode .portal-main .js-upload {
        background: #101a28;
        border-color: #2c4155;
        color: #9fb2c5;
    }
    body.crm-night-mode .crm-header-search kbd,
    body.crm-night-mode .crm-action-btn,
    body.crm-night-mode .crm-profile-menu-stats div {
        background: #101a28;
        border-color: #2c4155;
        color: #c7d7e5;
    }
    body.crm-night-mode .crm-profile-menu-stats {
        border-color: #26384b;
    }
    body.crm-night-mode .crm-profile-menu-links a:hover {
        background: #101f2e;
        color: #8ff0df;
    }
    body.crm-night-mode .crm-profile-menu-stats .crm-profile-credit strong {
        color: #73e3d1;
    }
    body.crm-night-mode .crm-profile-menu-stats .crm-profile-expire strong {
        color: #ff6b6b;
    }
    body.crm-night-mode .crm-search-icon,
    body.crm-night-mode .crm-action-btn svg,
    body.crm-night-mode .crm-action-btn {
        color: #c7d7e5;
    }
    body.crm-night-mode .dash-table-wrap th {
        background: #101a28;
        color: #c7d7e5;
    }
    body.crm-night-mode .dash-table-wrap td,
    body.crm-night-mode .activity-list li {
        color: #b9c9d8;
        border-color: #26384b;
    }
    body.crm-night-mode .crm-info-item.is-warning {
        background: linear-gradient(180deg, #2b2618 0%, #221b10 100%);
        border-color: #6f592a;
    }
    body.crm-night-mode .crm-info-item.is-danger {
        background: linear-gradient(180deg, #311b22 0%, #26131a 100%);
        border-color: #713748;
    }
    body.crm-night-mode .sidebar-foot .dark-row {
        background: rgba(255,255,255,.22);
        color: #ffffff;
    }
        font-size: 14px;
    }
    .dash-table-wrap td { vertical-align: middle; }
    .api-status-ok { color: #16a34a; font-weight: 800; }
    .api-status-bad { color: #dc2626; font-weight: 800; }

    html,
    body {
        max-width: 100%;
        overflow-x: hidden;
    }
    body {
        background: #f8fbfd;
    }
    *,
    *:before,
    *:after {
        box-sizing: border-box;
    }
    .uk-container {
        width: 100%;
        max-width: 1260px !important;
        padding: 0 16px;
        box-sizing: border-box !important;
    }
    .portal-shell {
        margin-top: 0;
    }
    .portal-layout {
        grid-template-columns: minmax(0, 1fr) 210px;
        gap: 0;
        align-items: start;
        background: #fbfdff;
        box-shadow: 0 12px 48px rgba(45, 82, 120, 0.09);
    }
    .portal-main {
        padding: 0 20px 18px;
        background: linear-gradient(180deg, #ffffff 0%, #f9fcff 100%);
    }
    .portal-sidebar {
        width: 210px;
        min-height: 100vh;
        top: 0;
        border-radius: 0;
        padding: 20px 6px 18px 10px;
        background: linear-gradient(180deg, #3fae9c 0%, #1f8375 58%, #2e998a 100%);
        box-shadow: inset 1px 0 0 rgba(255,255,255,.2), -10px 0 34px rgba(33, 137, 124, .22);
    }
    .sidebar-brand {
        border: 0;
        background: transparent;
        padding: 0 0 14px 4px;
        margin-bottom: 8px;
        border-bottom: 1px solid rgba(255,255,255,.18);
        display: grid;
        grid-template-columns: minmax(0, 1fr) 44px;
        align-items: center;
        gap: 4px;
        direction: rtl;
        text-align: right;
    }
    .sidebar-brand-copy {
        min-width: 0;
    }
    .sidebar-brand-title {
        margin: 0;
        font-size: 14px;
        letter-spacing: 0;
        font-weight: 800;
        line-height: 1.8;
        color: #ffffff;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    .sidebar-brand-sub {
        display: block;
        margin-top: 2px;
        color: rgba(255,255,255,.76);
        font-size: 10px;
        font-weight: 700;
    }
    .sidebar-section-title,
    .sidebar-flat .menu-head {
        display: none;
    }
    .sidebar-menu a,
    .sidebar-flat .menu-item a {
        grid-template-columns: 24px 1fr;
        min-height: 34px;
        padding: 8px 10px;
        border: 0;
        background: transparent;
        color: #efffff;
        box-shadow: none;
        font-size: 12px;
        border-radius: 7px;
    }
    .sidebar-menu .active,
    .sidebar-flat .menu-item a:hover {
        background: rgba(255,255,255,.23);
        border: 0;
    }
    .sidebar-menu .icon,
    .sidebar-flat .icon {
        width: 22px;
        height: 22px;
        background: transparent;
        font-size: 13px;
    }
    .sidebar-foot {
        margin-top: 28px;
        padding-top: 16px;
        border-top-color: rgba(255,255,255,.34);
    }
    .sidebar-foot .dark-row,
    .sidebar-foot .user-row {
        font-size: 12px;
        padding: 0 8px;
    }
    .sidebar-foot .logout-btn {
        border-radius: 7px;
        background: rgba(255,255,255,.13);
        font-size: 12px;
    }
    .crm-menu {
        display: flex;
        flex-direction: column;
        gap: 6px;
        margin: 0;
        padding: 0;
        list-style: none;
    }
    .crm-menu li {
        margin: 0;
    }
    .crm-menu a {
        display: grid;
        grid-template-columns: 22px minmax(0, 1fr);
        align-items: center;
        gap: 9px;
        min-height: 38px;
        padding: 8px 10px;
        border-radius: 8px;
        color: rgba(255,255,255,.92) !important;
        font-size: 12px;
        font-weight: 700;
        line-height: 1.4;
        text-decoration: none;
        transition: background-color .2s ease, color .2s ease, transform .2s ease, box-shadow .2s ease;
    }
    .crm-menu a:hover {
        background: rgba(10, 76, 70, .34);
        color: #fff !important;
        box-shadow: inset 0 0 0 1px rgba(255,255,255,.18), 0 8px 18px rgba(8, 72, 66, .16);
        transform: translateX(-2px);
    }
    .crm-menu .active {
        background: rgba(255,255,255,.2);
        color: #fff !important;
        box-shadow: inset 0 0 0 1px rgba(255,255,255,.18);
    }
    .crm-menu a:hover .crm-menu-icon,
    .crm-menu .active .crm-menu-icon {
        opacity: 1;
    }
    .crm-menu-icon {
        width: 22px;
        height: 22px;
        color: currentColor;
        opacity: .92;
    }
    .sidebar-wallet {
        margin: 12px 0 8px;
        padding: 10px;
        border-radius: 8px;
        background: rgba(255,255,255,.16);
        color: #fff;
        font-size: 11px;
        font-weight: 800;
        line-height: 1.8;
    }
    .sidebar-wallet small {
        display: block;
        color: rgba(255,255,255,.78);
        font-size: 10px;
        font-weight: 700;
    }
    .menu-toggle {
        width: 38px;
        height: 38px;
        border: 0;
        border-radius: 8px;
        background: rgba(255,255,255,.2);
        color: #ffffff;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        cursor: pointer;
        transition: background-color .2s ease, transform .2s ease;
    }
    .menu-toggle:hover {
        background: rgba(255,255,255,.32);
        transform: translateY(-1px);
    }
    .menu-toggle span,
    .menu-toggle:before,
    .menu-toggle:after {
        content: '';
        width: 18px;
        height: 2px;
        border-radius: 999px;
        background: currentColor;
        display: block;
        position: absolute;
    }
    .menu-toggle {
        position: relative;
    }
    .menu-toggle:before {
        transform: translateY(-6px);
    }
    .menu-toggle:after {
        transform: translateY(6px);
    }
    .portal-layout.sidebar-collapsed {
        grid-template-columns: minmax(0, 1fr) 74px;
    }
    .portal-layout.portal-layout-standalone {
        grid-template-columns: minmax(0, 1fr);
    }
    .sidebar-toggle-row {
        display: none;
    }
    .portal-sidebar .menu-toggle {
        background: rgba(255,255,255,.2);
        color: #ffffff;
    }
    .portal-sidebar .menu-toggle:hover {
        background: rgba(255,255,255,.32);
    }
    .portal-head-row.is-standalone {
        min-height: 45px;
        display: flex;
        align-items: center;
        justify-content: flex-start;
        position: relative;
        direction: ltr;
    }
    .portal-head-row.is-standalone .crm-brand {
        direction: ltr;
    }
    .crm-standalone-head {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        min-width: 0;
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 3px;
        text-align: center;
        direction: rtl;
    }
    .crm-standalone-head span {
        color: #6f8298;
        font-size: 12px;
        font-weight: 800;
    }
    .crm-standalone-head strong {
        color: #173a5c;
        font-size: 15px;
        font-weight: 900;
        line-height: 1.5;
    }
    .crm-login-section {
        min-height: calc(100vh - 170px);
        padding: 54px 18px 72px;
        display: flex;
        align-items: flex-start;
        justify-content: center;
        background: linear-gradient(180deg, #ffffff 0%, #f7fbfd 100%);
    }
    .crm-login-card {
        width: min(430px, 100%);
        padding: 28px;
        border: 1px solid #e6edf4;
        border-radius: 10px;
        background: #ffffff;
        box-shadow: 0 14px 42px rgba(39, 75, 115, .1);
        direction: rtl;
    }
    .crm-login-title {
        margin: 0 0 22px;
        color: #294464;
        font-size: 24px;
        font-weight: 900;
        text-align: center;
    }
    .crm-login-form {
        display: grid;
        gap: 15px;
        margin: 0;
    }
    .crm-login-field {
        display: grid;
        gap: 7px;
        color: #60778f;
        font-size: 12px;
        font-weight: 800;
    }
    .crm-login-field input {
        width: 100%;
        height: 44px;
        border: 1px solid #dce7f1;
        border-radius: 8px;
        background: #f9fcff;
        color: #294464;
        direction: ltr;
        padding: 0 12px;
        outline: none;
        font-size: 16px;
    }
    .crm-login-field input:focus {
        border-color: #55c7c5;
        box-shadow: 0 0 0 3px rgba(85, 199, 197, .16);
        background: #ffffff;
    }
    .crm-login-submit {
        height: 46px;
        border: 0;
        border-radius: 8px;
        background: linear-gradient(90deg, #54bfae 0%, #2f9d8d 100%);
        color: #ffffff;
        cursor: pointer;
        font-size: 16px;
        font-weight: 900;
        box-shadow: 0 10px 24px rgba(47, 157, 141, .22);
    }
    .portal-main > div:not(.portal-head):not(.portal-toolbar):not(.crm-info-grid):not(.portal-kpi-grid):not(.portal-status-row):not(.portal-shift):not(.portal-calllog):not(.portal-widgets):not(.bottom-grid):not(.dash-table-wrap):not(.crm-login-section) {
        padding: 24px 0 36px;
        direction: rtl;
    }
    .portal-main .uk-card.uk-card-default {
        width: 100%;
        padding: 24px;
        border: 1px solid #bfd0e2;
        border-radius: 10px;
        background: #ffffff;
        box-shadow: 0 16px 36px rgba(36, 59, 90, .09);
        box-sizing: border-box;
    }
    .portal-main .uk-card-title {
        margin: 0 0 22px;
        color: #294464;
        font-size: 22px;
        font-weight: 900;
    }
    .portal-main .uk-card-title small {
        color: #c24141 !important;
        font-size: 14px;
        font-weight: 900;
    }
    .portal-main .uk-fieldset {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 16px 18px;
        min-width: 0;
        margin: 0;
        padding: 0;
        border: 0;
    }
    .portal-main .uk-margin {
        margin: 0;
        min-width: 0;
    }
    .portal-main .uk-form-label {
        display: block;
        margin-bottom: 7px;
        color: #243b5a;
        font-size: 12px;
        font-weight: 900;
    }
    .portal-main .uk-input,
    .portal-main .uk-select,
    .portal-main .uk-textarea {
        width: 100%;
        max-width: none !important;
        border: 1px solid #c4d3e3;
        border-radius: 8px;
        background: #f8fafc;
        color: #1f344d;
        outline: none;
        font-size: 14px;
        box-sizing: border-box;
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, .75);
    }
    .portal-main .uk-input,
    .portal-main .uk-select {
        height: 42px;
        padding: 0 12px;
    }
    .portal-main .crm-select-native {
        position: absolute !important;
        width: 1px !important;
        height: 1px !important;
        margin: 0 !important;
        padding: 0 !important;
        opacity: 0;
        pointer-events: none;
    }
    .crm-select {
        position: relative;
        display: block;
        width: 100%;
        min-width: 0;
        direction: rtl;
    }
    .crm-select-button {
        position: relative;
        display: flex;
        align-items: center;
        width: 100%;
        height: 42px;
        padding: 0 12px 0 36px;
        border: 1px solid #c4d3e3;
        border-radius: 8px;
        background: #f8fafc;
        color: #1f344d;
        font: inherit;
        text-align: right;
        cursor: pointer;
        box-sizing: border-box;
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, .75);
    }
    .crm-select-button:after {
        position: absolute;
        top: 50%;
        left: 13px;
        width: 7px;
        height: 7px;
        border-right: 2px solid #667085;
        border-bottom: 2px solid #667085;
        content: "";
        transform: translateY(-70%) rotate(45deg);
    }
    .crm-select.is-open .crm-select-button,
    .crm-select-button:focus {
        border-color: #2fb49f;
        background: #ffffff;
        outline: none;
        box-shadow: 0 0 0 3px rgba(47, 180, 159, .15);
    }
    .crm-select-button:disabled {
        background: #f2f4f7;
        color: #98a2b3;
        cursor: not-allowed;
    }
    .crm-select-menu {
        position: fixed;
        z-index: 10050;
        display: none;
        max-height: 280px;
        overflow-x: hidden;
        overflow-y: auto;
        padding: 5px;
        border: 1px solid #c4d3e3;
        border-radius: 9px;
        background: #ffffff;
        direction: rtl;
        box-shadow: 0 14px 34px rgba(31, 52, 77, .2);
        box-sizing: border-box;
    }
    .crm-select-menu.is-open {
        display: block;
    }
    .crm-select-option,
    .crm-select-group {
        display: block;
        width: 100%;
        border: 0;
        background: transparent;
        color: #1f344d;
        font: inherit;
        text-align: right;
        box-sizing: border-box;
    }
    .crm-select-option {
        min-height: 36px;
        padding: 8px 10px;
        border-radius: 6px;
        cursor: pointer;
    }
    .crm-select-option:hover,
    .crm-select-option:focus {
        background: #eef8f7;
        outline: none;
    }
    .crm-select-option.is-selected {
        background: #dff5f1;
        color: #0f766e;
        font-weight: 900;
    }
    .crm-select-option:disabled {
        color: #98a2b3;
        cursor: not-allowed;
    }
    .crm-select-group {
        padding: 7px 10px 4px;
        color: #667085;
        font-size: 11px;
        font-weight: 900;
    }
    body.crm-night-mode .crm-select-button,
    body.crm-night-mode .crm-select-menu {
        border-color: #40566d;
        background: #172536;
        color: #e4eef7;
    }
    body.crm-night-mode .crm-select-option {
        color: #e4eef7;
    }
    body.crm-night-mode .crm-select-option:hover,
    body.crm-night-mode .crm-select-option:focus,
    body.crm-night-mode .crm-select-option.is-selected {
        background: #24483f;
        color: #9be3d7;
    }
    .portal-main .uk-textarea {
        min-height: 82px;
        padding: 10px 12px;
    }
    .portal-main .uk-input:focus,
    .portal-main .uk-select:focus,
    .portal-main .uk-textarea:focus {
        border-color: #2fb49f;
        background: #ffffff;
        box-shadow: 0 0 0 3px rgba(47, 180, 159, .15);
    }
    .portal-main .uk-button,
    .portal-main #submitBtn {
        width: 100%;
        height: 44px;
        border: 0;
        border-radius: 10px;
        background: linear-gradient(90deg, #36b8a5 0%, #218f80 100%);
        color: #ffffff;
        cursor: pointer;
        font-size: 15px;
        font-weight: 900;
        box-shadow: 0 10px 20px rgba(33, 143, 128, .18);
    }
    .portal-main .js-upload {
        border: 1px dashed #b7c8da;
        border-radius: 10px;
        background: #f8fafc;
        color: #52657c;
    }
    .portal-main .crm-form-page {
        direction: rtl;
        font-size: 110%;
        background: #f2f6fa;
        padding-top: 18px;
        padding-bottom: 18px;
    }
    .portal-main .crm-form-head {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        margin-bottom: 16px;
    }
    .portal-main .crm-form-head h3 {
        margin: 0;
        color: #243b5a;
        font-weight: 900;
    }
    .portal-main .crm-form-head span {
        color: #52657c;
        font-size: 12px;
    }
    .portal-main .crm-form .uk-fieldset {
        display: block !important;
        width: 100%;
    }
    .portal-main .crm-form .uk-fieldset.crm-form-grid {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 18px 20px;
        align-items: start;
    }
    .portal-main .crm-form-grid > .uk-margin {
        margin: 0 !important;
    }
    .portal-main .crm-form .uk-fieldset > .crm-form-tabs,
    .portal-main .crm-form .uk-fieldset > .crm-form-switcher,
    .portal-main .crm-form .uk-fieldset > .uk-margin {
        width: 100%;
    }
    .portal-main .crm-form-tabs {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
        border-bottom: 1px solid #d8e3ee;
        margin: 0 0 18px !important;
        padding: 0 0 14px !important;
        list-style: none;
    }
    .portal-main .crm-form-tabs:before {
        display: none;
    }
    .portal-main .crm-form-tabs > li {
        flex: 1 1 180px;
        padding: 0;
        list-style: none;
    }
    .portal-main .crm-form-tabs > li > a {
        display: flex !important;
        align-items: center;
        justify-content: center;
        min-height: 40px;
        border: 1px solid #c5d3e2 !important;
        border-radius: 10px;
        background: #f8fafc !important;
        color: #243b5a !important;
        font-weight: 900;
    }
    .portal-main .crm-form-tabs > li.uk-active > a {
        background: #2fb49f !important;
        border-color: #2fb49f !important;
        color: #ffffff !important;
    }
    .portal-main .crm-form-switcher {
        margin: 0 !important;
        padding: 0 !important;
        list-style: none;
    }
    .portal-main .crm-form-switcher > li {
        list-style: none;
    }
    .portal-main .crm-form-switcher > li:not(.uk-active) {
        display: none;
    }
    .portal-main .crm-form-switcher > li.uk-active {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 18px 20px;
        align-items: start;
    }
    .portal-main .crm-form-switcher .uk-margin {
        display: grid;
        gap: 7px;
        align-content: start;
        margin: 0 !important;
    }
    .portal-main .crm-form-switcher .uk-form-label {
        margin-bottom: 0;
    }
    .portal-main .crm-form-wide {
        grid-column: 1 / -1;
    }
    .portal-main .crm-form-map {
        margin-top: 14px;
        border: 1px solid #bfd0e2;
        border-radius: 12px;
        background: #ffffff;
        overflow: hidden;
        box-shadow: 0 16px 36px rgba(36, 59, 90, .08);
    }
    .portal-main .crm-form-map-head {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        padding: 12px 14px;
        border-bottom: 1px solid #d8e3ee;
        background: #f3f7fb;
    }
    .portal-main .crm-form-map-head strong {
        color: #243b5a;
        font-weight: 900;
    }
    .portal-main .crm-form-map-head a {
        color: #0f766e;
        font-weight: 800;
    }
    .portal-main .crm-form-map img {
        display: block;
        width: 100%;
        height: auto;
        max-height: 600px;
        object-fit: cover;
    }
    .portal-main .uk-alert-success,
    .portal-main .uk-alert-danger {
        grid-column: 1 / -1;
    }
    .portal-main .uk-margin:has(#submitBtn),
    .portal-main .uk-margin:last-child {
        grid-column: 1 / -1;
    }
    .portal-main .crm-form-switcher > li > .uk-margin:last-child {
        grid-column: auto;
    }
    .portal-main .crm-form-switcher > li > .crm-form-wide,
    .portal-main .crm-form-switcher > li > .crm-form-wide:last-child {
        grid-column: 1 / -1;
    }
    .portal-layout.sidebar-collapsed .portal-sidebar {
        width: 74px;
        padding-left: 8px;
        padding-right: 8px;
    }
    .portal-layout.sidebar-collapsed .sidebar-brand {
        text-align: center;
        grid-template-columns: 1fr;
        justify-items: center;
        padding: 0 0 12px;
    }
    .portal-layout.sidebar-collapsed .sidebar-brand-copy {
        display: none;
    }
    .portal-layout.sidebar-collapsed .sidebar-brand-sub,
    .portal-layout.sidebar-collapsed .crm-menu span,
    .portal-layout.sidebar-collapsed .sidebar-foot span:not(.icon) {
        display: none;
    }
    .portal-layout.sidebar-collapsed .crm-menu a {
        grid-template-columns: 1fr;
        justify-items: center;
        padding: 9px 0;
    }
    .portal-layout.sidebar-collapsed .crm-menu-icon {
        width: 24px;
        height: 24px;
    }
    .portal-layout.sidebar-collapsed .sidebar-foot .dark-row,
    .portal-layout.sidebar-collapsed .sidebar-foot .user-row {
        justify-content: center;
    }
    .portal-head {
        margin: 0 0 16px;
        border-radius: 0;
        padding: 12px 20px;
        background: #ffffff;
        border-bottom: 1px solid #e8f0f5;
        box-shadow: 0 4px 18px rgba(39, 75, 115, .05);
        position: sticky;
        top: 0;
        z-index: 45;
    }
    .portal-head-row {
        display: grid;
        grid-template-columns: minmax(136px, auto) minmax(260px, 1fr) auto 230px;
        align-items: center;
        gap: 18px;
        width: 100%;
        direction: ltr;
    }
    .portal-head-row.no-search {
        grid-template-columns: minmax(136px, auto) minmax(0, 1fr) auto 230px;
    }
    .crm-brand {
        display: inline-flex;
        align-items: center;
        gap: 10px;
        color: #173a5c;
        font-weight: 900;
        white-space: nowrap;
        font-size: 15px;
    }
    .crm-brand:hover {
        color: #173a5c;
    }
    .crm-brand-mark {
        width: 32px;
        height: 32px;
        display: inline-block;
        border-radius: 6px;
        background: linear-gradient(135deg, #2f9d96 0 46%, #5bcfca 46% 100%);
        clip-path: polygon(50% 0, 100% 28%, 100% 72%, 50% 100%, 0 72%, 0 28%);
    }
    .crm-header-search {
        min-width: 0;
    }
    .crm-header-search .portal-search-form {
        height: 44px;
        max-width: 470px;
        margin: 0 auto;
        display: grid;
        grid-template-columns: 24px minmax(0, 1fr) auto;
        align-items: center;
        gap: 10px;
        padding: 0 14px;
        border: 1px solid #e5edf4;
        border-radius: 9px;
        background: #ffffff;
        box-shadow: 0 6px 18px rgba(39, 75, 115, .04);
        direction: rtl;
    }
    .crm-search-icon {
        width: 19px;
        height: 19px;
        color: #5b7695;
    }
    .crm-header-search .portal-search-input {
        height: 100%;
        min-width: 0;
        border: 0;
        border-radius: 0;
        background: transparent;
        box-shadow: none;
        color: #6f8298;
        text-align: right;
        padding: 0;
    }
    .crm-header-search kbd {
        padding: 5px 8px;
        border-radius: 6px;
        background: #f4f7fa;
        color: #71849a;
        font-size: 10px;
        font-weight: 900;
        direction: ltr;
    }
    .crm-header-actions {
        display: inline-flex;
        align-items: center;
        gap: 12px;
        color: #223e5c;
    }
    .crm-action-btn {
        position: relative;
        width: 30px;
        height: 30px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        color: #1f3f62;
    }
    .crm-action-btn svg {
        width: 20px;
        height: 20px;
    }
    .crm-action-btn span {
        position: absolute;
        top: -5px;
        right: -3px;
        min-width: 16px;
        height: 16px;
        padding: 0 4px;
        border-radius: 999px;
        background: #1fc0a4;
        color: #ffffff;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        font-size: 9px;
        font-weight: 900;
        line-height: 1;
    }
    .crm-action-btn span.is-danger {
        background: #f0466b;
    }
    .crm-help-btn:after {
        content: attr(data-help-tooltip);
        position: absolute;
        top: calc(100% + 10px);
        left: 50%;
        transform: translateX(-50%) translateY(-4px);
        min-width: 210px;
        padding: 8px 12px;
        border-radius: 10px;
        background: #1d334c;
        color: #fff;
        font-size: 12px;
        font-weight: 800;
        line-height: 1.8;
        text-align: center;
        white-space: nowrap;
        opacity: 0;
        pointer-events: none;
        transition: opacity .18s ease, transform .18s ease;
        z-index: 60;
        box-shadow: 0 10px 24px rgba(20, 38, 58, .18);
    }
    .crm-help-btn:hover:after,
    .crm-help-btn:focus-visible:after {
        opacity: 1;
        transform: translateX(-50%) translateY(0);
    }
    .crm-header-profile {
        width: 230px;
        height: 86px;
        display: grid;
        grid-template-columns: 28px minmax(0, 1fr) 66px;
        align-items: center;
        gap: 14px;
        padding: 10px 12px;
        border: 0;
        border-radius: 0;
        background: #ffffff;
        color: #223b58;
        cursor: pointer;
        direction: ltr;
    }
    .crm-profile-wrap {
        position: relative;
        justify-self: end;
    }
    .mobile-menu-toggle {
        display: none;
    }
    .crm-header-profile-caret {
        width: 11px;
        height: 11px;
        border-left: 2px solid #60778f;
        border-bottom: 2px solid #60778f;
        transform: rotate(-45deg);
        justify-self: center;
    }
    .crm-header-profile-avatar {
        width: 66px;
        height: 66px;
        border-radius: 50%;
        overflow: hidden;
        background: #2f3439;
        color: #ffffff;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        font-size: 14px;
        font-weight: 900;
        box-shadow: 0 8px 22px rgba(17, 48, 72, .16);
    }
    .crm-header-profile-avatar img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        display: block;
    }
    .crm-header-profile-meta {
        min-width: 0;
        line-height: 1.55;
        text-align: right;
        direction: rtl;
    }
    .crm-header-profile-meta strong,
    .crm-header-profile-meta span {
        display: block;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    .crm-header-profile-meta strong {
        color: #263e58;
        font-size: 18px;
        font-weight: 900;
    }
    .crm-header-profile-meta span {
        color: #7a8fa5;
        font-size: 13px;
        font-weight: 800;
    }
    .crm-profile-menu {
        position: absolute;
        top: calc(100% + 10px);
        left: 0;
        width: 286px;
        padding: 14px;
        border: 1px solid #e4edf5;
        border-radius: 12px;
        background: #ffffff;
        box-shadow: 0 18px 42px rgba(24, 55, 86, .16);
        z-index: 80;
        direction: rtl;
    }
    .crm-profile-menu[hidden] {
        display: none;
    }
    .crm-profile-menu-head {
        display: grid;
        grid-template-columns: 58px minmax(0, 1fr);
        align-items: center;
        gap: 12px;
        padding-bottom: 12px;
    }
    .crm-profile-menu-avatar {
        width: 58px;
        height: 58px;
        border-radius: 50%;
        overflow: hidden;
        background: #2f3439;
        color: #ffffff;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        font-size: 14px;
        font-weight: 900;
    }
    .crm-profile-menu-avatar img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        display: block;
    }
    .crm-profile-menu-person {
        min-width: 0;
        line-height: 1.6;
    }
    .crm-profile-menu-person strong,
    .crm-profile-menu-person span {
        display: block;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    .crm-profile-menu-person strong {
        color: #213c5b;
        font-size: 16px;
        font-weight: 900;
    }
    .crm-profile-menu-person span {
        color: #7b90a6;
        font-size: 12px;
        font-weight: 800;
    }
    .crm-profile-menu-stats {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 8px;
        padding: 12px 0;
        border-top: 1px solid #edf2f7;
        border-bottom: 1px solid #edf2f7;
    }
    .crm-profile-menu-stats div {
        padding: 9px 10px;
        border-radius: 9px;
        background: #f6fafc;
    }
    .crm-profile-menu-stats .crm-profile-credit {
        grid-column: 1 / -1;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 10px;
    }
    .crm-profile-menu-stats span,
    .crm-profile-menu-stats strong {
        display: block;
        white-space: nowrap;
    }
    .crm-profile-menu-stats span {
        color: #8298ad;
        font-size: 11px;
        font-weight: 800;
    }
    .crm-profile-menu-stats strong {
        margin-top: 4px;
        color: #1f3f62;
        font-size: 13px;
        font-weight: 900;
    }
    .crm-profile-menu-stats .crm-profile-credit strong {
        margin-top: 0;
        color: #11907e;
    }
    .crm-profile-menu-stats .crm-profile-expire strong {
        color: #dc2626;
    }
    .crm-profile-menu-links {
        display: grid;
        gap: 4px;
        padding-top: 10px;
    }
    .crm-profile-menu-links a {
        position: relative;
        min-height: 36px;
        display: grid;
        grid-template-columns: 22px minmax(0, 1fr) auto;
        align-items: center;
        gap: 10px;
        padding: 8px 10px;
        border-radius: 9px;
        color: #294464;
        font-size: 12px;
        font-weight: 900;
        overflow: hidden;
        transition: background-color .18s ease, color .18s ease, transform .18s ease, box-shadow .18s ease;
    }
    .crm-profile-menu-links a:before {
        content: '';
        width: 3px;
        position: absolute;
        top: 8px;
        bottom: 8px;
        right: 0;
        border-radius: 999px 0 0 999px;
        background: transparent;
        transition: background-color .18s ease;
    }
    .crm-profile-menu-links a svg {
        width: 20px;
        height: 20px;
        color: currentColor;
    }
    .crm-profile-menu-links a span {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    .crm-profile-menu-links a:hover {
        background: #e7f2f0;
        color: #0f6f63;
        box-shadow: inset 0 0 0 1px #d4e7e3;
        transform: translateX(-2px);
    }
    .crm-profile-menu-links a:hover:before {
        background: #17a894;
    }
    .crm-profile-menu-links b {
        min-width: 20px;
        height: 20px;
        padding: 0 6px;
        border-radius: 999px;
        background: #1fc0a4;
        color: #ffffff;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        font-size: 10px;
        font-weight: 900;
    }
    .crm-profile-menu-links b.is-danger {
        background: #f0466b;
    }
    .top-icons {
        display: flex;
        align-items: center;
        gap: 18px;
        color: #ffffff;
    }
    .top-icons .badge {
        width: 42px;
        height: 42px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        border-radius: 50%;
        background: rgba(255,255,255,.88);
        color: #56bfbd;
        font-size: 13px;
        font-weight: 800;
    }
    .top-icons .mini {
        font-size: 18px;
        opacity: .94;
    }
    .portal-search-input {
        height: 42px;
        border: 0;
        border-radius: 6px;
        background: rgba(255,255,255,.82);
        color: #7f9aaf;
        text-align: center;
        box-shadow: 0 1px 0 rgba(255,255,255,.4), inset 0 0 0 1px rgba(255,255,255,.42);
    }
    .portal-title {
        justify-self: start;
        font-size: 20px;
        color: #ffffff;
        font-weight: 800;
    }
    .crm-info-grid {
        display: grid;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 12px;
        margin-bottom: 18px;
    }
    .crm-info-item {
        min-height: 76px;
        padding: 13px 14px;
        border: 1px solid #e6edf4;
        border-radius: 8px;
        background: #ffffff;
        box-shadow: 0 4px 18px rgba(39, 75, 115, .06);
    }
    .crm-info-item.is-warning {
        border-color: #f4d58c;
        background: linear-gradient(180deg, #fffaf0 0%, #fff4dc 100%);
        box-shadow: 0 4px 18px rgba(198, 143, 36, .1);
    }
    .crm-info-item.is-warning .crm-info-label,
    .crm-info-item.is-warning .crm-info-hint {
        color: #b7791f;
    }
    .crm-info-item.is-danger {
        border-color: #f0b4b4;
        background: linear-gradient(180deg, #fff6f6 0%, #ffecec 100%);
        box-shadow: 0 4px 18px rgba(190, 58, 58, .1);
    }
    .crm-info-item.is-danger .crm-info-label,
    .crm-info-item.is-danger .crm-info-hint {
        color: #c24141;
    }
    .crm-info-label {
        color: #8aa0b7;
        font-size: 11px;
        font-weight: 800;
    }
    .crm-info-value {
        margin-top: 6px;
        color: #294464;
        font-size: 16px;
        font-weight: 900;
    }
    .crm-info-hint {
        margin-top: 3px;
        color: #42b9b6;
        font-size: 11px;
        font-weight: 800;
    }
    .portal-toolbar {
        display: flex;
        justify-content: space-between;
        margin-bottom: 22px;
        padding: 0;
        border: 0;
        background: transparent;
        box-shadow: none;
    }
    .portal-user {
        width: 100%;
        margin-right: 0;
        direction: rtl;
        text-align: right;
        color: #294464;
        font-size: 20px;
        font-weight: 800;
        line-height: 1.9;
    }
    .portal-tools {
        display: none;
    }
    .portal-kpi-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 18px;
        margin-bottom: 26px;
    }
    .portal-kpi-grid > div:nth-child(n+5),
    .portal-status-row,
    .portal-shift,
    .portal-calllog {
        display: none;
    }
    .portal-card,
    .widget-card,
    .dash-table-wrap,
    .mini-panel {
        border: 1px solid #e6edf4;
        border-radius: 8px;
        background: #ffffff;
        box-shadow: 0 4px 18px rgba(39, 75, 115, .08);
    }
    .portal-card {
        min-height: 116px;
        padding: 18px 18px 14px;
        position: relative;
    }
    .portal-card:before {
        content: '';
        position: absolute;
        top: 18px;
        right: 18px;
        width: 42px;
        height: 42px;
        border-radius: 50%;
        background: linear-gradient(135deg, #66d2d0, #40bdbb);
        box-shadow: 0 8px 18px rgba(76, 195, 193, .22);
    }
    .portal-kpi-label {
        padding-right: 58px;
        color: #5d7894;
        font-size: 12px;
        font-weight: 700;
    }
    .portal-kpi-value {
        margin-top: 14px;
        color: #294464;
        font-size: 27px;
        text-align: left;
    }
    .portal-kpi-note {
        margin-top: 14px;
        color: #26b377;
        font-size: 12px;
        text-align: left;
    }
    .portal-widgets {
        grid-template-columns: minmax(0, 2fr) minmax(260px, .9fr);
        gap: 20px;
        margin-bottom: 20px;
        direction: ltr;
    }
    .portal-widgets .widget-card:last-child {
        grid-column: auto;
    }
    .widget-card {
        min-height: 0;
        padding: 18px;
        direction: rtl;
    }
    .widget-title {
        margin-bottom: 16px;
        color: #294464;
        font-size: 15px;
        text-align: right;
    }
    .wide-widget {
        min-height: 335px;
    }
    .chart-frame {
        height: 260px;
        padding: 12px 8px 0;
        background: linear-gradient(180deg, #ffffff 0%, #f8fcff 100%);
    }
    .spark-line {
        height: 225px;
        border: 0;
        border-radius: 0;
        background: linear-gradient(180deg, rgba(95, 207, 205, .08) 0%, rgba(95, 207, 205, .02) 100%);
    }
    .target-card {
        text-align: center;
    }
    .target-ring {
        width: 150px;
        height: 150px;
        margin: 18px auto;
        border-radius: 50%;
        background: conic-gradient(#55c7c5 0 72%, #eaf2f5 72% 100%);
        position: relative;
    }
    .target-ring:after {
        content: '';
        position: absolute;
        inset: 20px;
        background: #fff;
        border-radius: 50%;
    }
    .target-ring strong {
        position: relative;
        z-index: 2;
        display: block;
        padding-top: 49px;
        color: #294464;
        font-size: 26px;
    }
    .target-ring small {
        position: relative;
        z-index: 2;
        display: block;
        color: #7d94a9;
        font-size: 11px;
    }
    .legend-list,
    .pipeline-list,
    .task-list,
    .reminder-list {
        margin: 0;
        padding: 0;
        list-style: none;
    }
    .legend-list li,
    .pipeline-list li,
    .task-list li,
    .reminder-list li {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        padding: 8px 0;
        color: #405c79;
        font-size: 12px;
        border-bottom: 1px solid #eef3f8;
    }
    .legend-list li:last-child,
    .pipeline-list li:last-child,
    .task-list li:last-child,
    .reminder-list li:last-child {
        border-bottom: 0;
    }
    .legend-dot {
        display: inline-block;
        width: 8px;
        height: 8px;
        border-radius: 50%;
        margin-left: 6px;
        background: #55c7c5;
    }
    .donut-wrap {
        width: 172px;
        height: 172px;
        background: conic-gradient(#26bab8 0 34%, #58d2b4 34% 55%, #ffd05d 55% 70%, #ff826f 70% 82%, #7f4df1 82% 92%, #16b8d0 92% 100%);
    }
    .donut-wrap:after {
        inset: 48px;
    }
    .donut-text {
        margin-top: -111px;
        font-size: 28px;
    }
    .pipeline-bar {
        flex: 1;
        height: 8px;
        border-radius: 999px;
        background: #eef3f8;
        overflow: hidden;
    }
    .pipeline-bar span {
        display: block;
        height: 100%;
        border-radius: inherit;
        background: linear-gradient(90deg, #57c7c5, #37b5b3);
    }
    .activity-list li {
        grid-template-columns: 26px 1fr auto;
        align-items: center;
        border-bottom: 1px solid #eef3f8;
        font-size: 12px;
    }
    .activity-time {
        color: #294464;
    }
    .activity-icon {
        width: 24px;
        height: 24px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        border-radius: 50%;
        background: #e8fbfa;
        color: #43bcba;
    }
    .bottom-grid {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 20px;
        margin-bottom: 20px;
    }
    .mini-panel {
        padding: 18px;
    }
    .dash-table-wrap {
        margin-top: 0;
    }
    .dash-table-head {
        display: flex;
        justify-content: space-between;
        align-items: center;
        gap: 12px;
        padding: 16px 18px;
        border-bottom: 1px solid #edf2f7;
    }
    .dash-table-title {
        margin: 0;
        color: #294464;
        font-size: 15px;
        font-weight: 800;
    }
    .dash-table-count {
        padding: 4px 10px;
        border-radius: 999px;
        background: #eafafa;
        color: #36aaa8;
        font-size: 11px;
        font-weight: 800;
    }
    .unit-table {
        width: 100%;
        border-collapse: collapse;
    }
    .unit-table th,
    .unit-table td {
        padding: 13px 16px;
        border-bottom: 1px solid #edf2f7;
        vertical-align: middle;
    }
    .dash-table-wrap th {
        background: #fbfdff;
        color: #7a8fa5;
        text-align: right;
        font-size: 12px;
    }
    .dash-table-wrap td {
        color: #405c79;
        font-size: 12px;
    }
    .unit-row:last-child td {
        border-bottom: 0;
    }
    .unit-index {
        width: 42px;
        height: 42px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        border-radius: 50%;
        background: #effafa;
        color: #39aaa8;
        font-weight: 900;
    }
    .unit-person a {
        color: #294464;
        font-size: 13px;
        font-weight: 800;
    }
    .unit-person small,
    .unit-muted {
        display: block;
        margin-top: 4px;
        color: #8ba0b5;
        font-size: 11px;
        font-weight: 600;
    }
    .unit-phone-list {
        display: flex;
        flex-direction: column;
        gap: 5px;
    }
    .unit-phone-list a,
    .unit-phone-list span {
        color: #405c79;
        font-weight: 700;
    }
    .unit-badge {
        display: inline-flex;
        align-items: center;
        max-width: 190px;
        padding: 5px 9px;
        border-radius: 999px;
        background: #f3f8fb;
        color: #48627d;
        font-weight: 800;
    }

    @media (max-width: 640px) {
        .uk-container {
            width: 100% !important;
            max-width: 100% !important;
            padding-left: 12px;
            padding-right: 12px;
            box-sizing: border-box !important;
        }
        .portal-layout {
            grid-template-columns: 1fr;
            margin-left: -12px;
            margin-right: -12px;
            overflow-x: hidden;
        }
        .portal-main {
            min-width: 0;
            padding-left: 12px;
            padding-right: 12px;
        }
        .portal-main .crm-form-page {
            padding-top: 10px;
            padding-bottom: 10px;
        }
        .portal-main .crm-form-page .uk-card.uk-card-default {
            padding: 16px 14px;
            border-radius: 12px;
        }
        .portal-main .crm-form-head {
            gap: 6px;
            margin-bottom: 14px;
        }
        .portal-main .crm-form-head h3 {
            font-size: 21px;
            line-height: 1.5;
        }
        .portal-main .crm-form-head span {
            font-size: 12px;
            line-height: 1.8;
        }
        .portal-main .crm-form-tabs {
            gap: 7px;
            margin-bottom: 14px !important;
            padding-bottom: 12px !important;
        }
        .portal-main .crm-form-tabs > li {
            flex-basis: 100%;
        }
        .portal-main .crm-form-tabs > li > a {
            min-height: 44px;
        }
        .portal-sidebar {
            width: 260px;
            position: fixed;
            top: 0;
            right: -270px;
            left: auto;
            bottom: 0;
            z-index: 60;
            overflow-y: auto;
            padding-right: 16px;
            padding-left: 8px;
            transform: none;
            transition: right .24s ease, transform .24s ease;
        }
        .portal-layout.mobile-menu-open .portal-sidebar { right: 0 !important; left: auto !important; transform: none; }
        .portal-layout.sidebar-collapsed { grid-template-columns: 1fr; }
        .portal-layout.sidebar-collapsed .portal-sidebar { width: 260px; padding-right: 16px; padding-left: 8px; }
        .portal-layout.sidebar-collapsed .sidebar-brand { grid-template-columns: minmax(0, 1fr) 44px; justify-items: stretch; padding: 0 4px 14px; gap: 4px; }
        .portal-layout.sidebar-collapsed .sidebar-brand-copy,
        .portal-layout.sidebar-collapsed .sidebar-brand-sub,
        .portal-layout.sidebar-collapsed .crm-menu span,
        .portal-layout.sidebar-collapsed .sidebar-foot span:not(.icon) { display: block; }
        .portal-layout.sidebar-collapsed .crm-menu a { grid-template-columns: 22px minmax(0, 1fr); justify-items: stretch; padding: 8px 10px; }
        .portal-kpi-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
        .portal-status-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
        .portal-widgets { grid-template-columns: 1fr; }
        .portal-widgets .widget-card:last-child { grid-column: auto; }
        .bottom-grid { grid-template-columns: 1fr; }
        .crm-info-grid { grid-template-columns: 1fr; }
        .portal-main .uk-fieldset,
        .portal-main .crm-form .uk-fieldset.crm-form-grid,
        .portal-main .crm-form-head,
        .portal-main .crm-form-map-head,
        .portal-main .crm-form-switcher > li.uk-active {
            display: grid;
            grid-template-columns: 1fr;
        }
        .portal-main .crm-form-switcher > li.uk-active {
            gap: 14px;
        }
        .portal-main .crm-form-switcher .uk-margin {
            gap: 5px;
        }
        .portal-main .uk-input,
        .portal-main .uk-select {
            height: 44px;
        }
    }
    @media (max-width: 860px) and (min-width: 641px) {
        .uk-container {
            padding: 0;
        }
        .portal-layout {
            grid-template-columns: minmax(0, 1fr) 188px;
        }
        .portal-sidebar {
            width: 188px;
            padding-left: 6px;
            padding-right: 6px;
        }
        .portal-main {
            padding-left: 14px;
            padding-right: 14px;
        }
        .portal-head {
            margin-left: -14px;
            margin-right: -14px;
            padding: 14px 16px;
        }
        .portal-head.portal-head-standalone {
            margin-left: 0;
            margin-right: 0;
        }
        .portal-head-row {
            grid-template-columns: minmax(130px, 180px) minmax(190px, 1fr) auto 64px;
            gap: 10px;
        }
        .crm-header-profile {
            width: 64px;
            height: 58px;
            grid-template-columns: 1fr;
            padding: 0;
        }
        .crm-header-profile-meta,
        .crm-header-profile-caret {
            display: none;
        }
        .crm-header-profile-avatar {
            width: 52px;
            height: 52px;
            justify-self: center;
        }
        .crm-profile-menu {
            left: auto;
            right: 0;
            width: min(286px, calc(100vw - 32px));
        }
        .top-icons {
            gap: 10px;
        }
        .portal-title {
            font-size: 18px;
        }
        .portal-user {
            font-size: 18px;
        }
        .portal-kpi-grid {
            gap: 10px;
        }
        .portal-card {
            padding: 14px 12px 12px;
        }
        .portal-card:before {
            top: 14px;
            right: 12px;
            width: 34px;
            height: 34px;
        }
        .portal-kpi-label {
            padding-right: 42px;
        }
        .portal-kpi-value {
            font-size: 22px;
        }
        .sidebar-menu a,
        .sidebar-flat .menu-item a {
            font-size: 11px;
            padding: 7px 6px;
        }
    }
    @media (max-width: 640px) {
        .portal-head { grid-template-columns: 1fr; }
        .portal-toolbar { grid-template-columns: 1fr; }
        .portal-main { padding: 0 0 10px; }
        .portal-head { margin-left: -12px; margin-right: -12px; }
        .portal-head.portal-head-standalone { margin-left: 0; margin-right: 0; }
        .portal-head-row.is-standalone {
            min-height: 84px;
            display: grid;
            grid-template-columns: 1fr;
            gap: 10px;
            direction: ltr;
        }
        .portal-head-row.is-standalone .crm-brand { grid-column: 1; grid-row: 2; justify-self: start; }
        .portal-head-row.is-standalone .crm-standalone-head {
            position: static;
            grid-column: 1;
            grid-row: 1;
            transform: none;
            justify-self: center;
            align-items: center;
            text-align: center;
        }
        .portal-head-row { grid-template-columns: minmax(0, 1fr) 56px 44px; gap: 8px; }
        .crm-brand { grid-column: 1; grid-row: 1; }
        .crm-profile-wrap { grid-column: 2; grid-row: 1; justify-self: end; }
        .crm-header-profile { width: 56px; height: 56px; grid-template-columns: 1fr; padding: 0; }
        .crm-header-profile-meta,
        .crm-header-profile-caret { display: none; }
        .crm-header-profile-avatar { width: 50px; height: 50px; justify-self: center; }
        .crm-profile-menu { left: auto; right: -48px; width: min(286px, calc(100vw - 40px)); }
        .mobile-menu-toggle { grid-column: 3; grid-row: 1; display: inline-flex; width: 42px; height: 42px; justify-self: end; align-self: center; background: #eef8f6; color: #1f8375; }
        body.crm-night-mode .mobile-menu-toggle { background: #101a28; color: #c8fff5; }
        .crm-header-search { grid-column: 1 / -1; grid-row: 2; }
        .crm-header-actions { grid-column: 1 / -1; grid-row: 3; justify-content: center; }
        .portal-search,
        .portal-title { grid-column: 1 / -1; }
        .portal-title { justify-self: start; }
        .portal-main > .portal-toolbar,
        .portal-main > .crm-info-grid,
        .portal-main > .portal-kpi-grid,
        .portal-main > .portal-status-row,
        .portal-main > .portal-shift,
        .portal-main > .portal-calllog,
        .portal-main > .portal-widgets,
        .portal-main > .bottom-grid,
        .portal-main > .dash-table-wrap {
            margin-left: 12px;
            margin-right: 12px;
        }
        .portal-main > div:not(.portal-head):not(.portal-toolbar):not(.crm-info-grid):not(.portal-kpi-grid):not(.portal-status-row):not(.portal-shift):not(.portal-calllog):not(.portal-widgets):not(.bottom-grid):not(.dash-table-wrap):not(.crm-login-section) {
            padding: 14px 0 22px;
        }
        .portal-main .uk-card.uk-card-default {
            padding: 16px;
        }
        .crm-info-grid,
        .portal-kpi-grid {
            grid-template-columns: repeat(2, minmax(0, 1fr));
        }
        .zarrin-navbar {
            flex-wrap: wrap;
            row-gap: 8px;
        }
        .zarrin-navbar ul {
            width: 100%;
            flex-wrap: wrap;
            gap: 10px;
        }
        .zarrin-title {
            font-size: 26px;
        }
        .zarrin-left {
            width: 100%;
            justify-content: space-between;
        }
        .zarrin-login-btn {
            height: 34px;
            line-height: 32px;
        }
    }

    .dashboard-topbar {
        grid-template-columns: minmax(240px, 1fr) auto auto;
        gap: 14px;
    }
    .dashboard-tabs {
        display: flex;
        flex-wrap: wrap;
        gap: 6px;
        justify-content: center;
    }
    .dashboard-tab {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-height: 34px;
        padding: 0 12px;
        border: 1px solid #dce8ef;
        border-radius: 8px;
        background: #f8fbfd;
        color: #3f5873;
        font-size: 12px;
        font-weight: 900;
    }
    .dashboard-tab.is-active,
    .dashboard-tab:hover {
        border-color: #42b8a4;
        background: #e9faf6;
        color: #148b76;
    }
    .role-dashboard {
        display: grid;
        gap: 14px;
        padding-bottom: 20px;
    }
    .role-page-head {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 16px;
        padding: 18px 20px;
        border: 1px solid #dceaf1;
        border-radius: 12px;
        background: linear-gradient(135deg, #ffffff 0%, #f4fbfa 100%);
        box-shadow: 0 8px 24px rgba(38, 77, 112, .06);
    }
    .role-page-head h2 {
        margin: 0;
        color: #203c5c;
        font-size: 24px;
        font-weight: 900;
    }
    .role-page-head p {
        margin: 5px 0 0;
        color: #6a7f95;
        font-size: 13px;
        font-weight: 700;
    }
    .role-page-badge {
        padding: 8px 12px;
        border-radius: 999px;
        background: #e8f8f5;
        color: #148b76;
        font-size: 12px;
        font-weight: 900;
        white-space: nowrap;
    }
    .role-metric-grid,
    .role-section-grid,
    .role-kpi-strip,
    .sales-mini-grid {
        display: grid;
        gap: 12px;
    }
    .role-metric-grid-8 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .role-metric-grid-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
    .role-metric-grid-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .role-section-grid-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .role-section-grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .role-section-grid-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .role-metric,
    .role-panel {
        min-width: 0;
        border: 1px solid #e0ebf2;
        border-radius: 12px;
        background: #ffffff;
        box-shadow: 0 8px 24px rgba(38, 77, 112, .06);
    }
    .role-metric {
        padding: 13px 14px;
    }
    .role-metric span,
    .role-panel-head span,
    .hr-alert-card span,
    .sales-mini-grid span,
    .cash-flow span {
        color: #70859b;
        font-size: 12px;
        font-weight: 800;
    }
    .role-metric strong {
        display: block;
        margin-top: 6px;
        color: #203c5c;
        font-size: 25px;
        font-weight: 900;
        line-height: 1.1;
    }
    .role-metric small {
        display: block;
        margin-top: 6px;
        color: #16a06d;
        font-size: 11px;
        font-weight: 800;
    }
    .role-metric.is-danger strong,
    .role-metric.is-danger small { color: #d53b3b; }
    .role-metric.is-warning strong,
    .role-metric.is-warning small { color: #c98210; }
    .role-metric.is-muted strong,
    .role-metric.is-muted small { color: #6b7280; }
    .role-panel {
        padding: 16px;
    }
    .role-panel-head {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        margin-bottom: 14px;
    }
    .role-panel-head h3 {
        margin: 0;
        color: #203c5c;
        font-size: 17px;
        font-weight: 900;
    }
    .role-line-chart {
        min-height: 170px;
        display: flex;
        align-items: end;
        gap: 9px;
        padding: 14px;
        border-radius: 10px;
        background: linear-gradient(180deg, #f8fbff 0%, #edf7fb 100%);
    }
    .role-line-chart span {
        flex: 1;
        min-height: 22px;
        border-radius: 8px 8px 3px 3px;
        background: linear-gradient(180deg, #4aa3ff 0%, #2469d8 100%);
        box-shadow: 0 8px 18px rgba(36, 105, 216, .16);
    }
    .role-line-chart.is-green span,
    .role-line-chart.is-hr span { background: linear-gradient(180deg, #43c88d 0%, #159a68 100%); }
    .role-line-chart.is-support span { background: linear-gradient(180deg, #ffb85c 0%, #e1762d 100%); }
    .cash-flow {
        display: grid;
        gap: 10px;
    }
    .cash-flow div,
    .role-kpi-strip div,
    .sales-mini-grid div {
        padding: 12px;
        border-radius: 10px;
        background: #f8fbfd;
        border: 1px solid #e6eef4;
    }
    .cash-flow strong,
    .role-kpi-strip strong,
    .sales-mini-grid strong,
    .hr-alert-card strong {
        display: block;
        margin-top: 5px;
        color: #1f4669;
        font-size: 22px;
        font-weight: 900;
    }
    .role-kpi-strip {
        grid-template-columns: repeat(7, minmax(0, 1fr));
    }
    .role-kpi-strip span {
        color: #70859b;
        font-size: 11px;
        font-weight: 800;
    }
    .role-activity-list,
    .role-alert-list {
        margin: 0;
        padding: 0;
        list-style: none;
        display: grid;
        gap: 9px;
    }
    .role-activity-list li,
    .role-alert-list li {
        display: flex;
        align-items: center;
        gap: 9px;
        min-height: 38px;
        padding: 9px 10px;
        border-radius: 9px;
        background: #f8fbfd;
        color: #344d68;
        font-size: 13px;
        font-weight: 800;
    }
    .role-activity-list li span {
        width: 9px;
        height: 9px;
        border-radius: 50%;
        background: #33b99f;
        flex-shrink: 0;
    }
    .role-alert-list li {
        border-right: 3px solid #f0a342;
    }
    .role-shortcuts {
        display: grid;
        grid-template-columns: repeat(5, minmax(0, 1fr));
        gap: 10px;
    }
    .role-shortcuts a {
        min-height: 54px;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 10px;
        background: #eef9f6;
        color: #148b76;
        font-weight: 900;
    }
    .hr-alert-card {
        display: grid;
        gap: 8px;
        min-height: 126px;
    }
    .hr-alert-card a {
        align-self: end;
        width: fit-content;
        padding: 6px 10px;
        border-radius: 8px;
        background: #e8f8f5;
        color: #148b76;
        font-weight: 900;
    }
    .sales-head,
    .role-dashboard-sales .role-panel,
    .role-dashboard-sales .role-metric {
        border-color: #dbe5f7;
    }
    .sales-main-grid {
        grid-template-columns: minmax(0, 1.35fr) minmax(280px, .65fr);
    }
    .sales-funnel {
        display: grid;
        gap: 10px;
    }
    .sales-funnel div {
        width: var(--w);
        min-height: 44px;
        justify-self: center;
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 0 16px;
        border-radius: 10px;
        background: linear-gradient(90deg, #2c74d6 0%, #49b6e8 100%);
        color: #ffffff;
        font-weight: 900;
        box-shadow: 0 10px 22px rgba(44, 116, 214, .16);
    }
    .sales-mini-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .support-satisfaction {
        display: grid;
        place-items: center;
        gap: 12px;
        min-height: 170px;
    }
    .support-satisfaction strong {
        color: #159a68;
        font-size: 46px;
        font-weight: 900;
        line-height: 1;
    }
    .support-satisfaction div {
        width: min(360px, 100%);
        height: 11px;
        border-radius: 999px;
        background: #e7eef4;
        overflow: hidden;
    }
    .support-satisfaction div span {
        display: block;
        height: 100%;
        border-radius: inherit;
        background: linear-gradient(90deg, #2bbd84 0%, #6fd1b0 100%);
    }
    .support-satisfaction small {
        color: #70859b;
        font-weight: 800;
    }
    .role-table {
        width: 100%;
        border-collapse: collapse;
    }
    .role-table th,
    .role-table td {
        padding: 10px 8px;
        border-bottom: 1px solid #e9f0f5;
        color: #344d68;
        font-size: 12px;
        font-weight: 800;
        text-align: right;
        white-space: nowrap;
    }
    .role-table th {
        color: #71859b;
        background: #f8fbfd;
    }
    .role-table a {
        color: #148b76;
        font-weight: 900;
    }
    .expert-search-results-panel {
        overflow: visible;
    }
    .expert-search-results-wrap {
        overflow: visible;
        border: 1px solid #e9f0f5;
        border-radius: 10px;
    }
    .expert-search-results-table {
        min-width: 0;
        table-layout: fixed;
    }
    .expert-search-results-table td {
        vertical-align: top;
    }
    .expert-search-results-table small,
    .expert-search-results-table span {
        display: block;
        margin-top: 4px;
        color: #71859b;
        font-size: 11px;
        font-weight: 800;
        line-height: 1.7;
        white-space: normal;
    }
    .expert-search-results-table th:nth-child(4),
    .expert-search-results-table td:nth-child(4) {
        width: 20%;
        max-width: 190px;
        white-space: normal;
    }
    .expert-search-results-table td:nth-child(4) strong,
    .expert-search-results-table td:nth-child(4) small {
        max-width: 190px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    .expert-search-results-table .expert-result-address small {
        display: block;
    }
    @media (max-width: 700px) {
        .expert-search-results-panel {
            overflow: visible;
        }
        .expert-search-results-wrap {
            overflow: visible;
            border: 0;
            border-radius: 0;
        }
        .expert-search-results-table,
        .expert-search-results-table tbody,
        .expert-search-results-table tr,
        .expert-search-results-table td {
            display: block;
            width: 100%;
        }
        .expert-search-results-table {
            overflow: visible;
        }
        .expert-search-results-table thead {
            display: none;
        }
        .expert-search-results-table tr {
            margin-bottom: 10px;
            padding: 10px 12px;
            border: 1px solid #e1ebf3;
            border-radius: 10px;
            background: #ffffff;
            box-shadow: 0 6px 18px rgba(38, 77, 112, .06);
        }
        .expert-search-results-table td {
            display: grid;
            grid-template-columns: 82px minmax(0, 1fr);
            gap: 8px;
            align-items: start;
            padding: 7px 0;
            border-bottom: 1px solid #eef3f7;
            white-space: normal;
        }
        .expert-search-results-table td.expert-result-address {
            display: none;
        }
        .expert-search-results-table td:last-child {
            border-bottom: 0;
        }
        .expert-search-results-table td::before {
            content: attr(data-label);
            color: #71859b;
            font-size: 12px;
            font-weight: 900;
            white-space: nowrap;
        }
        .expert-search-results-table td > * {
            min-width: 0;
        }
        .expert-search-results-table th:nth-child(4),
        .expert-search-results-table td:nth-child(4),
        .expert-search-results-table td:nth-child(4) strong,
        .expert-search-results-table td:nth-child(4) small {
            width: auto;
            max-width: 100%;
        }
        .expert-search-results-table .expert-result-address small {
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
        }
    }
    @media (max-width: 1180px) {
        .dashboard-topbar {
            grid-template-columns: 1fr;
        }
        .dashboard-tabs,
        .portal-tools {
            justify-content: flex-start;
        }
        .role-metric-grid-8,
        .role-metric-grid-5,
        .role-kpi-strip {
            grid-template-columns: repeat(3, minmax(0, 1fr));
        }
        .role-section-grid-4,
        .role-section-grid-3,
        .role-shortcuts {
            grid-template-columns: repeat(2, minmax(0, 1fr));
        }
        .sales-main-grid {
            grid-template-columns: 1fr;
        }
    }
    @media (max-width: 768px) {
        .role-page-head {
            align-items: flex-start;
            flex-direction: column;
            padding: 14px;
        }
        .role-page-head h2 {
            font-size: 20px;
        }
        .role-metric-grid-8,
        .role-metric-grid-5,
        .role-metric-grid-4,
        .role-section-grid-4,
        .role-section-grid-3,
        .role-section-grid-2,
        .role-kpi-strip,
        .role-shortcuts,
        .sales-mini-grid {
            grid-template-columns: 1fr;
        }
        .role-metric strong {
            font-size: 22px;
        }
        .role-panel {
            padding: 13px;
        }
        .role-table {
            display: block;
            overflow-x: auto;
        }
    }


    .portal-main :where(p, li, td, label, input, select, textarea, button, .uk-text-meta, .uk-text-small) {
        font-size: 14px;
    }
    .portal-main :where(.crm-data-table td, .role-table td, .uk-table td) {
        font-size: 14px;
    }
    .portal-main :where(small, .uk-text-meta, .uk-text-small) {
        font-size: 13px;
    }
    .portal-main :where(.uk-button-small, .btn-small, .uk-label, .uk-badge) {
        font-size: 13px;
    }

    .portal-main .role-table td,
    .portal-main .crm-data-table td,
    .portal-main .uk-table td {
        font-size: 14px;
    }
    .portal-main .role-table th,
    .portal-main .crm-data-table th,
    .portal-main .uk-table th {
        font-size: 14px;
    }
    .portal-main .role-table small,
    .portal-main .crm-data-table small,
    .portal-main .uk-table small {
        font-size: 13px;
    }