:root {
    --color--dark-100: #312c34;
    --color--dark-80: #6b676d;
    --white: white;
    --color--primary-light: #f3eef6;
    --color--pink: #eb0d8c;
    --color--secondary: #67308f;
    --black: black;
    --color--dark-60: #a19da1;
    --color--secondary-light: #fdecf6;
    --color--white: white;
    --vz-form-valid-border-color: #00bd9d;
    --vz-primary: #2e3192;
    --vz-chanzo-primary-color: #2e3192;
    --vz-chanzo-secondary-color: #ff6900;
    --vz-btn-hover-bg: var(--vz-chanzo-primary-color);
    --vz-success-text-emphasis: var(--vz-chanzo-primary-color);
    /* --vz-btn-active-color: var(--vz-chanzo-primary-color);
    --vz-btn-active-bg: var(--vz-chanzo-primary-color);
    --vz-btn-active-border-color: var(--vz-chanzo-primary-color);
    --vz-btn-hover-bg: red; */

    .form-check-input:checked {
        background-color: var(--vz-chanzo-primary-color);
        border-color: var(--vz-chanzo-primary-color);
    }

    .btn.btn-primary {
        background-color: #2e3192;
        border-color: #2e3192;
        /* padding: 8px 16px; */
        /* border-radius: 8px; */
        font-weight: 500;
    }

    .btn.btn-primary:hover {
        background-color: #1a1c6b;
        border-color: #1a1c6b;
    }

    /* Custom Pagination */
    .pagination {
        gap: 8px;
    }

    .pagination .page-item .page-link {
        border-radius: 8px;
        border: 1px solid #dee2e6;
        color: #2e3192;
        font-weight: 500;
        padding: 8px 16px;
    }

    .pagination .page-item.active .page-link {
        background-color: #2e3192;
        border-color: #2e3192;
        color: white;
    }

    .pagination .page-item.disabled .page-link {
        color: #f39424;
    }

    .nav-link {
        display: block;
        padding: var(--vz-nav-link-padding-y) var(--vz-nav-link-padding-x);
        font-size: var(--vz-nav-link-font-size);
        font-weight: var(--vz-nav-link-font-weight);
        color: var(--vz-chanzo-primary-color);
        background: none;
        border: 0;
        transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out,
            border-color 0.15s ease-in-out;
    }

    /* .text-primary {
        --vz-text-opacity: 1;
        color: var(--vz-chanzo-primary-color) !important;
    } */

    .bg-primary {
        --vz-bg-opacity: 1;
        background-color: var(--vz-chanzo-primary-color) !important;
    }

    .chat-conversation
        .right
        .conversation-list
        .ctext-wrap
        .ctext-wrap-content {
        order: 2;
        background-color: rgba(var(--vz-primary-rgb), 0.15);
        color: var(--vz-chanzo-secondary-color);
        text-align: right;
        box-shadow: none;
    }

    /* Style all readonly input fields */
    input[readonly],
    textarea[readonly],
    select[readonly] {
        background-color: #e0e0e0;
        color: #555;
        cursor: not-allowed;
        border-color: #ccc;
    }
}