/*Global style*/
:root{
    --colors-base-white: #FFF;
    --colors-base-black: #000;
    --colors-bg-25: #F2F4F1;
    --colors-bg-50: #F8F8F8;
    --colors-secondary: #FFE1BD;
    --colors-secondary-50: #FCFCFD;
    --colors-secondary-100: #F9FAFB;
    --colors-secondary-400: #DCDFE5;
    --colors-secondary-700: #344054;
    --colors-secondary-900: #101828;
    --colors-primary-50: #FFF5C2;
    --colors-primary-100: #FFEE99;
    --colors-primary-200: #FFE8ED;
    --colors-primary-300: #FFE770;
    --colors-primary-500: #c12028;
    --colors-primary-grb-500: 193, 32, 40;
    --colors-primary-600: #b32229;
    --colors-primary-700: #ab2228;
    --colors-primary-800: #CA0;
    --colors-darkgrey-500: #999;
    --colors-darkgrey-800: #515152;
    --colors-grey-25: #FCFCFD;
    --colors-grey-50: #F9FAFB;
    --colors-grey-100: #F2F4F7;
    --colors-grey-200: #EAECF0;
    --colors-grey-300: #D0D5DD;
    --colors-grey-400: #98A2B3;
    --colors-grey-500: #667085;
    --colors-grey-600: #475467;
    --colors-grey-700: #344054;
    --colors-grey-900: #101828;
    --colors-error-25: #FFFBFA;
    --colors-error-50: #FEF3F2;
    --colors-error-200: #FECDCA;
    --colors-error-300: #FDA29B;
    --colors-error-500: #F04438;
    --colors-error-700: #B42318;
    --colors-warning-25: #FFFCF5;
    --colors-warning-300: #FEC84B;
    --colors-warning-700: #B54708;
    --colors-success-50: #ECFDF3;
    --colors-success-100: #D1FADF;
    --colors-success-400: #32D583;
    --colors-success-500: #12B76A;
    --colors-success-600: #039855;
    --colors-success-700: #027A48;
    --colors-blue-50: #EFF8FF;
    --colors-blue-700: #004EEB;
    --colors-yellow-500: #ffc92e;
    --colors-rose-50: #FFF1F3;
    --colors-rose-700: #C01048;
    font-size: 16px;
}
*{
    box-sizing: border-box;
}
/*html{
    overflow: hidden;
}*/
body{
    color:var(--colors-grey-500);
    font-size:16px;
    line-height:24px;
    font-weight: 300;
    position: relative;
}
.wmd-overlay{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: none;
    background: rgba(255, 255, 255, 0.5);
    z-index: 100000;
    justify-content: center;
    align-items: center;
}
.ajax-message {
    background: rgba(0, 0, 0, 0.3);
    color: #fff;
    padding: 15px 30px;
    border-radius: 5px;
    line-height: 16px;
    display: none;
}
body.ajax-loading .wmd-overlay{
    display: flex;
}
img, svg{
    margin:0;
    padding:0;
    border:none;
    max-width:100%;
    height:auto;
}
section img, section svg{
    max-width:100%;
}
input, input:focus, textarea, textarea:focus{
    border: solid 1px var(--colors-grey-200);
    padding: 15px;
}
h1,h2,h3,h4,h5,h6{
    color: var(--colors-darkgrey-800);
}
a{
    text-decoration:none;
    color: var(--colors-grey-700);
}
a:hover{
    text-decoration:none;
    color:#333;
}
a:focus,
a:hover{
    text-decoration:none !important;
}
:hover{
    -webkit-transition-duration: 1s;
    -moz-transition-duration: 1s;
    -o-transition-duration: 1s;
    transition-duration: 1s;
}
.clear{
    clear:both;
}
input[type="search"]{
    border: 1px solid #c8c8c8;
    width: 100%;
    font-size: 16px;
    padding: 8px 10px;
    margin: 0 0 10px 0;
    height: auto;
}
input[type='submit']:hover{
    cursor: pointer;
}
.center{
    text-align:center;
    margin-bottom:40px;
}
button{
    padding: 5px;
}
.home .middle-align{
    padding: 0;
}
.middle-align,.blog .middle-align{
    margin: 0 auto;
    padding: 3em 0;
}
.wp-caption{
    margin:0;
    padding:0;
    font-size:13px;
    max-width:100%;
}
.wp-caption-text{
    margin:0;
    padding:0;
}
a:focus,
input[type="text"]:focus,
input[type="email"]:focus,
input[type="phno"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
input[type="tel"]:focus,
textarea:focus,
input[type="submit"]:focus,
#comments:focus,
select:focus,
.toggle-nav button:focus, a:focus span{
    text-decoration:none !important;
}
.fill-current, .fill-current path {
    fill: currentColor;
}
.stroke-current, .stroke-current path {
    stroke: currentColor;
}
.fill-primary, .fill-primary path {
    fill: var(--colors-primary-500);
}
.stroke-primary, .stroke-primary path {
    stroke: var(--colors-primary-500);
}
.ico-light path{
    stroke-width: 1px;
}
.ico-regular path{
    stroke-width: 1.25px;
}
.ico-bold path{
    stroke-width: 2px;
}
.wmd-conditional-grf a {
    color: var(--colors-grey-500);
    text-decoration: underline;
}
.width-3 {
    width: .75rem!important
}
.width-auto {
    width: 100%!important;
}
.height-auto {
    height: 100%!important;
}

.width-4 {
    width: 1rem!important
}

.width-5 {
    width: 1.25rem!important
}

.width-6 {
    width: 1.5rem!important
}

.width-8 {
    width: 2rem!important
}

.width-10 {
    width: 2.5rem!important
}

.width-12 {
    width: 3rem!important
}

.width-16 {
    width: 4rem!important
}
.width-18 {
    width: 6rem!important
}

.width-32 {
    width: 8rem!important
}

.width-40 {
    width: 10rem!important
}

.width-64 {
    width: 16rem!important
}

.max-width-full {
    max-width: 100%!important
}

.height-1\.25 {
    height: .3125rem!important
}

.height-3 {
    height: .75rem!important
}

.height-4 {
    height: 1rem!important
}

.height-5 {
    height: 1.25rem!important
}

.height-6 {
    height: 1.5rem!important
}

.height-8 {
    height: 2rem!important
}

.height-10 {
    height: 2.5rem!important
}

.height-12 {
    height: 3rem!important
}

.height-14 {
    height: 3.5rem!important
}

.height-16 {
    height: 4rem!important
}

.height-32 {
    height: 8rem!important
}

.height-40 {
    height: 10rem!important
}
.ico-light path{
    stroke-width: 1px;
}
input::placeholder, select::placeholder, textarea::placeholder{
    color: #999
}
.wrap-icon {
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    border-radius: 50%;
    color: var(--colors-primary-600);
    border: 8px solid var(--colors-primary-50);
    background: var(--colors-primary-100);
    justify-content: center;
}
span.v-divier {
    border-left: solid 1px var(--colors-grey-300);
}
.ibtn {
    display: flex;
    padding: 10px 18px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    border-radius: 6px;
    font-size: 16px;
    line-height: 24px;
    font-weight: 500;
    width: max-content;
    cursor: pointer;
    border: 1px solid #D0D5DD;
    background: #FFFFFF;
    color: var(--colors-primary-500);
}
.ibtn-full{
    width: 100%;
}
.ibtn-primary{
    color: var(--colors-base-white);
    background: var(--colors-primary-500);
    border: solid 1px var(--colors-primary-500);
}
.ibtn-primary:hover{
    border-color: #CA0;
}
.ibtn-dark{
    color: var(--colors-grey-25);
    background: var(--colors-secondary-900);
    border: solid 1px var(--colors-secondary-900);
}
.ibtn-dark:hover{
    color: var(--colors-grey-25);
    border-color: var(--colors-secondary-100);
}
.ibtn-second{
    border: 1px solid var(--colors-primary-200);
    background: var(--colors-primary-200);
    color: var(--colors-primary-500);
}
.ibtn-second-dark{
    border: 1px solid var(--colors-grey-700);
    background: #FFFFFF;
    color: var(--colors-grey-700);
}
.ibtn-second:hover{
    color: var(--colors-darkgrey-800);
    background: #F9FAFB;
}
.ibtn-no-border{
    border: hidden;
}
.ibtn-none{
    padding: 8px;
    border: hidden;
    background: transparent;
    color: var(--colors-darkgrey-500);
}
.ibtn-none:hover{
    color: var(--colors-grey-500);
}
.ibtn-none.ibtn-primary{
    color: var(--colors-primary-500);
}
.ibtn-none.ibtn-primary:hover{
    color: var(--colors-primary-600);
}
.ibtn-bigger{
    font-size: 18px;
    line-height: 28px;
    border-radius: 8px;
}
.ibtn-small{
    font-size: 14px;
    line-height: 20px;
}
.ibtn-disabled, .ibtn-disabled:hover{
    border: 1px solid var(--colors-grey-200);
    background: var(--colors-base-white);
    color: var(--colors-grey-300);
}
.ibtn-mobile-full-width{
    width: auto;
}
.text-bold-6{
    font-weight: 600;
}
.link-clickable{
    cursor: pointer;
}
.hide-on-mobile{
    display: block;
}
.show-on-mobile{
    display: none;
}
.wmd-hide{
    display: none;
}
.wmd-respon-msg{
    width: 100%;
}
.pswp, #custombox-modal-container, #wmd-notice-modal{
    display: none;
}
.custombox-modal-click{
    cursor: pointer;
}
body .custombox-content, body .custombox-overlay{
    z-index: 99999;
    overflow: hidden;
    max-width: 720px;
}
div#custombox-modal-container, div#wmd-notice-modal {
    max-width: 800px;
    margin: 1rem;
    position: relative;
}
.custombox-fullscreen div#custombox-modal-container {
    max-width: 100%;
    border-radius: 0;
    margin: 0;
    overflow: auto;
}
div#wmd-notice-modal {
    max-width: 450px;
}
div#wmd-notice-modal .close-btn,
div#custombox-modal-container .close-btn {
    text-align: right;
    position: relative;
    display: block;
    background: transparent;
}
div#wmd-notice-modal .close-btn span,
div#custombox-modal-container .close-btn span{
    padding: 5px 9px;
    position: absolute;
    top: 10px;
    right: 15px;
    cursor: pointer;
    z-index: 1;
    font-size: 20px;
    /*opacity: 0;*/
    transition: all .5s linear;
    color: var(--colors-grey-900);
    background: #fff;
    width: 30px;
    height: 30px;
    display: flex;
    border-radius: 50%;
}
div#wmd-notice-modal .close-btn span:hover,
div#custombox-modal-container .close-btn span:hover{
    color: red;
}
div#wmd-notice-modal .notice-modal-content,
div#custombox-modal-container .custombox-modal-content {
    height: 100%;
    background: #fff;
}
div#custombox-modal-container .custombox-modal-content > div.video-popup-wrap {
    padding: 45px 5px 15px;
    overflow: hidden;
    border-radius: 12px;
}
div#custombox-modal-container .custombox-modal-content > div.no-padding {
    padding: 0;
    overflow: hidden;
}
div#wmd-notice-modal .notice-modal-content > *,
div#custombox-modal-container .custombox-modal-content > * {
    padding: 24px;
    border-radius: 4px;
    background: var(--colors-base-white);
    display: flex;
}
div#wmd-notice-modal .notice-modal-content{
    min-height: 150px;
}
div#wmd-notice-modal .notice-modal-content .modal-header,
div#custombox-modal-container .custombox-modal-content .modal-header{
    display: flex;
    gap: 16px;
    flex-direction: column;
    padding: 0;
}
div#wmd-notice-modal .notice-modal-content .header-icon,
div#custombox-modal-container .custombox-modal-content .header-icon{
    display: flex;
}
div#wmd-notice-modal .notice-modal-content .modal-title,
div#custombox-modal-container .custombox-modal-content .modal-title{
    color: var(--colors-grey-900);
    font-size: 18px;
    font-style: normal;
    font-weight: 600;
    line-height: 28px;
}
div#wmd-notice-modal .notice-modal-content .modal-desc,
div#custombox-modal-container .custombox-modal-content .modal-desc{
    color: var(--colors-grey-600);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
}
div#wmd-notice-modal .notice-modal-content form,
div#custombox-modal-container .custombox-modal-content form{
    display: flex;
    flex-direction: column;
    gap: 16px;
}
div#wmd-notice-modal .notice-modal-content form .modal-content,
div#custombox-modal-container .custombox-modal-content form .modal-content{
    background: #fff;
    gap: 16px;
    display: flex;
    flex-direction: column;
}
div#wmd-notice-modal .notice-modal-content form .modal-content .field-group,
div#custombox-modal-container .custombox-modal-content form .modal-content .field-group{
    display: flex;
    gap: 16px;
}
div#wmd-notice-modal form .modal-content .field-group > div,
div#custombox-modal-container form .modal-content .field-group > div{
    flex: 1;
}
div#wmd-notice-modal .modal-footer,
div#custombox-modal-container .modal-footer{
    border: hidden;
    padding: 0;
    display: flex;
    gap: 16px;
}
div#wmd-notice-modal .modal-footer button,
div#custombox-modal-container .modal-footer button{
    flex: 1;
}
div#wmd-notice-modal .modal-footer:before,div#wmd-notice-modal .modal-footer:after,
div#custombox-modal-container .modal-footer:before,div#custombox-modal-container .modal-footer:after{
    display: none;
}
div#wmd-notice-modal .modal-loading ,
div#custombox-modal-container .modal-loading {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 40px;
}
.text-left{
    text-align: left!important;
}
/*Scrollbar style*/
/*.wmd-scrollbar::-webkit-scrollbar-track
{
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
    border-radius: 10px;
    background-color: #F5F5F5;
}*/
.iw-col-50{
    width: 50%;
}
.wmd-scrollbar::-webkit-scrollbar
{
    -webkit-appearance: initial;
    background-color: #e3e6e9;
    width: 6px
}

