/****************************************************************************************************************/
/***********************************************************************CMS - SELECT2 - VER 3.3.1*************************************************************************/
/****************************************************************************************************************/

.form-group .select2-container,
table .select2-container,
#frmChangeLanguage .select2-container {
    background: #FFFFFF;
    padding: 8px 0 0 0;
    border-radius: 8px;
    border: 1px solid #E5E7EB;
    min-height: 40px;
    min-width: 150px;
}

    .form-group .select2-container .select2-choice {
        height: auto;
        border: none;
        background: #FFF;
        border-radius: 0;
        outline: none;
        box-shadow: none;
        padding: 0 16px;
    }

        .form-group .select2-container .select2-choice span {
            padding: 0;
            /* Body/Large */
            font-family: inherit;
            font-style: normal;
            font-weight: 400;
            font-size: 16px;
            line-height: 1.5;
            /* identical to box height, or 150% */
            letter-spacing: 0.5px;
            /* Content/text-main */
            color: var(--Content-text-primary);
        }

        .form-group .select2-container .select2-choice div b {
            background-image: url('data:image/svg+xml,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M4.22007 8.47C4.52007 8.17 4.99007 8.17 5.28007 8.47L12.0001 15.19L18.7201 8.47C18.7887 8.39631 18.8715 8.33721 18.9635 8.29622C19.0555 8.25523 19.1548 8.23319 19.2556 8.23141C19.3563 8.22963 19.4563 8.24816 19.5497 8.28588C19.6431 8.3236 19.7279 8.37974 19.7991 8.45096C19.8703 8.52218 19.9265 8.60702 19.9642 8.7004C20.0019 8.79379 20.0204 8.89382 20.0187 8.99452C20.0169 9.09523 19.9948 9.19454 19.9539 9.28654C19.9129 9.37854 19.8538 9.46134 19.7801 9.53L12.5301 16.78C12.2301 17.08 11.7601 17.08 11.4701 16.78L4.22007 9.53C4.07962 9.38938 4.00073 9.19875 4.00073 9C4.00073 8.80125 4.07962 8.61063 4.22007 8.47Z" fill="%230A0D14"/></svg>');
            background-repeat: no-repeat;
            background-size: contain;
            background-position: center;
        }

.select2-drop {
    margin-top: 4px;
    border: 1px solid #E5E7EB;
    padding: 8px 12px;
}

    .select2-drop .select2-search input {
        background: #FFFFFF;
        padding: 4px 12px;
        border-radius: 8px;
        border: 1px solid #E5E7EB;
        margin-bottom: 8px;
        margin-top: 4px;
        box-shadow: none;
        /* Body/Large */
        font-family: inherit;
        font-style: normal;
        font-weight: 400;
        font-size: 16px;
        line-height: 24px;
        /* identical to box height, or 150% */
        letter-spacing: 0.5px;
        /* Content/text-main */
        color: var(--Content-text-primary);
    }

    .select2-drop .select2-results::-webkit-scrollbar,
    .hienthi #categoryTree::-webkit-scrollbar,
    #RoleAssignment table > tbody > tr > td .form-control::-webkit-scrollbar {
        width: 4px;
    }

    .select2-drop .select2-results::-webkit-scrollbar-track,
    .hienthi #categoryTree::-webkit-scrollbar-track,
    #RoleAssignment table > tbody > tr > td .form-control::-webkit-scrollbar-track {
        background: transparent;
        border-radius: 12px;
    }

    .select2-drop .select2-results::-webkit-scrollbar-thumb,
    .hienthi #categoryTree::-webkit-scrollbar-thumb,
    #RoleAssignment table > tbody > tr > td .form-control::-webkit-scrollbar-thumb {
        background: #c1c1c1;
        border-radius: 12px;
    }

        .select2-drop .select2-results::-webkit-scrollbar-thumb:hover,
        .hienthi #categoryTree::-webkit-scrollbar-thumb:hover,
        #RoleAssignment table > tbody > tr > td .form-control::-webkit-scrollbar-thumb:hover {
            background: #979595;
            border-radius: 12px;
        }

    .select2-drop .select2-results .select2-result-label {
        /* Body/Large */
        font-family: inherit;
        font-style: normal;
        font-weight: 400;
        font-size: 16px;
        line-height: 1.5;
        /* identical to box height, or 150% */
        letter-spacing: 0.5px;
        /* Content/text-main */
        color: var(--Content-text-primary);
        padding: 8px;
    }

