
:root {
    --bs-backdrop-zindex: var(--z-index-modal-backdrop);
    --bs-modal-zindex: var(--z-index-modal);
    --bs-popover-zindex: var(--z-index-toast);
    --bs-tooltip-zindex: var(--z-index-toast);
}

.modal-backdrop.show {
    z-index: var(--z-index-modal-backdrop) !important;
}

.modal.show {
    z-index: var(--z-index-modal) !important;
}

.select2-container--open {
    z-index: var(--z-index-modal) !important;
}

jdp-overlay,
.jdp-overlay {
    z-index: 11040 !important;
}

jdp-container,
.jdp-container {
    z-index: 11050 !important;
}

@import url('./fonts/inter/inter.css');

@font-face {
    font-family: Sahel;
    src: url("./fonts/Sahel.ttf") format("truetype");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: IranSansBold;
    src: url("./fonts/IRANSans-Bold.ttf") format("truetype");
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: IranSans;
    src: url("./fonts/IRANSans.ttf") format("truetype");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: IranSanse;
    src: url("./fonts/IRANSans.ttf") format("truetype");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'BINK-font';
    src: url('./fonts/bink/BINK-font.eot');
    src: local('BINK-font'), url('./fonts/bink/BINK-font.ttf') format('truetype');
    font-weight: normal;
}

@font-face {
    font-family: 'Bink';
    src: url('./fonts/bink/BINK-font.eot');
    src: local('BINK-font'), url('./fonts/bink/BINK-font.ttf') format('truetype');
    font-weight: normal;
}