.wmd-scrollbar::-webkit-scrollbar-thumb
{
    background-color: #a2aab6;
    border-radius: 4px;
    -webkit-box-shadow: 0 0 1px #a4d560;
}
.wmd-scrollbar.transparen-scroll::-webkit-scrollbar
{
    background-color: transparent;
}

.wmd-scrollbar.transparen-scroll::-webkit-scrollbar-thumb
{
    background-color: transparent;
}
.dropdown-group{
    position: relative;
}
.dropdown-group .dropdown-focus > *{
    cursor: pointer;
}
.dropdown-group .dropdown-list{
    display: none;
    padding: 0;
    position: absolute;
    margin: 0;
    top: 100%;
    background: #fff;
    z-index: 1;
    overflow: auto;
    width: 100%;
    text-align: left;
    max-height: 350px;
}
.dropdown-group.show-dropdown .dropdown-list{
    display: block!important;
}
.inner-footer{
    display: flex;
    height: 96px;
    padding: 32px;
    justify-content: space-between;
    align-items: flex-end;
    align-self: stretch;
    color: var(--colors-grey-600, #475467);
    font-size: 14px;
    line-height: 20px;
}
.inner-footer div{
    display: flex;
    align-items: center;
    gap: 8px;
}
/*end scroll bar style*/
.check-box-require{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    align-items: flex-start;
}
body .wmd-btn{
    text-transform: none;
}
div.page-content, div.contents-main{
    background: #fff;
}
section.irow{
    display: block;
    position: relative;
    background: #fff;
}
section.irow .section-inner{
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 1rem;
}
section.irow.full-width .section-inner{
    max-width: none;
    padding: 0;
}
.section-row{
    display: flex;
    gap: 15px;
}
.section-col-50{
    width: 50%;
}

.text_separator{
    margin-top: 100px;
    margin-bottom: 70px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: nowrap;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}
.text_separator .sep_holder{
    height: 1px;
    position: relative;
    -webkit-box-flex: 1;
    -webkit-flex: 1 1 auto;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    min-width: 10%;
}
.text_separator .sep_holder .sep_line{
    height: 1px;
    border-top: 1px solid #ebebeb;
    display: block;
    position: relative;
    top: 1px;
    width: 100%;
}
.text_separator h4{
    font-weight:400;
    text-align:center;
    line-height: 1em;
    font-size: 100%;
    margin: 0;
    word-wrap: break-word;
    -webkit-box-flex: 0;
    -webkit-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    padding: 0 0.8rem;
}
img[data-lazyloaded]{
    opacity: 0;
}
img.litespeed-loaded{
    -webkit-transition: opacity .5s linear 0.2s;
    -moz-transition: opacity .5s linear 0.2s;
    transition: opacity .5s linear 0.2s;
    opacity: 1;
}
.wmd-field{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
    align-self: stretch;
}
.wmd-field label{
    color: var(--colors-grey-700);
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
    margin-bottom: 0;
}
.wmd-field .wmd-input{
    display: flex;
    align-items: flex-start;
    gap: 4px;
    align-self: stretch;
    flex-direction: column;
    position: relative;
}
.wmdmb-field .wmdmb-input .field-tip,
.wmd-field .wmd-input .field-tip{
    position: absolute;
    right: 10px;
    height: 100%;
    display: flex;
    align-items: center;
}
.wmd-field .wmd-input .field-tip > i{
    cursor: pointer;
}
.wmd-field input, .wmd-field textarea{
    padding: 8px 35px 8px 12px;
    border-radius: 8px;
    border: 1px solid var(--colors-grey-300);
    background: var(--colors-base-white);
    color: var(--colors-darkgrey-800);
    font-size: 16px;
    line-height: 24px;
    width: 100%;
    height: 40px;
}
.wmd-field textarea{
    height: 100px
}
.wmd-field .field-description{
    color: var(--colors-grey-600);
    font-size: 12px;
    line-height: 18px;
}
.wmd-respon-msg{
    width: 100%;
}
.alert{
    width: 100%;
    padding: 24px 16px;
    border-radius: 12px;
    font-size: 14px;
    line-height: 20px;
    margin: 20px 0;
}
.alert .alert-container{
    display: flex;
    align-items: flex-start;
    gap: 12px;
}
.alert .alert-container .alert-icon{
    display: flex;
}
.alert .alert-content{
    display: flex;
    align-items: center;
    gap: 15px;
    flex-grow: 1;
    justify-content: space-between;
}
.alert .alert-content-text{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
    flex: 1 0 0;
}
.alert .alert-content a:not(.ibtn) {
    color: inherit;
    text-decoration: underline;
}
.alert.alert-danger{
    border: 1px solid var(--colors-error-300);
    background: var(--colors-error-25);
    color: var(--colors-error-700);
}
.alert.alert-success{
    border: 1px solid var(--colors-success-400);
    background: var(--colors-success-50);
    color: var(--colors-success-700);
}
.alert.alert-default{
    border-radius: 12px;
    border: 1px solid var(--colors-grey-300);
    background: var(--colors-base-white);
}
.alert.alert-grey {
    border: 1px solid var(--colors-grey-200);
    background: var(--colors-grey-50);
    color: var(--colors-grey-700);
}
.alert.alert-darkgrey {
    border: 1px solid #ccc;
    background: #f6f7f9;
    color: #333;
}
.alert.alert-default .alert-icon{
    border-radius: 8px;
    border: 1px solid var(--colors-grey-200);
    background: var(--colors-base-white);
    box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05);
    padding: 10px;
    color: var(--colors-grey-700);
    font-size: 20px;
}
.alert.alert-default .alert-title{
    color: var(--colors-grey-700);
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 20px;
}
.alert.alert-default .alert-content{
    color: var(--colors-grey-600);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
}
.alert.alert-warning{
    border: 1px solid var(--colors-warning-300);
    background: var(--colors-warning-25);
    color: var(--colors-warning-700);
}
.alert .alert-title{
    font-weight: 600;
}