.form-group .select2-container .select2-choice div {
    background: none !important;
    width: 25px;
    border: none;
    margin-right: 16px;
}

.select2-drop .select2-results .select2-result-label:hover,
.select2-drop .select2-results .select2-highlighted .select2-result-label {
    background-color: var(--primary-dark);
    color: var(--text-white);
}

.ui-dropdownchecklist-selector,
.ms-parent > button {
    background: #FFFFFF;
    border: 1px solid #E5E7EB;
    padding: 8px 12px !important;
    border-radius: 8px;
    outline: none;
    height: 42px !important;
    box-shadow: none;
    background-repeat: no-repeat;
    background-position: calc(100% - 12px) center;
    background-image: url('data:image/svg+xml,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M4.22007 8.47C4.52007 8.17 4.99007 8.17 5.28007 8.47L12.0001 15.19L18.7201 8.47C18.7887 8.39631 18.8715 8.33721 18.9635 8.29622C19.0555 8.25523 19.1548 8.23319 19.2556 8.23141C19.3563 8.22963 19.4563 8.24816 19.5497 8.28588C19.6431 8.3236 19.7279 8.37974 19.7991 8.45096C19.8703 8.52218 19.9265 8.60702 19.9642 8.7004C20.0019 8.79379 20.0204 8.89382 20.0187 8.99452C20.0169 9.09523 19.9948 9.19454 19.9539 9.28654C19.9129 9.37854 19.8538 9.46134 19.7801 9.53L12.5301 16.78C12.2301 17.08 11.7601 17.08 11.4701 16.78L4.22007 9.53C4.07962 9.38938 4.00073 9.19875 4.00073 9C4.00073 8.80125 4.07962 8.61063 4.22007 8.47Z" fill="%230A0D14"/></svg>');
    margin-bottom: 0;
}

.ms-parent {
    width: 100% !important
}

.ui-dropdownchecklist {
    width: 100% !important;
}

.ui-dropdownchecklist-text {
    font-family: inherit;
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 1.5;
    letter-spacing: 0.5px;
    color: var(--Content-text-primary);
}

.ms-drop ul > li > label {
    display: flex;
    align-items: center;
    gap: 4px;
    margin-bottom: 12px;
}

.ms-choice > span {
    top: 50%;
    transform: translateY(-50%);
    /* Body/Large */
    font-family: inherit;
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 1.5;
    /* identical to box height, or 150% */
    letter-spacing: 0.5px;
    /* Content/text-main */
    color: var(--Content-text-primary);
    padding: 0 16px;
}

.multi-selection .select2-container {
    padding: 0;
    margin: 0;
}

    .multi-selection .select2-container .select2-selection {
        margin-top: -8px;
        height: 50px !important;
        padding: 15px 16px 0 16px !important;
        border: none;
        background-color: transparent;
    }

        .multi-selection .select2-container .select2-selection .select2-selection__rendered {
            margin: 0;
            font-family: inherit;
            font-style: normal;
            font-weight: 400;
            font-size: 16px;
            line-height: 1.5;
            letter-spacing: 0.5px;
            color: var(--Content-text-primary) !important;
            box-shadow: none !important;
        }

.form-group .select2-container--default .select2-selection--multiple .select2-selection__choice {
    padding-right: 28px !important;
}

/****************************************************************************************************************/
/***********************************************************************CMS - SELECT2 - VER 4.X*************************************************************************/
/****************************************************************************************************************/
.select2-container .select2-selection {
    margin-top: -8px;
    min-height: 38px !important;
    padding: 8px 56px 8px 16px !important;
    border: none;
    background-color: transparent;
    height: 100%;
    cursor: pointer;
}

.click-message {
    cursor: pointer;
}

    .select2-container .select2-selection .select2-selection__rendered {
        font-family: inherit;
        font-style: normal;
        font-weight: 400;
        font-size: 16px;
        line-height: 1.5;
        letter-spacing: 0.5px;
        color: var(--Content-text-primary) !important;
        padding: 0 !important;
        margin: 0 !important;
        display: flex !important; 
        flex-wrap: wrap;
        gap: 8px;
    }

