.dropdown-toggle::after{font-family:"Font Awesome 5 Pro";display:inline-block;border:0;vertical-align:middle;font-size:1rem;margin-left:.36875rem;line-height:1;content:"\f107";font-weight: 300;}
.nav-item-submenu>.nav-link:after{content:"\f105";font-family:"Font Awesome 5 Pro";display:inline-block;font-size:0.8rem;vertical-align:middle;line-height:1;position:absolute;top:.75rem;margin-top:.12502rem;right:1.25rem;transition:-webkit-transform .25s ease-in-out;transition:transform .25s ease-in-out;transition:transform .25s ease-in-out,-webkit-transform .25s ease-in-out;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
.navbar .fa-bars{font-size: 18.5px;width: 16px;height: 16px;overflow: hidden;}
.dropdown-menu>.dropdown-submenu>.dropdown-item:after{font-family:"Font Awesome 5 Pro"; content: "\f105"}
.list-inline-dotted .list-inline-item:not(:last-child):after{font-family:"Font Awesome 5 Pro";content:"\f0a3";}
.daterangepicker .table-condensed thead tr:last-child th{padding-top: 0.1rem}
.daterangepicker .table-condensed tr>td, .daterangepicker .table-condensed tr>th{padding: 0.00001rem}
.dataTable tbody .selected .select-checkbox:after{font-family:"Font Awesome 5 Pro";content: '\f00c';font-size: .58rem;line-height: 1.8;margin-top: -.5rem;margin-left: -.26rem;font-weight: bold}
.table td, .table th {
	padding:0.75rem
}
.table th.select-checkbox {
	padding: 0.75rem 1rem
}
.sidebar-dark .nav-sidebar>.nav-item.nav-item-submenu ul .nav-link.active {
    background-color: transparent;
    color: orange;
}
.alert[class*=alert-styled-].alert-warning:after, .alert[class*=alert-styled-][class*=bg-warning]:after{content: "\f071"; font-family: "Font Awesome\ 5 Pro";}[data-action="collapse"]:after { font-family: Font Awesome\ 5 Pro; content: "\f106"; font-size: 1.4em;}.sort-order-input{width: 50px;height: 30px;padding:.15rem}.hide-icon-number[type="number"]::-webkit-inner-spin-button, .hide-icon-number[type="number"]::-webkit-outer-spin-button{ display: none !important; }.validation-invalid-label:before{content: "\f071";font-family: Font Awesome\ 5 Pro;}
.ck-editor__main .ck-content{ min-height: 120px; }
.form-filter select,
.custom-selectbox {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background: url('data:image/svg+xml;charset=UTF-8,<svg aria-hidden="true" focusable="false" data-prefix="fal" data-icon="chevron-down" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" class="svg-inline--fa fa-chevron-down fa-w-14"><path fill="currentColor" d="M443.5 162.6l-7.1-7.1c-4.7-4.7-12.3-4.7-17 0L224 351 28.5 155.5c-4.7-4.7-12.3-4.7-17 0l-7.1 7.1c-4.7 4.7-4.7 12.3 0 17l211 211.1c4.7 4.7 12.3 4.7 17 0l211-211.1c4.8-4.7 4.8-12.3.1-17z" class=""></path></svg>') no-repeat right .3rem center/10px 10px;
}
#templateCategory .sidebar-expand-md.sidebar-component {
    width: auto;
}
.dropdown-item {
    padding: .5rem 1rem;
}

#box-blocks .section-item {
    height: 170px;
    cursor: pointer;
}
#box-blocks .section-item>div {
    width: 100%;
    height: 100%;
    background: #fff;
    border: 1px solid #ccc;
}

/* middle ô select box khi sử dụng select2 */
.input-group .select2-container .select2-selection--single {
    display: flex;
    align-items: center;
}

/* fix display error on invisible element, select2 cannot calculate correct width of element (.i.e input in inactive tab) */
.select2 {
    flex: 1 1 auto;
}

.select2-selection--single .select2-selection__arrow:after {
    font-family: "Font Awesome 5 Pro";
    content: "\f107";
    right: 0.3rem;
    font-size: 0.9rem;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
    top: 5px
}

.select2-search--dropdown:after {
    font-family: "Font Awesome 5 Pro";
    content: "\f002";
    position: absolute;
    top: 50%;
    left: calc(100% - 40px);
    right: 1.875rem;
}

.select2-container .select2-selection--single {
    box-sizing: border-box;
    cursor: pointer;
    display: block;
    height: calc(1.5385em + .875rem + 2px) !important;
    user-select: none;
    -webkit-user-select: none;
}

.select2-container--default .select2-selection--single {
    line-height: 24px;
    padding-left: .4375rem;
}

.select2-container--default .select2-results > .select2-results__options {
    max-height: 300px
}

.select2-dropdown {
    border-radius: 0 !important
}

.select2-container--default .select2-selection--single {
    line-height: 22px;
}

.select2-container .select2-selection--single {
    height: calc(1.5385em + .875rem + 1px) !important;
}

/* custom display element filter select2 */
.form-filter .select2-container {
    width: 100% !important;
}

.form-filter .select2-selection--single .select2-selection__arrow:after {
    font-size: 1.04rem;
    font-weight: 100;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: 20px !important;
    padding-left: 0 !important;
}
.select2-container--default .select2-search--dropdown .select2-search__field {
    padding-left: 15px !important;
}

.select2-dropdown.select2-dropdown--below {
    min-width: 300px !important;
}

.select2-results__option .wrapSelect:before{
    font-family: "Font Awesome 5 Pro";
    content: '\f0c8';
    padding-right: 10px;
}
.select2-results__option[aria-selected=true] .wrapSelect:before,.select2-results__option--selected .wrapSelect:before{
    font-family: "Font Awesome 5 Pro";
    content: '\f14a';
}
.select2-selection__clear {
    display: none;
}

.select2-search__field.inputCheckAll {
    width: calc(100% - 30px);
}