@font-face {
    font-family: 'ScheherazadeNew';
    src: url('./fonts/ScheherazadeNew/ScheherazadeNew-Regular.woff2') format('woff2'),
         url('./fonts/ScheherazadeNew/ScheherazadeNew-Regular.woff') format('woff');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'ScheherazadeNew';
    src: url('./fonts/ScheherazadeNew/ScheherazadeNew-Bold.woff2') format('woff2'),
         url('./fonts/ScheherazadeNew/ScheherazadeNew-Bold.woff') format('woff');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

:root {
    --app-font-family: IranSans,sahel, "Tahoma", sans-serif;
    --sidebar-width: 280px;
    --sidebar-collapsed-width: 70px;
    --navbar-height: 60px;
    --transition-speed: 0.3s;
    --radius-sm: 0.375rem;
    --radius-md: 0.5rem;
    --radius-lg: 0.75rem;
    --radius-xl: 1rem;
    --radius-2xl: 1.5rem;
    --shadow-sm: 0 1px 2px 0 var(--shadow-color-sm);
    --shadow-md: 0 4px 6px -1px var(--shadow-color-md);
    --shadow-lg: 0 10px 15px -3px var(--shadow-color-lg);
    --shadow-xl: 0 20px 25px -5px var(--shadow-color-xl);
    --sidebar-shadow-offset-x: 5px;
    --sidebar-shadow: var(--sidebar-shadow-offset-x) 0 15px var(--shadow-color-navbar);
    --form-select-indicator-position: left 0.75rem center;
    --sidebar-icon-gap: 0.6rem;
    --sidebar-font-size-primary: 0.85rem;
    --sidebar-font-size-section: 0.95rem;
    --sidebar-font-size-submenu: 0.8rem;
    --sidebar-font-size-level2: 0.75rem;
    --sidebar-line-height: 1.5;
    --dropdown-edge-margin: 12px;
}

html.lang-fa-af {
    --app-font-family: IranSans, sahel, "Tahoma", sans-serif;
}

html.lang-ps-af {
    --app-font-family: "ScheherazadeNew", "Noto Naskh Arabic", serif;
}

html.lang-en {
    --app-font-family: "Inter", system-ui, sans-serif;
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
    font-size: 0.85rem;
}

html[data-font-size="sm"] {
    font-size: 0.8rem;
}

html[data-font-size="md"] {
    font-size: 0.85rem;
}

html[data-font-size="lg"] {
    font-size: 0.95rem;
}

body {
    font-family: var(--app-font-family);
    font-optical-sizing: auto;
    color: var(--text-default);
    line-height: 1.6;
    background-color: var(--body-bg);
    overflow-x: hidden;
    transition: color var(--transition-speed), background-color var(--transition-speed);
}

p {
    margin-bottom: 1rem;
}

a {
    color: var(--link-color);
    text-decoration: none;
}

a:hover {
    color: var(--hover-color);
    text-decoration: underline;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    color: var(--text-default);
    font-weight: 600;
    line-height: 1.3;
    margin-bottom: 0.5rem;
}

small,
label {
    color: var(--text-muted);
}

hr {
    border: 0;
    border-top: 1px solid var(--border-subtle);
    opacity: 1;
}

input,
select,
textarea {
    color: var(--color-input-text);
    background-color: var(--color-input-bg);
    border: 1px solid var(--color-input-border);
    border-radius: var(--radius-sm);
    transition: border-color var(--transition-speed), box-shadow var(--transition-speed), background-color var(--transition-speed), color var(--transition-speed);
}

input::placeholder,
textarea::placeholder {
    text-align: start;
    direction: inherit;
    color: var(--color-input-placeholder);
}

input:hover,
select:hover,
textarea:hover,
.form-control:hover,
.form-select:hover {
    border-color: var(--color-input-border-hover);
}

input:focus,
select:focus,
textarea:focus,
.form-control:focus,
.form-select:focus {
    color: var(--color-input-text);
    background-color: var(--color-input-bg);
    border-color: var(--color-input-border-focus);
    box-shadow: 0 0 0 0.2rem var(--color-focus-ring);
}

input:disabled,
select:disabled,
textarea:disabled,
.form-control:disabled,
.form-select:disabled {
    background-color: var(--color-input-disabled-bg);
    color: var(--color-input-disabled-text);
    border-color: var(--color-input-disabled-border);
    opacity: 1;
}

.form-control.is-invalid,
.form-select.is-invalid {
    border-color: var(--color-input-error-border);
    background-color: var(--color-input-error-bg);
}

.form-control.is-invalid:focus,
.form-select.is-invalid:focus {
    box-shadow: 0 0 0 0.2rem rgba(var(--danger-color-rgb), 0.25);
}

.form-select {
    background-position: var(--form-select-indicator-position);
    padding-inline-end: 2.25rem;
    padding-inline-start: 0.75rem;
}

.form-select[multiple],
.form-select[size] {
    background-image: none;
    padding-inline-start: 0.75rem;
    padding-inline-end: 0.75rem;
}

.select2-container .select2-selection--single {
    height: calc(2.25rem + 2px) !important;
    padding: 0.375rem 0.75rem !important;
    border: 1px solid var(--border-strong) !important;
    border-radius: var(--radius-sm) !important;
    display: flex !important;
    align-items: center !important;
    background: var(--content-bg) !important;
}

.select2-container .select2-selection--single .select2-selection__rendered {
    padding-inline-start: 0.75rem !important;
    padding-inline-end: 2.25rem !important;
    line-height: 1.5 !important;
    color: var(--text-default) !important;
}

.select2-container .select2-selection--single .select2-selection__arrow {
    inset-inline-end: 0.75rem !important;
    height: calc(2.25rem + 2px) !important;
}

.dataTables_wrapper .dataTables_filter,
.dataTables_wrapper .dataTables_length,
.dataTables_wrapper .dataTables_info {
    text-align: start;
}



.data-table-container table.dataTable th, .data-table-container table.dataTable td {
    text-align: right !important;
    }

    .dataTables_wrapper .dataTables_paginate {
        text-align: end;
    }

    .dataTables_wrapper .dataTables_filter label,
    .dataTables_wrapper .dataTables_length label {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        justify-content: flex-start;
    }

    html[dir="rtl"] .dataTables_wrapper .dataTables_filter label,
    html[dir="rtl"] .dataTables_wrapper .dataTables_length label {
        justify-content: flex-end;
    }

    jdp-overlay,
    .jdp-overlay {
        z-index: 11040 !important;
    }

    jdp-container,
    .jdp-container {
        z-index: 11050 !important;
    }

    .jdp-icon-plus,
    .jdp-icon-minus {
        color: var(--color-text-primary);
    }

        .jdp-icon-plus svg,
        .jdp-icon-minus svg {
            fill: currentColor;
        }

        .jdp-icon-plus.not-in-range,
        .jdp-icon-minus.not-in-range {
            color: var(--color-text-muted);
        }

    .jdp-day-name {
        color: var(--color-text-secondary);
    }

    table.dataTable thead th,
    table.dataTable thead td,
    table.dataTable tfoot th,
    table.dataTable tfoot td {
        text-align: start !important;
    }

    table.dataTable {
        color: var(--text-default);
        background-color: var(--content-bg);
        border-color: var(--datatable-border);
    }

        table.dataTable thead th,
        table.dataTable thead td {
            background-color: var(--datatable-header-bg);
            color: var(--datatable-header-text);
            border-bottom-color: var(--datatable-border);
        }

        table.dataTable tbody tr {
            background-color: var(--content-bg);
        }

        table.dataTable.table-striped tbody tr:nth-of-type(odd) {
            background-color: var(--datatable-row-striped);
        }

        table.dataTable tbody tr:hover {
            background-color: var(--datatable-row-hover);
        }

        table.dataTable thead th,
        table.dataTable thead td,
        table.dataTable tbody th,
        table.dataTable tbody td {
            text-align: right;
        }

    .table {
        color: var(--text-default);
    }

    table.dataTable thead th,
    table.dataTable thead td,
    table.dataTable tbody th,
    table.dataTable tbody td {
        text-align: right !important;
    }

    table.dataTable .text-center {
        text-align: center !important;
    }

        .table thead th,
        .table thead td {
            color: var(--text-default);
        }

    .dataTables_wrapper .dataTables_filter input,
    .dataTables_wrapper .dataTables_length select {
        background-color: var(--datatable-search-bg);
        color: var(--color-input-text);
        border: 1px solid var(--datatable-search-border);
        border-radius: var(--radius-sm);
    }

    .dataTables_wrapper .dataTables_info {
        color: var(--text-subtle);
    }

    .dataTables_wrapper .dataTables_paginate .paginate_button {
        color: var(--text-default) !important;
        background-color: var(--datatable-pagination-bg);
        border: 1px solid var(--datatable-border);
        border-radius: var(--radius-sm);
    }

        .dataTables_wrapper .dataTables_paginate .paginate_button:hover {
            color: var(--text-default) !important;
            background-color: var(--datatable-pagination-hover-bg);
            border-color: var(--datatable-border);
        }

        .dataTables_wrapper .dataTables_paginate .paginate_button.current,
        .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
            color: var(--datatable-pagination-active-text) !important;
            background-color: var(--datatable-pagination-active-bg);
            border-color: var(--datatable-pagination-active-bg);
        }

    [data-theme="dark"] .table > :not(caption) > * > * {
        color: var(--color-text-primary) !important;
    }

    [data-theme="dark"] table.dataTable,
    [data-theme="dark"] table.dataTable thead th,
    [data-theme="dark"] table.dataTable thead td,
    [data-theme="dark"] table.dataTable tbody td,
    [data-theme="dark"] table.dataTable tbody th,
    [data-theme="dark"] .dataTables_wrapper .dataTables_info,
    [data-theme="dark"] .dataTables_wrapper .dataTables_filter label,
    [data-theme="dark"] .dataTables_wrapper .dataTables_length label {
        color: var(--color-text-primary) !important;
    }

    [data-theme="dark"] .dataTables_wrapper .dataTables_filter input,
    [data-theme="dark"] .dataTables_wrapper .dataTables_length select {
        background-color: var(--color-bg-secondary);
        color: var(--color-text-primary);
        border-color: var(--color-border);
    }

    [data-theme="dark"] .text-muted {
        color: var(--color-text-muted) !important;
    }

    [data-theme="dark"] .modal-basic .form-label {
        color: var(--color-hex-555555);
    }

    [data-theme="dark"] .btn-modern {
        background: var(--color-bg-tertiary);
        color: var(--color-text-primary);
        border: 1px solid var(--color-border-strong);
    }

    [data-theme="dark"] .btn-modern-primary {
        background: linear-gradient(135deg, var(--color-accent), var(--color-accent-hover));
        color: var(--color-text-inverse);
        border: 1px solid transparent;
    }

        [data-theme="dark"] .btn-modern-primary:hover,
        [data-theme="dark"] .btn-modern-primary:focus,
        [data-theme="dark"] .btn-modern-primary:active {
            filter: brightness(1.05);
            box-shadow: 0 0 0 0.2rem rgba(var(--color-accent-rgb), 0.35);
        }

    [data-theme="dark"] .btn-modern-secondary {
        background: var(--color-bg-secondary);
        color: var(--color-text-primary);
        border: 1px solid var(--color-border-strong);
    }

        [data-theme="dark"] .btn-modern-secondary:hover,
        [data-theme="dark"] .btn-modern-secondary:focus,
        [data-theme="dark"] .btn-modern-secondary:active {
            background: var(--color-bg-tertiary);
            border-color: var(--color-accent);
            color: var(--color-text-primary);
        }

    [data-theme="dark"] .btn-modern:disabled,
    [data-theme="dark"] .btn-modern.disabled {
        background: var(--color-bg-muted);
        color: var(--color-text-muted);
        border-color: var(--color-border);
        opacity: 0.7;
    }

    [data-theme="dark"] .card,
    [data-theme="dark"] .card-body,
    [data-theme="dark"] .card-header,
    [data-theme="dark"] .card-footer {
        color: var(--color-text-primary);
    }

    [data-theme="dark"] .card-header,
    [data-theme="dark"] .card-footer {
        background-color: var(--color-bg-tertiary);
        border-color: var(--color-border);
    }

    [data-theme="dark"] .badge {
        color: var(--color-text-inverse);
    }

        [data-theme="dark"] .badge.bg-light,
        [data-theme="dark"] .badge.text-dark {
            color: var(--color-text-primary) !important;
        }

        [data-theme="dark"] .badge.bg-light {
            background-color: var(--color-bg-tertiary) !important;
            border: 1px solid var(--color-border);
        }

    [data-theme="dark"] .bg-light {
        background-color: var(--color-bg-tertiary) !important;
        color: var(--color-text-primary);
    }

    [data-theme="dark"] .form-control,
    [data-theme="dark"] .form-select {
        color: var(--color-text-primary);
        background-color: var(--color-input-bg);
        border-color: var(--color-input-border);
    }

        [data-theme="dark"] .form-control::placeholder,
        [data-theme="dark"] .form-select::placeholder {
            color: var(--color-input-placeholder);
        }

        [data-theme="dark"] .form-control:disabled,
        [data-theme="dark"] .form-select:disabled {
            background-color: var(--color-input-disabled-bg);
            color: var(--color-input-disabled-text);
            border-color: var(--color-input-disabled-border);
        }

        [data-theme="dark"] .form-control:focus,
        [data-theme="dark"] .form-select:focus {
            color: var(--color-input-text);
            background-color: var(--color-input-bg);
            border-color: var(--color-input-border-focus);
            box-shadow: 0 0 0 0.2rem var(--color-focus-ring);
        }

        [data-theme="dark"] .form-control.is-invalid,
        [data-theme="dark"] .form-select.is-invalid {
            border-color: var(--color-input-error-border);
            background-color: var(--color-input-error-bg);
            color: var(--color-input-text);
        }

    [data-theme="dark"] .select2-container--default .select2-selection--multiple,
    [data-theme="dark"] .select2-container--default .select2-selection--single {
        background-color: var(--color-input-bg) !important;
        color: var(--color-text-primary) !important;
        border-color: var(--color-input-border) !important;
    }

    [data-theme="dark"] .select2-container--default.select2-container--focus .select2-selection--multiple,
    [data-theme="dark"] .select2-container--default.select2-container--focus .select2-selection--single {
        border-color: var(--color-input-border-focus) !important;
        box-shadow: 0 0 0 0.2rem var(--color-focus-ring) !important;
    }

    [data-theme="dark"] .select2-container--default .select2-selection__rendered,
    [data-theme="dark"] .select2-container--default .select2-search--inline .select2-search__field {
        color: var(--color-text-primary) !important;
    }

    [data-theme="dark"] .select2-container--default .select2-selection__placeholder {
        color: var(--color-text-muted) !important;
    }

    [data-theme="dark"] .select2-container--default .select2-selection--multiple .select2-selection__choice {
        background-color: rgba(var(--color-accent-rgb), 0.2) !important;
        color: var(--color-text-primary) !important;
        border-color: var(--color-border) !important;
    }

    [data-theme="dark"] .select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
        color: var(--color-text-primary) !important;
    }

    [data-theme="dark"] .select2-container--default .select2-dropdown {
        background-color: var(--color-bg-secondary) !important;
        border-color: var(--color-border) !important;
    }

    [data-theme="dark"] .select2-container--default .select2-results__option {
        color: var(--color-text-primary) !important;
    }

    [data-theme="dark"] .select2-container--default .select2-results__option--highlighted[aria-selected],
    [data-theme="dark"] .select2-container--default .select2-results__option--highlighted[aria-selected="true"] {
        background-color: rgba(var(--color-accent-rgb), 0.2) !important;
        color: var(--color-text-primary) !important;
    }

    [data-theme="dark"] .select2-container--default .select2-results__option[aria-selected="true"] {
        background-color: rgba(var(--color-accent-rgb), 0.3) !important;
        color: var(--color-text-primary) !important;
    }

    [data-theme="dark"] .btn-secondary {
        background-color: var(--color-bg-tertiary);
        color: var(--color-text-primary);
        border: 1px solid var(--color-border-strong);
    }

        [data-theme="dark"] .btn-secondary:hover,
        [data-theme="dark"] .btn-secondary:focus {
            background-color: var(--color-bg-secondary);
            color: var(--color-text-primary);
            border-color: var(--color-accent);
            box-shadow: 0 0 0 0.2rem rgba(var(--color-accent-rgb), 0.25);
        }

        [data-theme="dark"] .btn-secondary:disabled,
        [data-theme="dark"] .btn-secondary.disabled {
            background-color: var(--color-bg-muted);
            color: var(--color-text-muted);
            border-color: var(--color-border);
            box-shadow: none;
        }

    [data-theme="dark"] jdp-container,
    [data-theme="dark"] .jdp-container {
        background-color: var(--color-bg-secondary) !important;
        color: var(--color-text-primary) !important;
        border-color: var(--color-border) !important;
    }

    [data-theme="dark"] .jdp-day,
    [data-theme="dark"] .jdp-week-day,
    [data-theme="dark"] .jdp-header,
    [data-theme="dark"] .jdp-nav,
    [data-theme="dark"] .jdp-months,
    [data-theme="dark"] .jdp-years {
        color: var(--color-text-primary) !important;
    }

        [data-theme="dark"] .jdp-day.disabled,
        [data-theme="dark"] .jdp-day[disabled] {
            color: var(--color-text-muted) !important;
        }

    [data-theme="dark"] [style*="color: #333"],
    [data-theme="dark"] [style*="color:#333"],
    [data-theme="dark"] [style*="color: #333333"],
    [data-theme="dark"] [style*="color:#333333"] {
        color: var(--color-text-primary) !important;
    }

    [data-theme="dark"] [style*="background-color: #f8f9fa"],
    [data-theme="dark"] [style*="background-color:#f8f9fa"],
    [data-theme="dark"] [style*="background: #f8f9fa"],
    [data-theme="dark"] [style*="background:#f8f9fa"] {
        background-color: var(--color-bg-tertiary) !important;
    }
    /* Utilities */
    .app-text-muted {
        color: var(--text-muted) !important;
    }

    .app-text-subtle {
        color: var(--text-subtle) !important;
    }

    .app-text-nowrap {
        white-space: nowrap !important;
    }

    .app-text-truncate {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .app-shadow-sm {
        box-shadow: var(--shadow-sm) !important;
    }

    .app-shadow-md {
        box-shadow: var(--shadow-md) !important;
    }

    .app-shadow-lg {
        box-shadow: var(--shadow-lg) !important;
    }

    .app-radius-sm {
        border-radius: var(--radius-sm) !important;
    }

    .app-radius-md {
        border-radius: var(--radius-md) !important;
    }

    .app-radius-lg {
        border-radius: var(--radius-lg) !important;
    }

    .app-radius-pill {
        border-radius: 999px !important;
    }

    .app-mt-1 {
        margin-top: 0.25rem !important;
    }

    .app-mt-2 {
        margin-top: 0.5rem !important;
    }

    .app-mb-1 {
        margin-bottom: 0.25rem !important;
    }

    .app-mb-2 {
        margin-bottom: 0.5rem !important;
    }

    .theme-text-primary {
        color: var(--primary-color);
    }

    .theme-text-secondary {
        color: var(--secondary-color);
    }

    .theme-text-accent {
        color: var(--accent-color);
    }

    .theme-text-success {
        color: var(--success-color);
    }

    .theme-text-warning {
        color: var(--warning-color);
    }

    .theme-text-danger {
        color: var(--danger-color);
    }

    .theme-text-info {
        color: var(--info-color);
    }

    .theme-bg-primary {
        background-color: var(--primary-color);
    }

    .theme-bg-secondary {
        background-color: var(--secondary-color);
    }

    .theme-bg-accent {
        background-color: var(--accent-color);
    }

    .theme-bg-success {
        background-color: var(--success-color);
    }

    .theme-bg-warning {
        background-color: var(--warning-color);
    }

    .theme-bg-danger {
        background-color: var(--danger-color);
    }

    .theme-bg-info {
        background-color: var(--info-color);
    }

    .theme-border-primary {
        border-color: var(--primary-color);
    }

    .theme-border-secondary {
        border-color: var(--secondary-color);
    }

    .theme-border-accent {
        border-color: var(--accent-color);
    }

    .theme-gradient-primary {
        background: linear-gradient(135deg, var(--primary-color), var(--secondary-color));
    }

    .theme-gradient-accent {
        background: linear-gradient(135deg, var(--accent-color), var(--hover-color));
    }

    .theme-gradient-success {
        background: linear-gradient(135deg, var(--success-color), var(--teal-600));
    }

    .theme-gradient-danger {
        background: linear-gradient(135deg, var(--danger-color), var(--red-700));
    }

    .theme-gradient-warning {
        background: linear-gradient(135deg, var(--warning-color), var(--amber-600));
    }

    .theme-gradient-info {
        background: linear-gradient(135deg, var(--info-color), var(--info-700));
    }

    .theme-blue-dark {
        background: var(--theme-blue-dark-bg) !important;
        color: var(--theme-blue-dark-color) !important;
    }

    .theme-dark-gray {
        background: var(--theme-dark-gray-bg) !important;
        color: var(--theme-dark-gray-color) !important;
    }

    .theme-medical-green {
        background: var(--theme-medical-green-bg) !important;
        color: var(--theme-medical-green-color) !important;
    }

    .theme-navy-blue {
        background: var(--theme-navy-blue-bg) !important;
        color: var(--theme-navy-blue-color) !important;
    }

    .theme-purple {
        background: var(--theme-purple-bg) !important;
        color: var(--theme-purple-color) !important;
    }

    .theme-blue-dark-bg {
        background: var(--theme-blue-dark-bg) !important;
    }

    .theme-dark-gray-bg {
        background: var(--theme-dark-gray-bg) !important;
    }

    .theme-medical-green-bg {
        background: var(--theme-medical-green-bg) !important;
    }

    .theme-navy-blue-bg {
        background: var(--theme-navy-blue-bg) !important;
    }

    .theme-purple-bg {
        background: var(--theme-purple-bg) !important;
    }

    .btn-theme-blue-dark {
        background: var(--theme-blue-dark-bg);
        border: none;
        color: var(--theme-blue-dark-color);
    }

    .btn-theme-dark-gray {
        background: var(--theme-dark-gray-bg);
        border: none;
        color: var(--theme-dark-gray-color);
    }

    .btn-theme-navy-blue {
        background: var(--theme-navy-blue-bg);
        border: none;
        color: var(--theme-navy-blue-color);
    }