.select2-container .select2-selection--single .select2-selection__rendered {
    display: block;
}

.select2-container--default .select2-selection--single .select2-selection__arrow b {
    border: none;
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"><path d="M18 9.00005C18 9.00005 13.5811 15 12 15C10.4188 15 6 9 6 9" stroke="%23101828" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></svg>');
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    width: 24px;
    height: 24px;
    position: absolute;
    left: -10px;
    top: 9px;
}

.select2-container--default .select2-selection--multiple {
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"><path d="M18 9.00005C18 9.00005 13.5811 15 12 15C10.4188 15 6 9 6 9" stroke="%23101828" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></svg>');
    background-repeat: no-repeat;
    background-position: calc(100% - 12px) calc(50% + 2px);
    padding-right: 40px !important;
    border: none !important;
}

.select2-dropdown {
    margin-top: 4px;
    margin-bottom: 4px;
    border: 1px solid #E5E7EB !important;
    padding: 8px 12px;
    border-radius: 8px !important;
}

    .select2-dropdown .select2-search input {
        background: #FFFFFF;
        padding: 4px 12px;
        border-radius: 8px;
        border: 1px solid #E5E7EB;
        margin-bottom: 8px;
        margin-top: 4px;
        box-shadow: none;
        /* Body/Large */
        font-family: inherit;
        font-style: normal;
        font-weight: 400;
        font-size: 16px;
        line-height: 24px;
        /* identical to box height, or 150% */
        letter-spacing: 0.5px;
        /* Content/text-main */
        color: var(--Content-text-primary);
        height: 40px;
    }

    .select2-dropdown .select2-results .select2-results__options::-webkit-scrollbar {
        width: 4px;
    }

    .select2-dropdown .select2-results .select2-results__options::-webkit-scrollbar-track {
        background: transparent;
        border-radius: 12px;
    }

    .select2-dropdown .select2-results .select2-results__options::-webkit-scrollbar-thumb {
        background: #c1c1c1;
        border-radius: 12px;
    }

        .select2-dropdown .select2-results .select2-results__options::-webkit-scrollbar-thumb:hover {
            background: #979595;
            border-radius: 12px;
        }

    .select2-dropdown .select2-results .select2-results__options li {
        /* Body/Large */
        font-family: inherit;
        font-style: normal;
        font-weight: 400;
        font-size: 16px;
        line-height: 1.5;
        /* identical to box height, or 150% */
        letter-spacing: 0.5px;
        /* Content/text-main */
        color: var(--Content-text-primary);
        padding: 8px 16px 8px 40px;
        border-radius: 8px;
        margin-bottom: 4px;
        position: relative;
        margin: 0 12px;
    }

        .select2-dropdown .select2-results .select2-results__options li:hover,
        .select2-container .select2-results__option--highlighted[aria-selected] {
            background-color: var(--primary-lighter) !important;
            color: var(--text-green) !important;
        }

        .select2-container .select2-results__options .select2-results__option[aria-selected="true"] {
                background-color: transparent !important;
                color: var(--primary-base) !important;
        }

        .select2-dropdown .select2-results .select2-results__options li:hover::before,
        .select2-container .select2-results__option--highlighted[aria-selected]::before {
            content: "";
            width: 4px;
            height: 100%;
            background-color: var(--primary-base);
            position: absolute;
            left: -12px;
            top: 0;
            border-radius: 0 8px 8px 0;
        }

        .select2-container .select2-results__options .select2-results__option[aria-selected="true"]::after {
            content: "";
            width: 24px;
            height: 24px;
            display: block;
            flex-shrink: 0;
            background-color: var(--primary-base);
            mask-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"><path d="M19.9375 6.15241C20.1297 6.6702 19.8657 7.2457 19.3479 7.43782C18.289 7.83068 17.1274 8.64841 15.9514 9.72885C14.7866 10.799 13.6641 12.074 12.6793 13.3107C11.6965 14.5449 10.8631 15.7254 10.2751 16.5981C9.98143 17.0339 9.74984 17.3917 9.59237 17.6394C9.51365 17.7632 9.45351 17.8594 9.41344 17.924L9.36861 17.9966L9.35785 18.0142L9.35545 18.0182C9.17177 18.3209 8.84114 18.5048 8.48701 18.5002C8.13282 18.4956 7.8075 18.304 7.63176 17.9964C6.68252 16.3352 5.89836 15.5873 5.42654 15.257C5.19208 15.0929 5.03257 15.0302 4.96242 15.0079C4.94586 15.0026 4.93369 14.9994 4.92605 14.9976C4.4083 14.9597 4 14.5277 4 14.0003C4 13.448 4.44772 13.0003 5 13.0003C5.118 13.0082 5.39696 13.0397 5.56883 13.102C5.84243 13.1891 6.18292 13.3452 6.57346 13.6185C7.13325 14.0104 7.79014 14.6389 8.5059 15.6453C8.54176 15.5916 8.57862 15.5367 8.61646 15.4805C9.22514 14.5772 10.0902 13.3515 11.1148 12.0648C12.1374 10.7807 13.3311 9.42028 14.5983 8.25607C15.8543 7.10213 17.2404 6.08653 18.6521 5.56272C19.1699 5.37061 19.7454 5.63462 19.9375 6.15241Z" fill="%2300615E"/></svg>');
            background-repeat: no-repeat;
            background-size: cover;
            position: absolute;
            top: 50%;
            transform: translateY(-50%);
            left: 8px;
        }