.wmd-paging {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 30px;
}
.wmd-paging .page-listing-items{
    display: flex;
    align-items: center;
}
.wmd-paging .page-listing-items .page-item{
    display: flex;
    align-items: center;
    padding: 0 10px;
    min-width: 40px;
    min-height: 40px;
    justify-content: center;
    border-radius: 8px;
    color: var(--colors-grey-600);
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 20px;
}
.wmd-paging .page-listing-items .page-item.active, .wmd-paging .page-listing-items .page-item:hover{
    background: var(--colors-grey-50);
}

.wmd-button-loader{
    position: relative;
}
.rem-button-loader {
    line-height: 36px;
    position: absolute;
    top: 0;
    left: 0;
    display: none;
    width: 100%;
    height: 100%;
    cursor: pointer;
    text-align: center;
    vertical-align: top;
    border: 0;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    background: var(--colors-primary-500);
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.rem-button-loader > div {
    display: inline-block;
    width: 8px;
    height: 8px;
    -webkit-animation: bouncedelay 1.4s infinite ease-in-out;
    animation: bouncedelay 1.4s infinite ease-in-out;  /* Prevent first frame from flickering when animation starts */
    border-radius: 100%;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    background: #fff;
}

.rem-button-loader .bounce1 {
    -webkit-animation-delay: -.32s;
    animation-delay: -.32s;
}

.rem-button-loader .bounce2 {
    -webkit-animation-delay: -.16s;
    animation-delay: -.16s;
}

@-webkit-keyframes bouncedelay {
    0%, 80%, 100% {
        -webkit-transform: scale(.0);
        transform: scale(.0);
    }
    40% {
        -webkit-transform: scale(1.0);
        transform: scale(1.0);
    }
}
@keyframes bouncedelay {
    0%, 80%, 100% {
        -webkit-transform: scale(.0);
        transform: scale(.0);
    }
    40% {
        -webkit-transform: scale(1.0);
        transform: scale(1.0);
    }
}

.wmd-tooltip {
    position: relative;
    display: inline-block;
    cursor: pointer;
}

.wmd-tooltip::after {
    content: attr(data-text);
    visibility: hidden;
    width: max-content;
    max-width: 150px;
    background-color: #333;
    color: #fff;
    text-align: center;
    padding: 10px 15px;
    border-radius: 5px;
    position: absolute;
    z-index: 1;
    bottom: calc(100% + 5px); /* Điều chỉnh vị trí của tooltip */
    left: 50%;
    transform: translateX(-50%);
    opacity: 0;
    transition: opacity 0.3s;
    font-size: 14px;
    line-height: 16px;
}
.wmd-tooltip.tooltip-bottom::after{
    top: calc(100% + 5px);
    bottom: auto;
}

.wmd-tooltip:hover::after {
    visibility: visible;
    opacity: 1;
}

.wmd-tooltip::before {
    content: '';
    position: absolute;
    top: -5px; /* Đặt mũi tên ở dưới tooltip */
    left: 50%;
    margin-left: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: #333 transparent transparent transparent; /* Màu sắc của mũi tên */
    visibility: hidden;
    opacity: 0;
    transition: opacity 0.3s;
    z-index: 1;
}
.wmd-tooltip.tooltip-bottom::before{
    top: calc(100% - 5px);
    transform: rotate(180deg);
}

.wmd-tooltip:hover::before {
    visibility: visible;
    opacity: 1;
}

.wmd-products {
    padding: 140px 0 100px;
    display: flex;
    gap: 30px;
    flex-direction: column;
}
.product-categorie-inner {
    display: flex;
    gap: 8px;
    overflow-x: auto;
    padding-bottom: 8px;
    flex-wrap: wrap;
}
.product-categorie-inner .cat-item {
    display: flex;
    padding: 8px 12px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    border-radius: 6px;
    color: var(--colors-grey-500);
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 20px;
    cursor: pointer;
    white-space: nowrap;
    border: 1px solid #D0D5DD;
    transition: none;
}
.product-categorie-inner .cat-item:hover {
    color: var(--colors-primary-700);
}
.product-categorie-inner .cat-item.active {
    color: var(--colors-primary-700);
    background: var(--colors-primary-200);
    border-color: var(--colors-primary-500);
}
.wmd-products .wmd-product-items{
    flex-grow: 1;
    display: flex;
    gap: 15px;
    flex-wrap: wrap;
}
.wmd-products .wmd-product-items .project-block{
    width: calc(33.33% - 10px);
}
.wmd-products .wmd-product-items .project-block .project-block-one{
    display: flex;
    flex-direction: column;
    padding: 15px;
    border: solid 1px #dedede;
    text-align: center;
}
.wmd-products .wmd-product-items .project-block .product-name{
    padding-top: 15px;
    font-size: 18px;
    font-weight: 500;
}
.wmd-products .wmd-product-items .project-block .product-name a {
    color: var(--colors-primary-500);
}
.wmd-products .wmd-product-sidebar{
    width: 250px;
    flex: 0 0 auto;
}
.load-more-item {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    margin-top: 30px;
}
.load-more-item button{
    min-width: 200px;
}
.ajax-loading{
    position: relative;
}
.ajax-loading:before {
    position: absolute;
    content: "";
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background: var(--colors-base-black);
    opacity: 0.2;
    z-index: 100;
}

/***************************End Global******************************/

/******************************Responsive**************************************/
@media (max-width: 1024px){
    .wmd-products .wmd-product-items .project-block{
        width: calc(50% - 15px);
    }
}
@media (max-width: 780px){
    body.admin-bar .page-wrapper{
        height: calc(100vh - 46px);
    }
    .ibtn-mobile-full-width{
        width: 100%;
    }
    .wmd-products .wmd-product-items .project-block{
        width: 100%;
    }
}