.select2-container .select2-dropdown {
    padding: 0;
}

.select2-container .select2-search {
    padding: 12px;
    border-bottom: 1px solid #E5E7EB;
}

.select2-container .select2-search .select2-search__field {
    margin: 0;
    font-family: inherit;
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 1.5;
    /* identical to box height, or 150% */
    letter-spacing: 0.5px;
    box-shadow: none;
    /* Content/text-main */
    color: var(--Content-text-primary);
    border: 1px solid #E5E7EB;
    border-radius: 8px;
}

.select2-container .select2-dropdown .select2-results {
    padding: 12px 0;
}

.select2-container .select2-selection--multiple .select2-search__field {
    width: auto !important;
    height: 24px;
    margin: 0 !important
}

.select2-container .select2-selection .select2-selection__choice {
    margin: 0;
    border: none;
    background: var(--primary-lighter) !important;
    border-radius: 8px;
    margin-right: 0;
    /* Label/Large */
    font-family: inherit;
    font-style: normal;
    font-weight: 500;
    font-size: 14px;
    line-height: 1.43;
    /* identical to box height, or 143% */
    letter-spacing: 0.1px;
    /* Content/text-main */
    color: var(--Content-text-primary);
    padding: 2px 8px 2px 0;
    margin: 0 !important; 
}

/* .select2-container .select2-selection .select2-search--inline {
    display: none;
} */

.select2-container .select2-selection .select2-search--inline {
    padding: 0;
    border: none;
    margin: 0 !important;
    height: 24px;
    display: flex;
    align-items: center;
}

.select2-container .select2-selection .select2-search--inline input {
    border: none !important;
    background-color: transparent !important;
}

.select2-container .select2-selection .select2-selection__choice__remove {
    font-size: 0;
    top: 50%;
    transform: translateY(-50%);
    border: none;
    right: 6px;
    left: unset;
    padding: 0;
    margin: 0;
}

    .select2-container .select2-selection .select2-selection__choice__remove::before {
        content: "";
        width: 16px;
        height: 16px;
        display: block;
        flex-shrink: 0;
        background-image: url('data:image/svg+xml,<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M2.93331 3.03333L2.97997 2.98C3.06504 2.89492 3.17793 2.84336 3.29794 2.83479C3.41794 2.82622 3.53701 2.86121 3.63331 2.93333L3.68664 2.98L7.99998 7.29333L12.3133 2.98C12.3591 2.93088 12.4143 2.89147 12.4756 2.86415C12.5369 2.83682 12.6032 2.82212 12.6703 2.82094C12.7374 2.81976 12.8041 2.8321 12.8664 2.85725C12.9286 2.8824 12.9852 2.91983 13.0327 2.96731C13.0801 3.01479 13.1176 3.07134 13.1427 3.1336C13.1679 3.19586 13.1802 3.26255 13.179 3.32968C13.1779 3.39682 13.1632 3.46303 13.1358 3.52436C13.1085 3.58569 13.0691 3.64089 13.02 3.68667L8.70664 8L13.02 12.3133C13.2 12.4933 13.22 12.7667 13.0666 12.9667L13.02 13.02C12.9349 13.1051 12.822 13.1566 12.702 13.1652C12.582 13.1738 12.4629 13.1388 12.3666 13.0667L12.3133 13.02L7.99998 8.70667L3.68664 13.02C3.59186 13.1083 3.46649 13.1564 3.33696 13.1541C3.20743 13.1518 3.08384 13.0994 2.99223 13.0077C2.90062 12.9161 2.84814 12.7926 2.84586 12.663C2.84357 12.5335 2.89165 12.4081 2.97997 12.3133L7.29331 8L2.97997 3.68667C2.89489 3.6016 2.84334 3.48871 2.83477 3.36871C2.8262 3.2487 2.86118 3.12963 2.93331 3.03333Z" fill="%230A0D14"/></svg>');
    }

.select2-container.select2-container--disabled .select2-selection--single {
    background-color: var(--text-disabled) !important;
    cursor: default;
    border-radius: 8px;
}

.select2-container--default.select2-container--disabled .select2-selection--multiple {
    background-color: var(--text-disabled) !important;
    cursor: default;
    border-radius: 8px;
}

.select2-container .select2-selection .select2-selection__clear {
    font-size: 0;
    padding: 0;
    margin: 0;
    height: 12px;
    position: absolute;
    right: 36px;
    top: 50%;
    transform: translateY(calc(-50% - 1px));
}

    .select2-container .select2-selection .select2-selection__clear::before {
        content: "";
        width: 16px;
        height: 16px;
        background-size: contain;
        flex-shrink: 0;
        display: block;
        background-image: url('data:image/svg+xml,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M4.39996 4.54918L4.46996 4.46918C4.59756 4.34156 4.7669 4.26422 4.9469 4.25137C5.12691 4.23851 5.30552 4.29099 5.44996 4.39918L5.52996 4.46918L12 10.9392L18.47 4.46918C18.5386 4.39549 18.6214 4.33639 18.7134 4.2954C18.8054 4.2544 18.9047 4.23236 19.0054 4.23059C19.1061 4.22881 19.2062 4.24733 19.2996 4.28505C19.3929 4.32278 19.4778 4.37892 19.549 4.45014C19.6202 4.52136 19.6764 4.60619 19.7141 4.69958C19.7518 4.79297 19.7703 4.893 19.7686 4.9937C19.7668 5.0944 19.7447 5.19372 19.7037 5.28571C19.6628 5.37771 19.6037 5.46052 19.53 5.52918L13.06 11.9992L19.53 18.4692C19.8 18.7392 19.83 19.1492 19.6 19.4492L19.53 19.5292C19.4024 19.6568 19.233 19.7341 19.053 19.747C18.873 19.7598 18.6944 19.7074 18.55 19.5992L18.47 19.5292L12 13.0592L5.52996 19.5292C5.38779 19.6617 5.19974 19.7338 5.00544 19.7304C4.81114 19.7269 4.62575 19.6482 4.48834 19.5108C4.35093 19.3734 4.27222 19.188 4.26879 18.9937C4.26536 18.7994 4.33748 18.6114 4.46996 18.4692L10.94 11.9992L4.46996 5.52918C4.34234 5.40158 4.26501 5.23224 4.25215 5.05224C4.23929 4.87223 4.29177 4.69362 4.39996 4.54918Z" fill="%23868C98"/></svg>');
    }

    .select2-container--bootstrap4.select2-container--focus .select2-selection, .select2-container--bootstrap4.select2-container--focus .select2-selection:focus {
        box-shadow: none;
    }

    .select2-container .select2-selection .select2-selection__placeholder {
        color: var(--Content-text-tertiary, #99A1AF);
        /* inherit/Body/Large */
        font-family: inherit;
        font-size: 16px;
        font-style: normal;
        font-weight: 400;
        line-height: 1.5; /* 150% */
        letter-spacing: 0.5px;
    }