html {
    font-size: 62.5%;
    /* 1rem = 10px */
}

body {
    font-family: "Be Vietnam Pro", sans-serif;
    font-size: 1.6rem;
    line-height: 2.4rem;
    font-weight: 400;
    background: #F7F8F8;
}

body.body-ja {
    font-family: "Noto Sans JP", sans-serif;
}

@media (min-width: 1680px) {
    .container, .container-sm, .container-md, .container-lg, .container-xl {
        width: 1440px;
        max-width: 1440px;
    }
}

@media (min-width: 1440px) and (max-width: 1680px) {
    .container, .container-sm, .container-md, .container-lg, .container-xl {
        width: 1200px;
        max-width: 1200px;
    }
}

@media (min-width: 1200px) {
    .col-lg-20 {
        flex: 0 0 20%;
        max-width: 20%;
    }

    .menu-vertical ul {
        display: block !important;
    }
}

.bootstrap-select .dropdown-menu {
    border-radius: 0.6rem;
    padding: 0;
    margin-top: 0.5rem;
}

.dropdown-item.active, .dropdown-item:active {
    background-color: #0f3556;
}

.bootstrap-select .dropdown-toggle .filter-option-inner-inner {
    font-size: 1.4rem;
    color: #6f788ad1;
}

/* MÃ u khi Ä‘Ã£ chá»n */
.bootstrap-select > .dropdown-toggle:not(.bs-placeholder)
.filter-option-inner-inner {
    color: black;
}

.topbar-section ul.topbar-dropdown {
    font-size: 1.4rem;
    width: 100%;
    min-width: 21rem;
    border-radius: 0.4rem;
    background: rgb(221,229,228);
    background: -moz-linear-gradient(left, rgb(221,229,228) 0%, rgb(205,227,244) 100%);
    background: -webkit-linear-gradient(left, rgb(221,229,228) 0%, rgb(205,227,244) 100%);
    background: linear-gradient(to right, rgb(221,229,228) 0%, rgb(205,227,244) 100%);
    border-radius: 5px;
    margin-top: 5px;
    background-color: #fafafa;
    border: 2px solid white;
    padding: 10px;
}

.topbar-section ul.topbar-dropdown li {
    background-color: white;
}

.topbar-section ul.topbar-dropdown a {
    border-bottom: 1px solid #e3e3e3;
}

.topbar-section ul.topbar-dropdown li:hover a {
    background-color: #103460 !important;
    position: relative;
    color: white;
}

.topbar-section ul.topbar-dropdown>li:last-child a {
    border-bottom: 0;
}

.setting-menu.fixed, .setting-menu-mb.fixed {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    display: block;
    transition: all 0.3s ease 0s;
    z-index: 99;
    box-shadow: 0px 10px 13px rgb(0 0 0 / 5%);
}

.single-upload {
    position: relative;
    display: inline-block;
}

.single-img {
    width: 9rem;
    height: 8.4rem;
    background: #ebedf2;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0.5rem;
    border-radius: 0.8rem;
}

.wrap-files .list-files {
    position: relative;
    background: #f9f9f957;
    border-radius: 0.8rem;
    min-height: 4rem;
    padding: 0.5rem;
    border: 1px solid #dee2e6;
}

.wrap-files .list-files .item-file {
    border: 1px solid #e2e5ec;
    height: 4rem;
    width: 4rem;
    position: relative;
    border-radius: 0.8rem;
    background: #fff;
    margin-right: 0.5rem;
    display: inline-block;
}

.wrap-files .list-files .item-file > i {
    font-size: 1.6rem !important;
    /* margin: 10px auto; */
    width: 4rem;
    height: 4rem;
    text-align: center;
    line-height: 4rem;
    display: block;
}

.wrap-files .list-files .item-file .btn-clear-file {
    border: 1px solid #e2e5ec;
    width: 1.8rem !important;
    height: 1.8rem !important;
    display: -ms-flexbox;
    display: flex;
    cursor: pointer;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    position: absolute;
    top: auto;
    right: -0.8rem;
    bottom: -0.4rem;
    width: 1.8rem;
    height: 1.8rem;
    border-radius: 50%;
    background-color: #ffffff;
    -webkit-box-shadow: 0px 0px 13px 0px rgba(0, 0, 0, 0.1);
    box-shadow: 0px 0px 13px 0px rgba(0, 0, 0, 0.1);
    font-size: 0.9rem;
}

.nh-list-img {
    padding: 0.5rem 0.5rem 0 0.5rem;
    border-radius: 0.8rem;
    min-height: 8.4rem;
    background: #f9f9f9;
    border: 1px solid #ebedf2;
}

.single-edit {
    position: absolute;
    right: -1rem;
    top: -1rem;
    width: 2.5rem;
    height: 2.5rem;
    font-size: 1.3rem;
    border-radius: 50%;
    background-color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    -webkit-box-shadow: 0 0 1.3rem 0 rgba(0, 0, 0, .1);
    box-shadow: 0 0 1.3rem 0 rgba(0, 0, 0, .1);
}

.btn-album {
    border: 1px solid var(--color-highlight);
    background-color: var(--color-highlight);
    color: var(--white);
}

body.member .tox-tinymce {
    border-color: #dee2e6;
    border-width: 1px;
}

.tox-tinymce {
    border: 2px solid #eee;
    border-radius: 3px;
    box-shadow: none;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    overflow: hidden;
    position: relative;
    visibility: inherit !important;
}

.tox {
    box-shadow: none;
    box-sizing: content-box;
    color: #222f3e;
    cursor: auto;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    -webkit-tap-highlight-color: transparent;
    text-decoration: none;
    text-shadow: none;
    text-transform: none;
    vertical-align: initial;
    white-space: normal;
}

.tox .tox-statusbar span.tox-statusbar__branding {
    display: none;
}

.form-control {
    border: 1px solid #dee2e6;
    border-radius: 0.6rem;
}

.btn-action {
    width: auto;
    height: 4rem;
}

/* page add product */
.input-group-text {
    border: 1px solid #dee2e6;
}

.title-item {
    font-size: 1.8rem;
    font-weight: 600;
    padding: 1rem 0;
    position: relative;
}

.title-item:before {
    /* content: ''; */
    position: absolute;
    bottom: 0;
    left: -1.5rem;
    width: calc(100% + 3rem);
    background-color: #dee2e6;
    height: 1px;
}

.btn-main {
    border: 1px solid var(--color-highlight);
    background-color: var(--color-highlight);
    color: var(--white);
}

.item-variant {
    padding: 1.5rem;
    background-color: #f9f9f9;
    border-radius: .25rem;
    margin: 1rem 0;
    border: 1px solid #dee2e6;
}

.list-option {
    background-color: #fff;
    border-radius: 0.5rem;
    padding: 1rem 1rem 0;
}

.list-option > .row {
    margin-right: -7px;
    margin-left: -7px;
}

.item-option {
    padding-bottom: 1rem;
    padding-left: 7px;
    padding-right: 7px;
    /* padding: 1rem 1rem 0;
    background-color: #fff;
    border-radius: .25rem; */
}

.item-option:last-child {
    /* padding-bottom: 1rem; */
}

.delete-option i, .choose-image-option i {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 4rem;
    height: 4rem;
    border: 1px dashed #dee2e6;
    border-radius: 0.8rem;
    cursor: pointer;
}

[wrap-suggest] , [wrap-suggest-option] {
    position: relative;
}

.list-suggest {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 1000;
    /* display: none; */
    float: left;
    width: 100%;
    padding: 0.5rem 0;
    margin: 0.125rem 0 0;
    font-size: 1.4rem;
    color: #212529;
    text-align: left;
    list-style: none;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid rgba(0, 0, 0, 0.15);
    border-radius: 0.25rem;
}

.fw-500 {
    font-weight: 500;
}

.d-flex.d-none {
    display: none !important;
}

.item-image-album {
    float: left;
    margin-right: 10px;
    border: 1px dashed #dee2e6;
    border-radius: 3px;
    cursor: pointer;
}

.item-image-album .btn-clear-image-album {
    width: 16px !important;
    height: 16px !important;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    cursor: pointer;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    position: absolute;
    top: auto;
    right: -7px;
    bottom: -4px;
    border-radius: 50%;
    background-color: #ffffff;
    -webkit-box-shadow: 0px 0px 13px 0px rgba(0, 0, 0, 0.1);
    box-shadow: 0px 0px 13px 0px rgba(0, 0, 0, 0.1);
    color: #000;
    font-size: 1.2rem;
}

.border-bottom-dashed {
    border-bottom: 1px dashed #dee2e6 !important;
}

.progress {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 1.5rem;
    overflow: hidden;
    font-size: 1rem;
    background-color: #ebedf2;
    border-radius: .25rem;
}

.progress-bar {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    overflow: hidden;
    color: #fff;
    text-align: center;
    white-space: nowrap;
    background-color: #5867dd;
    -webkit-transition: width .6s ease;
    transition: width .6s ease;
}

.progress-bar-striped {
    background-image: linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
    background-size: 1rem 1rem;
}

.rounded-8px, .form-product .btn, .form-product .form-control, .form-product .bootstrap-select>.dropdown-toggle, .form-list-rfq .btn {
    border-radius: 8px;
}

.form-product .input-group-text, .form-product .bootstrap-select>.dropdown-toggle {
    background-color: #f9f9f9;
}

.form-product .form-control:disabled, .form-product .form-control[readonly] {
    background-color: #f9f9f9;
}

.form-product > .row, .form-list-rfq > .row {
    margin-left: -7px;
    margin-right: -7px;
}

.form-product > .row > div, .form-list-rfq > .row > div {
    padding-left: 7px;
    padding-right: 7px;
}

.list-product-element .table-rounded {
    border: 1px solid #dee2e6;
    border-radius: 8px;
}

.list-product-element .table-rounded > table {
    margin: 0;
}

.list-product-element table thead th {
    border: 0;
    background-color: #fff;
    border-bottom: 1px solid #dee2e6;
    padding: 1.5rem 0.75rem;
    color: #000;
    font-weight: 700;
}

.list-product-element table td, .list-product-element tbody th {
    border: 1px solid #dee2e6;
    border-left: 0;
    border-right: 0;
}

.list-product-element table tr:first-child th:first-child {
    border-top-left-radius: 8px;
}

.list-product-element table tr:first-child th:last-child {
    border-top-right-radius: 8px;
}

.list-product-element table tbody tr:last-child th {
    border-bottom-left-radius: 8px;
}

.list-product-element table tbody tr:last-child th, .list-product-element table tbody tr:last-child td {
    border-bottom: 0;
}

.list-product-element tbody tr:last-child td:last-child {
    border-bottom-right-radius: 8px;
}

#wrap-data-selected .tagify__tag {
    background-color: #ebedf2;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: .3rem .75rem;
    border-radius: 4px;
    margin: 3px 5px;
}

#wrap-data-selected .tagify__tag .tagify__tag__removeBtn {
    margin-left: 5px;
}

.mh-40 {
    min-height: 40px;
}

.wrap-manager .card {
    border-radius: 8px;
    margin-bottom: 1.5rem;
}

.wrap-manager .card-header {
    border: 1px solid #dee2e6;
    background-color: #f9f9f9;
    padding: 1rem;
    border-radius: 8px 8px 0 0;
}

.wrap-manager .card-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 0;
}

.wrap-manager .card-title button {
    padding: 0;
    font-size: 1.5rem;
    font-weight: 500;
    color: #48465b;
}

.wrap-manager .card-body {
    padding: 1.5rem;
    border: 1px solid #dee2e6;
    border-top: 0;
    border-radius: 0 0 8px 8px;
}

.wrap-manager .card-body label {
    font-weight: 500;
    font-size: 1.4rem;
}

.wrap-manager .btn-action {
    height: auto;
}

.wrap-manager .btn-action .btn {
    width: 3rem;
    height: 3rem;
    line-height: 3rem;
    text-align: center;
    padding: 0;
}

.list-image-album {
    padding: 5px 5px 0px 5px;
    border-radius: 8px;
    min-height: 80px;
    background: #f9f9f9;
    border: 1px solid #f9f9f9;
    display: flex;
    flex-wrap: wrap;
}

.nh-avatar {
    position: relative;
    display: inline-block;
}

.nh-avatar > a {
    width: 120px;
    height: 120px;
    border-radius: 8px;
    background-repeat: no-repeat;
    background-size: cover;
    border: 3px solid #fff;
    -webkit-box-shadow: 0 0 13px 0 rgba(0, 0, 0, .1);
    box-shadow: 0 0 13px 0 rgba(0, 0, 0, .1);
}

.nh-avatar .nh-avatar-upload {
    cursor: pointer;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    position: absolute;
    right: -10px;
    top: -10px;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background-color: #fff;
    -webkit-box-shadow: 0 0 13px 0 rgba(0, 0, 0, .1);
    box-shadow: 0 0 13px 0 rgba(0, 0, 0, .1);
    -webkit-transition: all .3s;
    transition: all .3s;
}

.nh-avatar .nh-avatar-upload i {
    color: #5d78ff;
    font-size: .9rem;
}

.nh-avatar .nh-avatar-cancel {
    cursor: pointer;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    position: absolute;
    top: auto;
    right: -10px;
    bottom: -5px;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background-color: #fff;
    -webkit-box-shadow: 0 0 13px 0 rgba(0, 0, 0, .1);
    box-shadow: 0 0 13px 0 rgba(0, 0, 0, .1);
    display: none;
}

.nh-avatar .nh-avatar-cancel i {
    -webkit-transition: all .3s;
    transition: all .3s;
    color: #74788d;
    font-size: .9rem;
}

/* css UI search complete thuoc tinh mo rong */
.ui-widget {
    font-size: 1.5rem;
    font-family: "Inter", sans-serif;
}

.ui-widget-content.ui-autocomplete::-webkit-scrollbar {
    width: 4px;
    height: 40px;
}

.ui-widget-content.ui-autocomplete::-webkit-scrollbar-track {
    background: #f1f1f1;
}

.ui-widget-content.ui-autocomplete::-webkit-scrollbar-thumb {
    background: #d8dce6;
}

.ui-widget-content.ui-autocomplete::-webkit-scrollbar-thumb:hover {
    background: #999;
}

.tagify__dropdown::-webkit-scrollbar {
    width: 4px;
    height: 40px;
}

.tagify__dropdown::-webkit-scrollbar-track {
    background: #f1f1f1;
}

.tagify__dropdown::-webkit-scrollbar-thumb {
    background: #d8dce6;
}

.tagify__dropdown::-webkit-scrollbar-thumb:hover {
    background: #999;
}

.ui-widget-content.ui-autocomplete {
    border: 0;
    -webkit-box-shadow: 0px 0px 50px 0px rgba(82, 63, 105, 0.15);
    box-shadow: 0px 0px 50px 0px rgba(82, 63, 105, 0.15);
    padding: 0px 0 5px;
    /* border-radius: 4px; */
    max-height: 350px;
    max-width: 500px;
    overflow: auto;
    z-index: 9999;
}

.ui-widget-content.ui-autocomplete .ui-menu-item-wrapper {
    display: block;
    padding: 5px 10px;
    line-height: 26px;
}

.ui-widget-content.ui-autocomplete .ui-menu-item:hover {
    border: 0;
}

.ui-widget-content.ui-autocomplete .ui-menu-item:hover .ui-menu-item-wrapper {
    background: #f7f8fa;
    color: #595d6e;
    border: 0;
}

.ui-widget-content.ui-autocomplete .ui-state-focus, .ui-widget-content.ui-autocomplete .ui-state-active {
    margin: 0px;
}

.ui-widget-content.ui-autocomplete .ui-state-active, .ui-widget-content.ui-autocomplete a.ui-button:active, .ui-widget-content.ui-autocomplete .ui-button:active, .ui-widget-content.ui-autocomplete .ui-button.ui-state-active:hover {
    border: 0;
    background: transparent;
    /*font-weight: 300;*/
    color: #595d6e;
}

.ui-widget-content.ui-autocomplete .item-add-more .ui-menu-item-wrapper {
    border-bottom: 1px solid #ddd;
    background: #ebedf240;
}

.ui-widget-content.ui-autocomplete .item-add-more:hover .ui-menu-item-wrapper {
    border-bottom: 1px solid #ddd;
    background: #ebedf240;
}

.ui-menu .ui-menu-item {
    margin: 0;
    cursor: pointer;
}

/* css UI search complete thuoc tinh mo rong */
/* end page add product */
/* end page add product */
/*css popover*/
.popover {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1060;
    display: block;
    /* max-width: 175px; */
    font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";
    font-style: normal;
    font-weight: 400;
    line-height: 1.5;
    text-align: left;
    text-align: start;
    text-decoration: none;
    text-shadow: none;
    text-transform: none;
    letter-spacing: normal;
    word-break: normal;
    white-space: normal;
    word-spacing: normal;
    line-break: auto;
    font-size: 1.4rem;
    word-wrap: break-word;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid rgba(0,0,0,.2);
    border-radius: 0.3rem;
}

.bs-popover-auto[x-placement^=bottom], .bs-popover-bottom {
    margin-top: 0.5rem;
}

.popover .arrow {
    position: absolute;
    display: block;
    width: 1rem;
    height: 0.5rem;
    margin: 0 0.3rem;
}

.bs-popover-auto[x-placement^=bottom]>.arrow, .bs-popover-bottom>.arrow {
    top: calc(-0.5rem - 1px);
}

.popover .arrow::after, .popover .arrow::before {
    position: absolute;
    display: block;
    content: "";
    border-color: transparent;
    border-style: solid;
}

.bs-popover-auto[x-placement^=bottom]>.arrow::before, .bs-popover-bottom>.arrow::before {
    top: 0;
    border-width: 0 0.5rem 0.5rem 0.5rem;
    border-bottom-color: rgba(0,0,0,.25);
}

.popover-header {
    padding: 1rem 1.2rem;
    margin-bottom: 0;
    font-size: 1.6rem;
    background-color: #f7f7f7;
    border-bottom: 1px solid #ebebeb;
    border-top-left-radius: calc(0.3rem - 1px);
    border-top-right-radius: calc(0.3rem - 1px);
}

.bs-popover-auto[x-placement^=bottom] .popover-header::before, .bs-popover-bottom .popover-header::before {
    position: absolute;
    top: 0;
    left: 50%;
    display: block;
    width: 1rem;
    margin-left: -0.5rem;
    content: "";
    border-bottom: 1px solid #f7f7f7;
}

.popover-body {
    padding: 1rem 1.2rem;
    color: #212529;
}

.btn-blue {
    background-color: var(--blue);
    color: var(--white);
}

.member .modal-dialog {
    max-width: 600px;
}

/* end css popover */
/* trang chu */
.img-icon-header {
    width: 24px;
    height: 24px;
    object-fit: contain;
}

.img-trang-den-header {
    filter: brightness(0) invert(1);
}

.icon-header-white {
    color: white;
}

.icon-click-header {
    margin-left: 10px;
    padding: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    line-height: 1;
    min-width: 40px;
}

.icon-click-header .btn-action-header {
    width: 4.4rem;
    height: 4.4rem;
    background: #fff;
    border-radius: 0.6rem;
    align-items: center;
    justify-content: center;
    padding: 0;
}

.icon-click-header .btn-action-header > svg {
    width: 3.2rem;
    height: 3.2rem;
}

.icon-click-header .btn-action-header.btn-mini-wishlist > svg {
    margin-right: -3px;
    margin-bottom: -3px;
    width: 2.6rem;
}

.icon-click-header span.label {
    font-size: 10px;
    color: #fff;
    margin-top: 5px;
}

.search-section__categories {
    border: none;
    border-right: 1px solid var(--light);
    margin-right: 0.5rem;
    padding-right: 0.5rem;
    outline: none;
}

.cus-color-borderform-control {
    border: none;
    outline: none;
}

.btn-submit-search-header {
    background-color: var(--color-main);
    padding: 0.5rem 1rem;
    height: 3.6rem;
    color: white;
    border-radius: 0.6rem;
    border: none;
    font-size: 1.4rem;
    display: flex;
    align-items: center;
    gap: 0.8rem;
}

.btn-submit-search-header > svg {
    width: 2.4rem;
    height: 2.4rem;
}

.header-menu .search-section {
    border: 1px solid #D7DAE0;
    border-radius: 0.6rem;
    padding: 0.6rem 0.8rem;
    margin-left: 3rem;
    background-color: white;
    height: 4.4rem;
    display: flex;
    align-items: center;
}

.header-menu .search-section .form-search {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.search-section .form-search .dropdown-menu.show {
    /* background-color: #fafafa; */
    /* border: 1px solid #dad4d4; */
    background: linear-gradient(to right, rgb(221, 229, 228) 0%, rgb(205, 227, 244) 100%);
    border-radius: 5px;
    box-shadow: 0 0.2rem 0.3rem rgb(0 0 0 / 21%);
    padding: 4px;
}

.search-section .form-search .bootstrap-select .dropdown-menu li {
    position: relative;
    background-color: white;
}

.header-menu .search-section .form-search .input-group .form-control {
    border: 0;
    height: 3.4rem;
    padding-left: 0.6rem;
    min-width: 23rem;
}

.icon-click-right-header span {
    background-color: var(--color-highlight);
    color: white;
    padding: 3px 4px;
    border-radius: 50%;
    font-size: 11px;
    font-weight: 600;
    position: relative;
    top: -15px;
    left: -10px;
    width: 20px;
}

.tai-khoan-header .dropdown > a {
    font-size: 16px;
    color: white;
}

.img-avatar-member-mini {
    width: 3rem;
    height: 3rem;
    border-radius: 50%;
    object-fit: cover;
    margin-right: 0.4rem;
    border: 1px solid white;
}

.img-user-header {
    width: 23px;
    filter: brightness(0) invert(1);
}

.header-menu {
    padding: 1rem 0;
    background-color: var(--color-main);
}

.header-menu>.container>.row {
    align-items: center;
    justify-content: space-between;
}

.header-menu>.container>.row>div[class*="col-"] {
    display: flex;
    align-items: center;
}

.header-menu>.container>.row>div[class*="col-"]:last-child {
    gap: 1.5rem;
    justify-content: flex-end;
}

.header-menu .header-action .icon-header {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    color: #fff;
}

.header-menu .header-action .icon-header svg {
    width: 2.8rem;
    height: 2.8rem;
}

.header-menu .header-action .icon-header .label-number {
    background: #F67B00;
    color: #fff;
    width: 2rem;
    height: 2rem;
    line-height: 2.1rem;
    position: absolute;
    text-align: center;
    border-radius: 100%;
    font-size: 1rem;
    top: 0px;
    right: -0.7rem;
}

.flex-auto {
    flex: auto;
}

.gap-8 {
    gap: 0.8rem;
}

.language-picker {
    position: relative;
    color: #F7F8F8;
    font-size: 1.4rem;
}

.topbar-section svg {
    width: 2.4rem;
    height: 2.4rem;
}

.img-languages-header {
    width: 20px;
    height: 20px;
    object-fit: cover;
    border-radius: 50%;
    margin-right: 3px;
}

.currency-active .currency-picker .currency-choose {
    position: relative;
}

.language-picker:before, .currency-choose::before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background: #F7F8F8;
    width: 100%;
    height: 1px;
}

.currency-active .currency-picker {
    display: flex;
    align-items: center;
    color: #F7F8F8;
    font-size: 1.4rem;
}

.box-shadow-vertical {
    background: rgb(255, 255, 255);
    box-shadow: rgba(109, 103, 89, 0.06) 0px 2px 30px 9px;
    border-radius: 10px 10px 0 0;
}

.section-vertical-slider > .container > .row > div:nth-child(1) {
    flex: 0 0 20%;
    max-width: 20%;
}

.section-vertical-slider > .container > .row > div:nth-child(2) {
    flex: 0 0 80%;
    max-width: 80%;
}

.box-img-left-slidemain-01 img {
    width: 100%;
    object-fit: cover;
    height: 28rem;
    border-radius: 10px;
}

.box-slider-main-link > .row > div:nth-child(1) {
    /* flex: 0 0 70%; */
    /* max-width: 70%; */
}

.box-slider-main-link > .row > div:nth-child(2) {
    /* flex: 0 0 30%; */
    /* max-width: 30%; */
}

.bg-slider-main-right01, .bg-slider-main-right02 {
    background-repeat: no-repeat !important;
    background-size: cover;
    width: 100%;
    height: 28rem;
    padding: 20px;
    border-radius: 10px;
}

.bg-slider-main-right01 {
    margin-bottom: 30px;
    background: #F78D1E;
    background: -moz-linear-gradient(-45deg, #F78D1E 0%, #0F3556 100%);
    background: -webkit-linear-gradient(-45deg, #F78D1E 0%, #0F3556 100%);
    background: linear-gradient(135deg, #F78D1E 0%, #0F3556 100%);
    position: relative;
}

.bg-slider-main-right02 {
    background: #F78D1E;
    background: -moz-linear-gradient(45deg, #F78D1E 0%, #0F3556 100%);
    background: -webkit-linear-gradient(45deg, #F78D1E 0%, #0F3556 100%);
    background: linear-gradient(45deg, #F78D1E 0%, #0F3556 100%);
    position: relative;
}

.banner-2link {
    position: absolute;
    bottom: 10px;
    right: 10px;
}

.banner-2link img {
    width: 140px;
    object-fit: cover;
}

.bth-link-slider-main01 a {
    padding: 14px 14px;
    border-radius: 8px;
    border: 1px solid white;
    color: white;
    font-size: 14px;
}

.bth-link-slider-main02 a {
    padding: 14px 14px;
    border-radius: 8px;
    border: 1px solid white;
    color: white;
    font-size: 14px;
}

.title-link-slider-main {
    font-size: 23px;
    font-weight: 600;
}

.bth-link-slider-main01 , .bth-link-slider-main02 {
    margin-top: 35px;
}

.bth-link-slider-main01:hover a {
    background-color: var(--color-main);
}

.bth-link-slider-main02:hover a {
    background-color: var(--color-main);
}

.content-gia-tri-slider-main {
    background-color: rgb(255, 255, 255);
    box-shadow: rgba(109, 103, 89, 0.06) 0px 2px 30px 9px;
    border-radius: 8px;
    padding: 20px 10px 10px 20px;
    position: relative;
    min-height: 28rem;
}

.link-boc-gia-tri {
    color: black;
    background-color: white;
}

.link-boc-gia-tri:hover .content-gia-tri-slider-main {
    background: linear-gradient(to right, rgb(235, 152, 79) 0%, rgb(255, 185, 122) 100%);
}

.link-boc-gia-tri:hover {
    color: white;
}

.link-boc-gia-tri:hover .url {
    color: white;
}

.link-boc-gia-tri .title {
    font-size: 18px;
}

.link-boc-gia-tri .description {
    font-weight: 600;
    font-size: 22px;
    margin-top: 20px;
}

.link-boc-gia-tri .url-xem-them-slider {
    margin-top: 30px;
}

.link-boc-gia-tri .url {
    font-size: 16px;
    color: var(--color-highlight);
}

.html-main-right > div:nth-child(1) {
    margin-bottom: 30px;
}

.img-gia-tri-slider-main {
    position: absolute;
    bottom: 0;
    right: 10px;
    z-index: 1;
}

.img-gia-tri-slider-main img {
    max-width: 120px;
}

.space-block-10 > .row {
    margin-right: -7.5px;
    margin-left: -7.5px;
}

.space-block-10 > .row > div {
    padding-right: 7.5px;
    padding-left: 7.5px;
}

.box-sp-uu-dai-home {
    background-color: var(--light);
    padding: 20px 15px 20px 15px;
    border-radius: 10px;
}

.bth-link-xem-them {
    position: absolute;
    z-index: 99;
    right: 30px;
    top: 15px;
}

.bth-link-xem-them a:hover {
    color: var(--color-highlight);
    text-decoration: underline;
}

.bth-link-xem-them a {
    color: black;
}

.box-sp-uu-dai-home .price-amount.old-price {
    color: var(--color-text);
    margin-left: 0;
    position: relative;
    font-size: 12px;
    width: max-content;
}

.img-sale-down-home img {
    width: 25px;
}

.box-sp-uu-dai-home .price {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}

.box-sp-uu-dai-home .price-amount {
    color: var(--red);
    font-size: 18px;
}

.sale-badge {
    background: linear-gradient(50deg, #F78D1E, #ff7875);
    color: white;
    font-weight: bold;
    padding: 2px 10px;
    border-radius: 50px;
    font-size: 10px;
    animation: pulseSale 1.5s infinite;
    box-shadow: 0 0 10px rgba(255, 77, 79, 0.6);
    text-transform: uppercase;
    max-width: 50px;
    margin-left: 5px;
}

@keyframes pulseSale {
    0% {
        transform: scale(1);
        box-shadow: 0 0 8px rgba(255, 77, 79, 0.6);
    }

    50% {
        transform: scale(1.1);
        box-shadow: 0 0 15px rgba(255, 77, 79, 0.9);
    }

    100% {
        transform: scale(1);
        box-shadow: 0 0 8px rgba(255, 77, 79, 0.6);
    }
}

.price-home-sale {
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    align-items: flex-end;
}

.box-sp-uu-dai-home .swiper-button-next i, .box-sp-uu-dai-home .swiper-button-prev i, .cus-next-prev .swiper-button-next i, .cus-next-prev .swiper-button-prev i {
    display: flex;
    align-items: center;
    justify-content: center;
    color: black;
    font-size: 30px;
    box-shadow: 0 2px 6px 2px rgba(0, 0, 0, .12);
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background-color: white;
}

.btn-them-gio-hang a {
    font-size: 14px;
    color: black;
}

.btn-them-gio-hang {
    border: 1px solid black;
    padding: 6px 5px 6px 5px;
    border-radius: 5px;
    text-align: center;
}

.btn-mua-ngay {
    border: 1px solid black;
    padding: 6px 5px 6px 5px;
    border-radius: 5px;
    text-align: center;
    background-color: var(--color-main);
}

.btn-mua-ngay a {
    font-size: 14px;
    color: white;
}

.btn-them-gio-hang:hover {
    border: 1px solid var(--color-highlight);
    background-color: var(--color-highlight);
}

.btn-mua-ngay:hover {
    background: transparent;
    border: 1px solid var(--color-main);
    color: var(--color-main);
}

.btn-them-gio-hang:hover a {
    color: white;
}

.btn-mua-ngay:hover a {
    color: var(--color-main);
}

.cus-flex-cart-mua-home {
    display: flex;
    justify-content: space-between;
    margin-top: 25px;
}

.cus-flex-cart-mua-home > div {
    flex: 0 0 48%;
    max-width: 48%;
}

.tg-giao-hang {
    color: black;
    font-size: 14px;
    margin-top: 5px;
}

.cus-price-wishlist {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.cus-price-wishlist > span:first-child {
    font-size: 18px;
    font-weight: 700;
    color: var(--color-main);
}

.cus-price-wishlist > span:last-child > a {
    border: 1px solid #ccc;
    font-size: 13px;
    padding: 3px 4px;
    border-radius: 50%;
    background-color: #DFDFDF;
    color: var(--color-main);
}

.product-item .btn-product-action.added-wishlist, .wishlist-product-detail .added-wishlist i {
    background-color: var(--color-highlight) !important;
    color: white !important;
    border-color: var(--color-highlight) !important;
}

.nha-cung-cap-sp {
    font-size: 12px;
    background: var(--color-main);
    color: white;
    padding: 0 0 0 4px;
    border-radius: 5px;
    margin: 6px 0 4px 0;
}

.name-cate-sp {
    font-size: 12px;
    background: #EBEBEB;
    padding: 0 0 0 4px;
    border-radius: 5px;
    color: var(--color-main);
}

.name-cate-sp a {
    color: var(--color-main);
}

.sp-home .product-item {
    background-color: #f8f9fa;
    box-shadow: none;
}

footer {
    background-color: var(--color-main);
    padding-top: 5rem;
    color: white;
}

.title-footer {
    font-size: 1.8rem;
    font-weight: 600;
}

.footer-menu-section ul li a {
    color: var(--white);
    font-size: 1.6rem;
    font-weight: 300;
}

.footer-menu-section ul li {
    margin-bottom: 1rem;
}

.box-footer-01 > .container > .row > div {
    flex: 0 0 20%;
    max-width: 20%;
}

.flex-cong-dong-footer {
    display: flex;
    flex-wrap: wrap;
}

.cus-border-info-mxh > .row > div:nth-child(1) {
    flex: 0 0 80%;
    max-width: 80%;
}

.cus-border-info-mxh > .row> div:nth-child(2) {
    flex: 0 0 20%;
    max-width: 20%;
}

.img-cong-dong-footer img {
    width: 2.4rem;
    object-fit: cover;
}

.img-cong-dong-footer {
    margin-right: 2rem;
    margin-bottom: 2rem;
}

.cus-border-info-mxh {
    border-top: 1px solid #234C7D;
    border-bottom: 1px solid #234C7D;
    padding: 3rem 0 1rem;
}

.flex-thanh-toan-footer {
    display: flex;
    align-items: center;
}

.img-thanh-toan-footer img {
    width: 50px;
    height: 31px;
    object-fit: cover;
    border-radius: 3px;
}

.img-thanh-toan-footer {
    margin-left: 10px;
}

.box-footer-03 {
    padding: 2.5rem 0;
}

.footer-menu-section ul li a:hover {
    text-decoration: underline;
}

/* end trang chu */
/* trang san pham */
.border-box-cate-page {
    background: white;
    box-shadow: rgba(109, 103, 89, 0.06) 0px 2px 30px 9px;
    border-radius: 10px;
    padding: 20px 15px 20px 15px;
}

.categories-section > .has-child .list-child {
    border-left: 1px solid #F0D39D;
    margin-left: 20px;
    padding-left: 25px !important;
}

.categories-section > .has-child > .list-child > li > a {
    position: relative;
}

.categories-section > .has-child > .list-child > li > a:before, .categories-section > .has-child > .list-child > .has-child > .list-child > li > a:before {
    position: absolute;
    content: '';
    top: 17px;
    left: -25px;
    width: 15px;
    height: 1px;
    background-color: #F0D39D;
    z-index: 3;
}

.categories-section .dropdown-toggle::after {
    display: inline-block;
    content: "\f105";
    font-family: 'Font Awesome 6 Pro';
    font-weight: 300;
    border: none;
    font-size: 21px;
}

.categories-section .dropdown-toggle.open {
    -webkit-transform: rotate(-90deg);
    -moz-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    -o-transform: rotate(-90deg);
    transform: rotate(90deg);
    color: var(--color-highlight);
}

.categories-section > .has-child.active-parent {
    background: #FFF4E0;
    border-radius: 7px;
    padding: 5px 15px 5px 5px;
}

.has-child.active-parent > a {
    color: var(--color-highlight);
}

.product-item {
    padding: 1rem 1rem 1.5rem;
    border-radius: 1rem;
    background-color: white;
    box-shadow: rgba(109, 103, 89, 0.06) 0px 2px 30px 9px;
}

.product-item:hover {
    box-shadow: #f78d1e12 0px 2px 5px 6px;
}

.box-seo-loc-sp {
    background: white;
    box-shadow: rgba(109, 103, 89, 0.06) 0px 2px 30px 9px;
    padding: 20px 10px 25px 10px;
    border-radius: 10px;
    margin-bottom: 10px;
}

.orderby-section {
    background-color: var(--color-highlight);
    color: white;
    padding: 10px 15px 10px 15px;
    font-size: 14px;
    border-radius: 8px;
}

.orderby-section .orderby-title i {
    font-size: 18px;
}

.title-seo-page {
    font-size: 16px;
    text-transform: capitalize;
}

.title-section-page-cate {
    font-size: 18px;
    color: var(--color-highlight)
}

.sp-small-page {
    background: white;
    box-shadow: rgba(109, 103, 89, 0.06) 0px 2px 30px 9px;
    border-radius: 10px;
    padding: 15px 15px 15px 15px;
}

.sp-small-page .product-item {
    padding: 0;
    border-radius: 0;
    background-color: transparent;
    box-shadow: none;
}

/*zoom-anh sp*/
.product-item {
    overflow: hidden;
}

.product-item img {
    -webkit-transition: all .4s ease;
    -moz-transition: all .4s ease;
    -ms-transition: all .4s ease;
    -o-transition: all .4s ease;
    transition: all .4s ease;
    overflow: hidden;
}

.product-item:hover img {
    overflow: hidden;
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
}

.bg-ctsp {
    background-color: #f7f8f8;
}

.product-detail-head .product-image-detail, .product-detail-head .product-content-detail, .product-detail-head .product-attributes, .product-detail-head .product-content {
    background-color: white;
    padding: 2rem;
    border-radius: 0.8rem;
    overflow: hidden;
}

.border-radius-8 {
    border-radius: 0.8rem;
}

.border-radius-10 {
    border-radius: 1rem;
}

.dflex-highlight-img-detail {
    padding: 1.2rem 1.5rem 1.2rem 1rem;
    border-radius: 0.8rem;
    display: flex;
    align-items: center;
    align-content: center;
}

.dflex-highlight-img-detail > span {
    position: relative;
    z-index: 5;
}

.dflex-highlight-img-detail > span {
    border-right: 1px solid black;
    padding-right: 0.8rem;
    margin-right: 0.8rem;
}

.dflex-highlight-img-detail > span > a {
    color: black;
}

.dflex-highlight-img-detail > span:last-child {
    border-right: none;
    padding-right: 0;
    margin-right: 0;
}

.vector-highlight-img-detail {
    background-color: #BAD7FA;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
}

.dflex-highlight-img-detail > .border-bt {
    text-decoration: underline;
}

.description-product-detail, .color-light-text {
    color: #5C5C5C;
}

.bg-tieu-diem-sp-detail {
    background-color: #f7f8f8;
    padding: 2rem;
    border-radius: 0.8rem;
    margin-top: 3rem;
}

.wishlist-product-detail a i {
    border: 1px solid #ccc;
    font-size: 1.3rem;
    padding: 0.3rem 0.4rem;
    border-radius: 50%;
    background-color: #DFDFDF;
    color: var(--color-main);
}

.bg-price-info-html {
    background: #F4F9FF;
    padding: 1.5rem 1.5rem 1.5rem 1.1rem;
    border-radius: 0.8rem;
}

.price-mau-thu-detail-prd {
    display: flex ;
    align-items: center;
    justify-content: space-between;
}

.bg-price-info-html .price {
    font-size: 2.4rem;
    font-weight: bold;
    line-height: 3.2rem;
    letter-spacing: 2px;
}

.btn-nha-mau-thu a {
    background-color: var(--color-main);
    color: white;
    border-radius: 1.6rem;
    padding: 0.5rem 1rem 0.5rem 1rem;
    font-size: 1.4rem;
}

.flex-lay-mau {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: #B7D7FE;
    padding: 0.3rem 1rem 0.3rem 0.5rem;
    border-radius: 0.4rem;
    font-size: 1.4rem;
}

.btn-link-lay-mau {
    border: 1px solid #3D2B6D;
    padding: 0.3rem 1.5rem 0.3rem 1.5rem;
    border-radius: 0.4rem;
    color: #3D2B6D;
}

.bg-description-product-detail {
    background: #F4F9FF;
    padding: 1.5rem 1.5rem 1.5rem 1.1rem;
    border-radius: 0.8rem;
    font-size: 1.3rem;
}

.img-icon-thanh-toan img {
    width: 5rem;
    height: 3.3rem;
    object-fit: contain;
}

.title-thanh-toan {
    font-size: 1.4rem;
    color: black;
    margin-top: 1rem;
}

.box-hinh-thuc-thanh-toan {
    border-bottom: 1px solid black;
    padding-bottom: 2.5rem;
    margin: 2.5rem 0 2.5rem 0;
}

.btn-chat-ngay-detail {
    background-color: white !important;
    color: black !important;
}

.btn-chat-ngay-detail:hover {
    background-color: var(--color-highlight) !important;
    color: white !important;
}

.border-top-btn-box {
    padding-top: 1rem;
    border-top: 1px solid black;
    margin-top: 2.5rem;
}

.cus-gym-manhinh-ctsp {
    position: sticky;
    top: 100px;
}

.custom-info-row {
    display: flex;
    border-bottom: 1px solid #e0e0e0;
    background-color: #fff;
    height: 100%;
}

.custom-info-row:nth-child(even) {
    background-color: #f9f9f9;
}

.custom-info-row .label {
    width: 40%;
    padding: 1rem 1.2rem;
    background-color: #EBEBEB;
    font-weight: normal;
    white-space: nowrap;
    /* border-right: 1px solid #e0e0e0; */
    word-break: break-word;
    /* Ãƒâ€žÃ¢â‚¬ËœÃƒÂ¡Ã‚ÂºÃ‚Â£m bÃƒÂ¡Ã‚ÂºÃ‚Â£o xuÃƒÂ¡Ã‚Â»Ã¢â‚¬Ëœng dÃƒÆ’Ã‚Â²ng nÃƒÂ¡Ã‚ÂºÃ‚Â¿u nÃƒÂ¡Ã‚Â»Ã¢â€žÂ¢i dung quÃƒÆ’Ã‚Â¡ dÃƒÆ’Ã‚Â i */
    white-space: normal;
}

.custom-info-row .value {
    width: 60%;
    padding: 10px 12px;
    word-break: break-word;
    white-space: normal;
}

#productLongDescription {
    display: block;
    overflow: hidden;
    position: relative;
    transition: max-height .5s ease;
}

#productLongDescription {
    max-height: 250px;
}

.copy__inner {
    overflow: hidden;
}

.copy__gradient {
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 75%, #f1e7e7 100%);
    bottom: 0;
    height: 150px;
    left: 0;
    position: absolute;
    transition: bottom 1s ease;
    width: 100%;
    z-index: 10;
}

#productLongDescription.reveal .copy__gradient {
    background: transparent;
}

.more-less {
    background: #C3C3C3;
    padding: 8px 12px 8px 12px;
    border-radius: 8px;
    cursor: pointer;
}

.more-less i {
    font-size: 18px;
}

.btn-reveal {
    margin-top: 35px;
    margin-bottom: 60px !important;
}

.title-danh-gia {
    font-size: 1.8rem;
    font-weight: 700;
    margin-bottom: 2rem;
    color: #103460;
}

.bg-danh-gia {
    background-color: white;
    padding: 2rem;
    border-radius: 0.8rem;
    overflow: hidden;
}

.title2-danh-gia-sp {
    font-weight: 500;
    border-bottom: 1px solid;
    padding-bottom: 1rem;
    position: relative;
    margin-bottom: 2rem;
}

.title2-danh-gia-sp:before {
    position: absolute;
    /* content: ''; */
    /* bottom: 0; */
    /* left: 0; */
    /* width: 16rem; */
    /* height: 0.6rem; */
    /* z-index: 2; */
    /* background-color: black; */
}

.company-card {
    background: #f8fbfd;
    border-radius: 1.8rem;
    box-shadow: 0 2px 12px rgba(0,0,0,0.07);
    padding: 2.8rem 2rem 2rem 2rem;
    margin: 2rem auto;
    color: #222;
}

.company-header {
    display: flex;
    gap: 1.8rem;
    align-items: flex-start;
    margin-bottom: 1.5rem;
}

.company-logo {
    width: 5.6rem;
    height: 5.6rem;
    border-radius: 1.2rem;
    background: #fff;
    object-fit: contain;
    border: 0.1rem solid #eee;
}

.company-name {
    margin: 0 0 0.4rem 0;
    font-size: 1.6rem;
    font-weight: 600;
    text-decoration: underline;
}

.company-verified {
    margin-bottom: 2px;
    font-size: 14px;
}

.company-location {
    color: #888;
    font-size: 14px;
    margin-bottom: 2px;
}

.company-link {
    color: black;
    text-decoration: underline;
    font-size: 15px;
}

.company-performance1 {
    border-bottom: 1px solid #ccc;
    padding-bottom: 20px;
    margin-bottom: 20px;
}

.bg-white-nha-cc {
    background: #fff;
    border-radius: 10px;
    padding: 14px 18px;
    margin-top: 20px;
    margin-bottom: 20px;
}

.company-performance2 {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.performance-title {
    color: #888;
    margin-bottom: 6px;
}

.performance-value {
    font-weight: 600;
    font-size: 18px;
}

.markets-section {
    margin: 0 auto 20px auto;
    border-bottom: 1px solid #ccc;
    padding-bottom: 20px;
}

.markets-title {
    font-weight: 600;
    margin-bottom: 15px;
}

.markets-bar {
    display: flex;
    height: 24px;
    border-radius: 6px;
    overflow: hidden;
    background: #ededed;
    margin-bottom: 10px;
    box-shadow: 0 1px 2px rgba(0,0,0,0.03);
}

.market {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    font-size: 0.98em;
    font-weight: 600;
    color: #333;
    padding-right: 8px;
    height: 100%;
}

.market.us {
    background: #ff9800;
    color: #fff;
}

.market.dr {
    background: #ffb300;
    color: #333;
}

.market.co {
    background: #ffd600;
    color: #333;
}

.market.es {
    background: #ffe082;
    color: #333;
}

.market.vn {
    background: #fff9c4;
    color: #333;
}

.market.other {
    background: #e0e0e0;
    color: #333;
}

.markets-legend {
    display: flex;
    gap: 18px;
    margin-top: 4px;
    flex-wrap: wrap;
}

.legend-box {
    display: inline-block;
    width: 16px;
    height: 16px;
    border-radius: 3px;
    margin-right: 5px;
    vertical-align: middle;
}

.legend-box.us {
    background: #ff9800;
}

.legend-box.dr {
    background: #ffb300;
}

.legend-box.co {
    background: #ffd600;
}

.legend-box.es {
    background: #ffe082;
    border: 1px solid #e0e0e0;
}

.legend-box.vn {
    background: #fff9c4;
    border: 1px solid #e0e0e0;
}

.legend-box.other {
    background: #e0e0e0;
}

.company-overview {
}

.company-services, .company-quality {
    border-bottom: 1px solid #ccc;
    padding-bottom: 20px;
    margin-bottom: 20px;
}

.company-services ul, .company-quality ul {
    margin: 10px 0 0 15px;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
}

.company-services ul li, .company-quality ul li {
    margin-right: 40px;
}

.company-actions {
    display: flex;
    gap: 16px;
    margin-top: 18px;
}

.company-actions button {
    flex: 1;
    padding: 5px 0;
    border-radius: 30px;
    border: none;
    background-color: white;
    font-weight: 600;
    border: 2px solid;
    cursor: pointer;
    transition: background 0.2s;
}

.company-actions button:hover {
    background: #cbe3f7;
}

.company-overview {
    border-bottom: 1px solid #ccc;
    padding-bottom: 20px;
    margin-bottom: 20px;
}

.box-sp-mua-cung .swiper {
    padding: 15px 0 15px 0;
}

/* end trang chi tiet san pham */
/*trang tin tuc */
.flex-view-author-article {
    display: flex;
    align-items: center;
    color: var(--gray-bold);
    font-size: 14px;
}

.section-2item-01 .article-item .inner-image > div {
    padding-top: 65%;
}

.section-2item-01 .article-item {
    margin-bottom: 2rem;
}

.title-article-detail {
    font-size: 2rem;
    text-align: center;
}

/* end trang tin tuc */
.avatar-circle {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background-color: var(--color-highlight);
    color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-right: 6px;
    border: 1px solid #fff;
}

#member-info.member-header {
    display: flex;
    align-items: center;
    color: #fff;
}

#member-info.member-header .username {
    max-width: 12ch;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

#member-info.member-header::after {
    display: none;
}

.form-lien-he-page .form-group {
    margin-bottom: 20px;
}

.form-lien-he-page .form-control {
    height: calc(22px + 22px + 2px);
    border-radius: 8px;
}

.card-collapse {
    margin-bottom: 20px;
}

.cus-collapsed-flex {
    display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
    margin-bottom: 15px;
    padding-top: 15px;
}

.color-key-collapse {
    font-size: 24px;
    color: var(--color-highlight);
    padding-right: 10px;
}

.swiper-tile-collapse {
    color: var(--color-highlight);
    font-size: 20px;
}

.card-collapse .collapsed .swiper-tile-collapse {
    color: #7E8995;
}

.card-collapse .collapsed i:before {
    content: "\2b";
    font-family: 'Font Awesome 6 Pro';
    font-weight: 900;
}

.bg-ho-tro-online {
    box-shadow: 0px 4px 15px 0px #0000004f;
    padding: 34px 24px;
    border-radius: 10px;
    height: 100%;
}

.bg-ho-tro-online .title {
    font-size: 23px;
    color: var(--color-highlight);
    font-weight: 600;
}

.bg-ho-tro-online .description {
    font-size: 18px;
    margin: 15px 0 15px 0;
}

@media (min-width: 1200px) and (max-width: 1500px) {
    .cus-color-borderform-control {
        max-width: 160px;
    }

    .menu-vertical .menu-vertical--content {
        max-height: 53rem;
        overflow-y: scroll;
    }

    .menu-vertical .menu-vertical--content::-webkit-scrollbar {
        width: 8px;
    }

    .cus-flex-cart-mua-home {
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
    }

    .cus-flex-cart-mua-home .btn-them-gio-hang {
        margin-bottom: 20px;
    }
}

@media (min-width: 768px) and (max-width: 1025px) {
    .logo-section img {
        height: 36px;
    }

    .header-ipad-02 > .container > .row > div > div:first-child {
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .header-ipad-02 > .container > .row > div > .box-shadow-vertical {
        border-radius: 10px;
        padding: 10px 20px;
    }

    .header-ipad-02 {
        margin-bottom: 20px;
    }

    .header-ipad-01 {
        position: relative;
        z-index: 4;
    }

    .icon-click-header {
        margin-left: 10px;
    }

    .search-section {
        margin-left: 0;
    }

    .header-ipad-02 > .container > .row > div {
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

    .category-tool-mb a {
        color: black;
    }

    .menu-section, .menu-vertical--nav {
        width: 35rem;
        transition: all 0.8s ease-in-out;
        -webkit-transform: translate3d(-35rem, 0, 0);
        -moz-transform: translate3d(-29rem, 0, 0);
        -ms-transform: translate3d(-29rem, 0, 0);
        -o-transform: translate3d(-29rem, 0, 0);
        transform: translate3d(-35rem, 0, 0);
        -webkit-transition: transform 0.3s cubic-bezier(0.65, 0.05, 0.51, 0.82)
    }

    .box-slider-main-link > .row > div:nth-child(1) {
        flex: 0 0 100%;
        max-width: 100%;
    }

    .box-slider-main-link > .row > div:nth-child(2) {
        /* flex: 0 0 100%; */
        /* max-width: 100%; */
        /* display: flex; */
        /* margin-top: 15px; */
    }

    .bg-slider-main-right01 {
        margin-right: 10px;
    }

    .content-gia-tri-slider-main {
        margin-bottom: 20px;
    }

    .img-gia-tri-slider-main {
        bottom: 20px;
    }

    .bg-slider-main-right01, .bg-slider-main-right02 {
        width: 100%;
        height: 25rem;
    }

    .box-img-left-slidemain-01 img {
        height: 25rem;
    }

    .header-tablet-01 > .container > .row > div > div {
        margin-bottom: 25px;
    }

    .cus-border-info-mxh > .row > div:nth-child(1) {
        flex: 0 0 50%;
        max-width: 50%;
    }

    .cus-border-info-mxh > .row > div:nth-child(2) {
        flex: 0 0 50%;
        max-width: 50%;
    }

    .product-image-detail .gallery-thumbs {
        height: 23rem;
    }

    .product-image-detail-top {
        margin-bottom: 20px;
    }

    .cus-gym-manhinh-ctsp {
        top: 20px;
    }
}

@media (min-width: 1000px) and (max-width: 1050px) {
    .menu-section, .menu-vertical--nav {
        width: 35rem;
        transition: all 0.8s ease-in-out;
        -webkit-transform: translate3d(-35rem, 0, 0);
        -moz-transform: translate3d(-29rem, 0, 0);
        -ms-transform: translate3d(-29rem, 0, 0);
        -o-transform: translate3d(-29rem, 0, 0);
        transform: translate3d(-35rem, 0, 0);
        -webkit-transition: transform 0.3s cubic-bezier(0.65, 0.05, 0.51, 0.82)
    }

    .product-image-detail .gallery-main .swiper-slide img {
        height: 44rem;
    }

    .product-image-detail .gallery-thumbs {
        height: 37rem;
    }
}

@media (max-width: 767px) {
    .box-img-left-slidemain-01 img {
        height: 21rem;
    }

    .bg-slider-main-right01, .bg-slider-main-right02 {
        height: 25rem;
    }

    .tai-khoan-header {
        position: relative;
        margin-left: 8px;
    }

    .img-icon-header {
        width: 22px;
        height: 22px;
        object-fit: cover;
    }

    .img-user-header {
        width: 20px;
    }

    .header-01-mb > .container > .row > div > div {
        position: relative;
        top: 50%;
        transform: translateY(-50%);
        z-index: 99;
    }

    .search-section__categories {
        max-width: 100px;
    }

    .btn-submit-search-header {
        padding: 3px 6px 3px 6px;
        font-size: 12px;
    }

    .btn-submit-search-header i {
        display: none;
    }

    .search-section {
        padding: 5px 5px 5px 5px !important;
        margin-left: 0;
    }

    .search-section > form > .input-group {
        display: flex;
        flex-wrap: nowrap;
        align-items: center;
        align-content: center;
        justify-content: space-between;
    }

    .cus-color-borderform-control {
        max-width: 150px;
    }

    .icon-click-header {
        margin-left: 0;
        margin-right: 10px;
        width: 36px;
        height: 36px;
    }

    .category-tool-mb a {
        color: black;
        font-weight: 600;
    }

    header {
        position: relative;
        z-index: 5;
        background-color: var(--color-main);
    }

    .category-tool-mb {
        padding: 10px 10px 10px 15px;
    }

    .box-shadow-vertical {
        border-radius: 10px;
    }

    .box-slider-main-link > .row > div:nth-child(1) {
        flex: 0 0 100%;
        max-width: 100%;
    }

    .box-slider-main-link > .row > div:nth-child(2) {
        flex: 0 0 100%;
        max-width: 100%;
    }

    .bg-slider-main-right01 {
        margin-top: 30px;
    }

    .content-gia-tri-slider-main {
    }

    .banner-2link img {
        width: 110px;
    }

    .img-gia-tri-slider-main {
        bottom: 15px;
    }

    .content-gia-tri-slider-main {
        min-height: 25rem;
    }

    .dflex-highlight-img-detail {
        display: flex;
        flex-wrap: wrap;
    }

    .product-image-detail .gallery-thumbs {
        height: auto;
    }

    .product-image-detail .gallery-main .swiper-slide img {
        position: absolute;
        top: 0;
        right: 0;
        left: 0;
        bottom: 0;
        width: 100%;
        height: 100%;
    }

    .product-image-detail .gallery-main .swiper-slide {
        padding-top: 100%;
    }

    .product-detail-footer .nav li a:hover, .product-detail-footer .nav li a.active {
        border-bottom: 2px solid;
        padding-bottom: 3px;
    }

    .product-detail-footer .nav > li {
        margin-right: 20px;
        margin-bottom: 10px;
    }

    .bg-price-info-html img {
        width: 24px;
        height: 24px;
        object-fit: cover;
    }

    .product-content-detail .entire-attribute .list-attribute .product-attribute-switch {
        margin-bottom: 0;
        display: flex;
        flex-wrap: wrap;
    }

    .cus-border-info-mxh > .row > div:nth-child(1) {
        flex: 0 0 100%;
        max-width: 100%;
    }

    .cus-border-info-mxh > .row > div:nth-child(2) {
        flex: 0 0 100%;
        max-width: 100%;
        padding-top: 20px;
    }

    .flex-thanh-toan-footer {
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        justify-content: center;
    }

    .img-cong-dong-footer {
        margin-right: 10px;
        margin-bottom: 10px;
    }

    .img-thanh-toan-footer {
        margin-left: 10px;
        margin-bottom: 10px;
    }

    .menu-vertical > .menu-vertical--content {
        display: block !important;
    }

    .menu-vertical > .menu-vertical--content > li ul {
        display: none !important;
    }

    /* Fix dropdown menu overlap issue */
    .dropdown-menu {
        /* z-index: 9999 !important; */
        /* position: absolute !important; */
        /* top: 100% !important; */
    }

    .dropdown-menu.show {
        display: block !important;
    }

    .dropdown-item {
        display: block !important;
        padding: 0.25rem 1.5rem !important;
    }

    .product-content-detail .add-to-cart {
        padding: 10px 1rem;
        font-size: 16px;
    }
}

/* css layout member */
.box-member {
    background: #fff;
    padding: 3rem 2rem 2rem;
    border-radius: 8px;
    height: 100%;
}

.box-member.box-menu {
    display: flex;
    flex-direction: column;
}

.profile-top {
    display: flex;
    align-items: center;
    margin-bottom: 15px;
    padding-bottom: 15px;
    border-bottom: 1px solid #f5f5f5;
}

.profile-top .img-profile {
    flex: 0 0 6rem;
    max-width: 6rem;
    height: 6rem;
}

.profile-top .info {
    flex: 0 0 calc(100% - 6rem);
    max-width: calc(100% - 6rem);
    padding-left: 15px;
}

.profile-top .info .name {
    font-size: 17px;
    font-weight: 600;
}

.profile-top .info .verify {
    font-size: 13px;
    color: #4b4b4b;
    display: flex;
    align-items: center;
    line-height: 1.4;
}

.profile-top .info .verify > i {
    margin-right: 5px;
    line-height: 1;
}

.menu-member .item-menu > a {
    display: flex;
    align-items: center;
    padding: 1rem;
    color: #103460;
    font-size: 1.4rem;
    gap: 1rem;
    border-radius: 0.8rem;
    background: #f7f8f8;
    margin-bottom: 0.5rem;
}

.menu-member .item-menu > a > svg > path {
    stroke: #103460;
}

.menu-member .item-menu.active > a, .menu-member .item-menu > a:hover {
    background: var(--color-main);
    color: #fff;
}

.menu-member .item-menu.active > a svg > path, .menu-member .item-menu > a:hover svg > path {
    stroke: #fff;
}

.menu-member .item-menu.item-register-seller > a {
    background: #f78d1e;
    color: #ffff;
}

.box-menu .bottom-menu {
    border-radius: 8px;
    display: flex;
    flex-direction: column;
    margin-top: auto;
}

.box-menu .bottom-menu .btn-register-seller {
    background: rgb(249, 115, 22);
    color: #fff;
}

.box-menu .bottom-menu .btn {
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1.6;
    border-radius: 8px;
}

.box-menu .bottom-menu .btn > i {
    line-height: 1;
    margin-right: 10px;
}

.box-menu .bottom-menu .btn-logout {
    background: #103460;
    color: #fff;
}

.box-menu .menu-member {
    margin-bottom: 3rem;
}

.layout-member .box-menu {
    display: flex;
    flex-direction: column;
}

.layout-member>.container, .layout-member>.container>.row>div[class*="col-"] {
    padding-left: 8px;
    padding-right: 8px;
}

.layout-member>.container>.row>div[class*="col-"]:first-child {
    flex: 0 0 22%;
    max-width: 22%;
}

.layout-member>.container>.row>div[class*="col-"]:last-child {
    flex: 0 0 78%;
    max-width: 78%;
}

.layout-member>.container>.row {
    margin-left: -0.8rem;
    margin-right: -0.8rem;
}

.box-member .top-title .title-register {
    font-weight: 400;
    color: #103460;
    font-size: 2.4rem;
}
.box-member .top-title.top-dashboard {
    display: flex;
    align-items: center;
}

.box-member .top-title .desc {
    color: #B5B9C5;
}

.box-member .top-title {
    margin-bottom: 2rem;
}

.box-member .top-title > div:first-child {
    flex: 1;
}

.date-range-selector {
    display: flex;
    gap: 1rem;
    align-items: center;
}

.date-range-selector .btn {
    font-size: 1.4rem;
    padding: 0.6rem 1.2rem;
    border-radius: 0.6rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.date-range-selector .btn svg {
    width: 1.6rem;
    height: 1.6rem;
}

.date-range-selector {
    display: flex;
    gap: 1rem;
    align-items: center;
    position: relative;
    background: #DFDFDF33;
    padding: 1rem 2rem;
    border-radius: 0.6rem;
}
.date-range-selector #reportrange {
    background: #fff;
    border: 0.1rem solid #6F788A;
    padding: 0.5rem 1rem;
    border-radius: 0.6rem;
    display: flex;
    align-items: center;
    gap: 1rem;
    cursor: pointer;
    color: #0F3556;
    font-size: 1.4rem;
}
.date-range-selector .btn-group {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.date-range-selector .btn-group .btn {
    white-space: nowrap;
}

.date-range-selector .btn-group .btn.active {
    background-color: #0f3556;
    border-color: #0f3556;
    color: #fff;
}

.date-range-selector .custom-date-range {
    width: 100%;
    max-width: 500px;
}

.date-range-selector .custom-date-range .input-group {
    width: 100%;
}

.date-range-selector .custom-date-range .form-control {
    font-size: 1.4rem;
}

#custom-date-range-form {
    background: #fff;
    border: 1px solid #dee2e6;
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
    border-radius: 0.25rem;
}

#custom-date-range-form .form-group {
    margin-bottom: 0.75rem;
}

#custom-date-range-form label {
    font-weight: 500;
    color: #495057;
    margin-bottom: 0.25rem;
}

#custom-date-range-form .form-control {
    font-size: 1.4rem;
    padding: 0.375rem 0.75rem;
}

#custom-date-range-form .btn {
    font-size: 1.4rem;
    padding: 0.375rem 0.75rem;
}

#custom-date-range-form .gap-2 {
    gap: 0.5rem;
}

@media (max-width: 768px) {
    .date-range-selector {
        align-items: stretch;
    }

    .date-range-selector .btn-group {
        width: 100%;
        flex-direction: column;
    }

    .date-range-selector .btn-group .btn {
        width: 100%;
    }

    .date-range-selector .custom-date-range {
        max-width: 100%;
    }
}

.register-form .box-form, .box-seller-registration .box-form {
    border: 1px solid #EAE9E9;
    border-radius: 0.8rem;
    padding: 2rem 2rem;
    margin-bottom: 2rem;
}

.register-form .box-form .header-title, .box-seller-registration .box-form .header-title {
    margin-bottom: 15px;
    color: #000;
    font-weight: 600;
    display: flex;
    align-items: center;
    font-size: 1.8rem;
    line-height: 2.6rem;
    gap: 1rem;
}

.register-form .box-form .header-title > i, .box-seller-registration .box-form .header-title > i {
    margin-right: 8px;
    line-height: 1;
    color: var(--color-highlight);
}

.form-group label {
    font-weight: 400;
    font-size: 1.6rem;
    margin-bottom: 1.5rem;
}

.form-group .form-control {
    border-radius: 0.6rem;
    background: #fff;
    height: 4.4rem;
}

.form-group .form-control::placeholder {
    color: #6F788A;
}

.form-group .bootstrap-select>.dropdown-toggle {
    border-radius: 6px;
    background: #fff;
}

.register-form .box-form .row {
    margin-left: -10px;
    margin-right: -10px;
}

.register-form .box-form .row > div[class*="col-"] {
    padding-left: 10px;
    padding-right: 10px;
}

.register-form .box-form .drop-zoon {
    border: 2px dashed #b5b5b58c;
    border-radius: 8px;
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: center;
    height: 12rem;
    cursor: pointer;
    position: relative;
}

.register-form .box-form .drop-zoon .drop-preview-image {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: contain;
    border-radius: 10px;
    display: none;
    z-index: 1;
    transition: opacity 300ms ease-in-out;
    padding: 5px;
}

.register-form .box-form .drop-zoon .drop-icon i {
    font-size: 35px;
    color: #103460;
}

.register-form .box-form .drop-zoon .drop-file-input {
    display: none;
}

.register-form .box-form .drop-zoon .drop-paragraph {
    color: #6f6f6f;
    font-size: 14px;
}

.register-form .box-form .drop-zoon:hover {
    border-color: #f78d1e;
}

.form-group .input-group > .form-control:not(:first-child), .form-group .input-group > .custom-select:not(:first-child) {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

.register-form .box-form .form-group textarea {
    height: 120px;
}

#add-certificate {
    background: #f97316;
    color: #fff;
    border-radius: 6px;
    padding: 6px 15px;
    margin-top: 15px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

#add-certificate > i {
    font-size: 11px;
    line-height: 1;
}

#list-certificate .wrap-item {
    background: #fff;
    padding: 10px;
    border-radius: 8px;
    border: 1px solid #dddd;
    margin-bottom: 10px;
    position: relative;
}

.box-member .image-file > input {
    display: none;
}

.box-member .image-file {
    display: block;
    width: 100%;
    height: 44px;
    padding: 2px 1.25rem;
    font-size: 1.4rem;
    font-weight: 400;
    line-height: 1.5;
    color: #495057;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

.box-member .image-file .choose-image {
    display: flex;
    align-items: center;
    height: 100%;
}

.box-member .image-file .choose-image .btn-choose-image {
    background: #e3e3e3;
    border: 1px solid #a8a8a8;
    margin-right: 5px;
    border-radius: 4px;
}

#list-certificate .wrap-item .remove-certificate {
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: 999;
    color: #f00;
    background: #fff;
}

.register-form .btn-submit, .register-form .btn-submit:hover {
    background: #f97316;
    border-radius: 6px;
    line-height: 1.5;
    color: #fff;
}

/* end css layout member */
.modal-member .modal-title {
    background: var(--color-main);
    color: #fff;
    padding: 10px;
    text-align: center;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    font-size: 18px;
}

.modal-member .modal-content {
    border: 0;
    border-radius: 10px;
}

.modal-member .form-element {
    padding: 20px;
}

.modal-member .form-element .action {
    text-align: right;
}

.modal-member .form-element .form-group label {
    font-size: 1.4rem;
    font-weight: 400;
}

.modal-member .form-element .form-group .form-control {
    border-radius: 0.8rem;
    height: 4.4rem;
}

.modal-member .form-element .form-group textarea.form-control {
    height: 10rem;
}

.modal-member .form-element .form-group {
    margin-bottom: 15px;
}

.modal-member .form-element .custom-file {
    height: 4.4rem;
}

.modal-member .form-element .custom-file-input {
    height: 4.4rem;
    cursor: pointer;
}

.modal-member .form-element .custom-file-label {
    height: 4.4rem;
    line-height: 4.2rem;
    border-radius: 0.8rem;
    border: 1px solid #dee2e6;
    color: #6c757d;
    font-size: 1.4rem;
    padding-left: 1.2rem;
    padding-right: 1.2rem;
}

.modal-member .form-element .custom-file-label::after {
    display: none;
    content: "Chá»n tá»‡p";
    height: 3.4rem;
    line-height: 3.4rem;
    background-color: #e3e3e3;
    color: #495057;
    font-weight: 500;
    padding: 0 1.5rem;
    border-radius: 0.6rem;
    top: 0.4rem;
    right: 0.4rem;
}

.modal-member .form-element .custom-file-label .btn-choose-file {
    height: 3.4rem;
    line-height: 3.4rem;
    background-color: #e3e3e3;
    color: #495057;
    font-weight: 500;
    padding: 0 1.5rem;
    border-radius: 0.6rem;
    top: 0.4rem;
    right: 0.4rem;
}

.modal-member .form-element .forgot-password {
    color: #000;
    font-size: 1.5rem;
    font-style: italic;
}

.modal-member .form-element .btn-submit {
    width: 100%;
    background: var(--color-main);
    border: 0;
    border-radius: 0.8rem;
    font-size: 1.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 1rem 0;
    height: 4.4rem;
}

.modal-member.modal-rfq .form-element .btn-submit {
    min-width: 18rem;
    background: var(--color-main);
    border: 0;
    border-radius: 0.8rem;
    font-size: 1.5rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin: 1rem 0;
    height: 4.4rem;
}

.modal-member .form-element .bottom-now {
    text-align: center;
    font-size: 1.5rem;
}

.modal-member .form-element .bottom-now>a {
    color: var(--color-main);
    font-weight: bold;
}

.modal-member .form-element .form-group .input-group .form-control {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    border-right: 0;
}

.modal-member .form-element .form-group .input-group .eye-show-hide {
    padding: 0.4rem 1rem;
    background: transparent;
    border-left: 0;
    border-top-right-radius: 0.8rem;
    border-bottom-right-radius: 0.8rem;
    height: 4.4rem;
    cursor: pointer;
}

.modal-member .form-element .form-group .input-group .eye-show-hide > svg {
    width: 2.2rem;
}

.modal-member .form-element .btn-submit:hover {
    background: var(--color-highlight);
    color: #fff;
}

.modal-member .form-element .bottom-now>a:hover {
    color: var(--color-highlight);
}

.modal-member .form-element .form-group .invalid-feedback {
    color: #dc3545;
    font-size: 1.3rem;
    font-style: italic;
}

.bootstrap-select>.dropdown-toggle:after {
    border: 0;
    margin-right: -2px;
    font-size: 1.3rem;
    display: inline-block;
    font-family: 'Font Awesome 6 Pro';
    font-style: normal;
    font-weight: 400;
    font-variant: normal;
    line-height: 1;
    text-decoration: inherit;
    text-rendering: optimizeLegibility;
    text-transform: none;
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    font-smoothing: antialiased;
    content: "\f107";
}

.bootstrap-select.show>.dropdown-toggle:after {
    content: "\f106";
}

.bootstrap-select.form-control>.dropdown-toggle:after {
    margin-right: 0.2rem;
    width: 2rem;
    height: 2rem;
    background: rgb(205 207 210);
    border-radius: 50%;
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 2rem;
    padding-top: 0.2rem;
}

.bootstrap-select>.dropdown-toggle {
    height: 4.4rem;
    border-radius: 0.8rem !important;
    background: #fff;
    border: 1px solid #dee2e6;
}

.bootstrap-select .dropdown-toggle .filter-option {
    display: flex;
    align-items: center;
    height: 2rem;
}

.modal-member .form-element .input-group-phone {
    display: flex;
    align-items: center;
    gap: 0.8rem;
}

.modal-member .form-element .form-group .input-group.input-group-phone .form-control.bootstrap-select {
    flex: 0 0 10rem;
    max-width: 10rem;
    border: 0;
}

.modal-member .form-element .input-group-phone .input-group-text {
    height: 4.4rem;
    border-radius: 0;
    border-top-left-radius: 0.8rem;
    border-bottom-left-radius: 0.8rem;
}

.modal-member .form-element .form-group .input-group.input-group-phone .form-control {
    flex: auto;
    border: 1px solid #dee2e6;
    border-radius: 0.8rem;
}

.bootstrap-select .dropdown-menu li a.dropdown-item {
    padding: 0.8rem 1.5rem 0.8rem 1.5rem;
    width: 100%;
}

.modal-member .form-element .form-check label, .box-member .form-check label {
    position: relative;
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
    cursor: pointer;
    padding-left: 3rem;
    font-weight: 400;
}

.modal-member .form-element .form-check label {
    margin-bottom: 0;
}

.modal-member .form-element .form-check label > input, .box-member .form-check label > input {
    position: absolute;
    z-index: -1;
    opacity: 0;
}

.modal-member .form-element .form-check label > span, .box-member .form-check label > span {
    border-radius: 0.3rem;
    background: none;
    position: absolute;
    top: 0.3rem;
    left: 0;
    height: 1.8rem;
    width: 1.8rem;
    background: #e4e8ee;
    border: 1px solid transparent;
}

.modal-member .form-element .form-check label > span:after, .box-member .form-check label > span:after {
    content: '';
    position: absolute;
    display: none;
    top: 50%;
    left: 50%;
    margin-left: -0.2rem;
    margin-top: -0.6rem;
    width: 0.5rem;
    height: 1rem;
    border-width: 0 0.2rem 0.2rem 0 !important;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}

.modal-member .form-element .form-check label > input:checked ~ span, .box-member .form-check label > input:checked ~ span {
    background: #3B70FA;
}

.modal-member .form-element .form-check label > input:checked ~ span:after, .box-member .form-check label > input:checked ~ span:after {
    display: block;
    border: solid #fff;
}

.modal-member .form-element .form-check, .box-member .form-check {
    padding: 0;
}

.modal-member .modal-title .close {
    text-shadow: none;
    opacity: 1;
    color: #fff;
    font-size: 1.4rem;
    font-weight: 400;
}

.static-member .static-item {
    background: #F8FBFF;
    padding: 2rem;
    border-radius: 1.2rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.static-member .static-item .inner-left {
    display: flex;
    flex-direction: column;
    font-size: 1.6rem;
}

.static-member .static-item .inner-icon {
    width: 5rem;
    height: 5rem;
    background: #B6EED8;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 0.8rem;
}

.static-member .static-item .inner-top .inner-icon > svg {
    width: 3rem;
    height: 3rem;
}

.static-member>.row>div[class*=col-]:nth-child(2) .static-item .inner-icon {
    background: #CBE3FF;
}

.static-member .static-item .inner-left .value {
    font-size: 3rem;
    margin-top: 1.5rem;
    font-weight: 500;
}

.static-member .static-item .inner-left .value .unit {
    font-size: 1.6rem;
    color: #252525;
    font-weight: 500;
}

.static-member .static-item.item-viewed .inner-left .value {
    color: #000;
}

.static-member>.row>div[class*=col-]:nth-child(3) .static-item .inner-icon {
    background: #FFEEDD;
}

.static-member>.row>div[class*=col-]:nth-child(4) .static-item .inner-icon {
    background: #EAE4FF;
}

.static-list {
    margin-top: 3rem;
}

.static-list .list-item {
    background: #fff;
    border-radius: 0.8rem;
    height: 100%;
}

.static-list .list-item .top-title {
    font-size: 1.8rem;
    font-weight: 600;
    color: #103460;
    margin-bottom: 1.5rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.static-list .list-rfq .list .item {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    padding: 1rem;
    border-radius: 0.6rem;
    margin-bottom: 1rem;
    background: #F8FBFF;
    min-height: 9rem;
}

.static-list .list-rfq .list .item:last-child {
    margin-bottom: 0;
}

.static-list .list-rfq .list .item .inner-icon {
    width: 5.2rem;
    height: 5.2rem;
    min-width: 5.2rem;
    background: #B6EED8;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.static-list .list-rfq .list .item .inner-info {
    flex: 1;
    display: flex;
    justify-content: space-between;
}

.static-list .list-rfq .list .item .inner-info .type-text {
    font-size: 1.4rem;
    color: #000;
    font-weight: 700;
    margin-bottom: 0.3rem;
}

.static-list .list-rfq .list .item .inner-info .product-name {
    font-size: 1.4rem;
    color: #666;
}

.static-list .list-rfq .list .item .inner-info .info-tag {
    margin: 0.5rem 0;
}

.static-list .list-rfq .list .item .inner-info .tag {
    display: inline-block;
    padding: 0.3rem 0.8rem;
    background: #E3F2FD;
    color: #1976D2;
    border-radius: 0.4rem;
    font-size: 1.2rem;
    font-weight: 500;
}

.static-list .list-rfq .list .item .inner-info .info-time {
    font-size: 1.4rem;
    color: #6F788A;
    margin-top: 0.5rem;
}

.static-list .list-featured-products .list .item {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1rem;
    border-radius: 0.6rem;
    margin-bottom: 1rem;
    background: #F8FBFF;
    min-height: 9rem;
}

.static-list .list-featured-products .list .item:last-child {
    margin-bottom: 0;
}

.static-list .list-featured-products .list .item .inner-image {
    width: 6rem;
    height: 6rem;
    min-width: 6rem;
    border-radius: 0.6rem;
    overflow: hidden;
    background: #f0f0f0;
}

.static-list .list-featured-products .list .item .inner-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.static-list .list-featured-products .list .item .inner-info {
    flex: 1;
}

.static-list .list-featured-products .list .item .inner-info .product-name {
    font-size: 1.4rem;
    color: #333;
    font-weight: 500;
    margin-bottom: 0.5rem;
    line-height: 1.4;
}

.static-list .list-featured-products .rating-view {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.static-list .list-featured-products .list .item .inner-info .product-rating {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.3rem;
}

.static-list .list-featured-products .list .item .inner-info .rating-value {
    font-size: 1.4rem;
    font-weight: 600;
    color: #333;
}

.static-list .list-featured-products .list .item .inner-info .stars {
    display: flex;
    gap: 0.2rem;
}

.static-list .list-featured-products .list .item .inner-info .product-views {
    font-size: 1.2rem;
    color: #999;
}

.static-list .list .item.empty {
    padding: 2rem;
    text-align: center;
    color: #999;
}

.box-member .action-form {
    text-align: center;
}

.box-member .register-form .btn-submit {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    background: #0f3556;
    border-color: #0f3556;
}

.box-member .register-form .btn-submit:hover {
    background: #f97316;
    border-color: #f97316;
}

.logs-register .title-log {
    font-size: 1.8rem;
    margin-bottom: 1.5rem;
}

.box-seller-registration .logs-register table tr td {
    padding: 1rem 1.5rem;
    font-size: 1.4rem;
}

.border-table {
    border: 1px solid #e8e8e8;
    border-radius: 0.8rem;
}

.border-table > table {
    border: 0;
    margin-bottom: 0;
}

.border-table > table > thead > tr > td {
    border-top: 0;
    border-left: 0;
    background: #f9f9f9;
    font-weight: 500;
}

.border-table > table > thead > tr:first-child > td:first-child {
    border-top-left-radius: 0.8rem;
}

.border-table > table > thead > tr:first-child > td:last-child {
    border-top-right-radius: 0.8rem;
}

.border-table > table > thead > tr:last-child > td {
    border-bottom: 0;
}

.border-table > table tr > td:last-child {
    border-right: 0;
}

.border-table > table > tbody > tr > td {
    border-bottom: 0;
    border-left: 0;
}

.box-seller-registration .box-form.box-form-logs {
    padding: 0;
    background: #fff;
    margin-top: 35px;
    border: 0;
}

.box-seller-registration .logs-register .badge {
    padding: 4px 10px;
    display: inline-flex;
    align-items: center;
    font-size: 11px;
    font-weight: 500;
}

.box-seller-registration .image-show img {
    height: 100%;
    width: auto;
    max-width: 200px;
}

.fs-14 {
    font-size: 14px;
}

.box-member .register-form .action-form .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    border-radius: 6px;
    line-height: 1.5;
}

.box-add-product .form-product .input-group.input-group-custom {
    border: 1px solid #dee2e6;
    border-radius: 6px;
}

.box-add-product .form-product .input-group.input-group-custom .form-control {
    border: 0;
}

.box-add-product .form-product .input-group.input-group-custom .input-group-append .bootstrap-select.form-control {
    height: auto;
}

.box-add-product .form-product .input-group.input-group-custom .input-group-append .bootstrap-select.form-control .dropdown-toggle {
    height: 34px;
    gap: 5px;
}

.box-add-product .form-product .input-group.input-group-custom .input-group-append {
    align-items: center;
    gap: 5px;
    margin-right: 5px;
}

.form-group {
    margin-bottom: 2.5rem;
}

.gap-5 {
    gap: 5px;
}

#attributes-product .item-attribute {
    padding: 10px 15px 15px;
    border: 1px solid #dee2e6;
    margin-bottom: 15px;
    border-radius: 6px;
}

#attributes-product .item-attribute .form-group {
    margin-bottom: 0;
}

.list-image-album .item-image-album img {
    height: 70px;
    width: 70px;
    object-fit: cover;
    border-radius: 4px;
}

.list-image-album .item-image-album {
    margin-bottom: 5px;
}

.search-section__categories {
    border-right: 1px solid #dee2e6 !important;
    width: auto !important;
    border-radius: 0;
}

.search-section__categories>.dropdown-toggle {
    border: 0;
    width: auto;
    gap: 5px;
    height: 24px;
    padding: 0 6px;
    font-size: 16px;
    line-height: 24px;
}

.home-slider {
    margin: 7px 0;
}

.home-slider>.container>.row {
    margin-left: -3.5px;
    margin-right: -3.5px;
}

.home-slider>.container>.row>div[class*=col-] {
    padding-left: 3.5px;
    padding-right: 3.5px;
}

.swiper-slider-main .swiper-slide img {
    height: 46.4rem;
}

.bottom-banner-slider {
    margin: 7px 0 0;
}

.bottom-banner-slider > .row {
    margin-left: -3.5px;
    margin-right: -3.5px;
}

.bottom-banner-slider > .row > div[class*=col-] {
    padding-left: 3.5px;
    padding-right: 3.5px;
}

.bottom-banner-slider .item-banner {
    height: 23.5rem;
    border-radius: 0.8rem;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    position: relative;
}

.bottom-banner-slider .item-banner > a {
    position: relative;
    padding: 4rem 2rem;
    display: flex;
    align-items: flex-start;
    gap: 1.5rem;
    height: 100%
}

.bottom-banner-slider .item-banner.item-banner-rfq > a {
    padding: 25px 20px;
}

.bottom-banner-slider .item-banner.item-banner-rfq .inner-content .title {
    display: flex;
    align-items: center;
}

.bottom-banner-slider .item-banner.item-banner-rfq .inner-content .title {
    font-size: 2.6rem;
    text-transform: uppercase;
    gap: 0.5rem;
    line-height: 100%;
}

.bottom-banner-slider .item-banner.item-banner-rfq .inner-content .title > img {
    height: 3rem;
}

.bottom-banner-slider .item-banner > a:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    background: #081E39A8;
    border-radius: 0.8rem;
}

.bottom-banner-slider .item-banner .inner-icon {
    position: relative;
    background: #DEEDFF;
    width: 5.5rem;
    height: 5.5rem;
    border-radius: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0.5rem;
    z-index: 9;
}

.bottom-banner-slider .item-banner .inner-icon > svg {
    width: 3.2rem;
    height: 3.2rem;
}

.bottom-banner-slider .item-banner .inner-icon > svg > path {
    stroke: #0F3556;
}

.bottom-banner-slider .item-banner .inner-content {
    color: #fff;
    position: relative;
    z-index: 9;
}

.bottom-banner-slider .item-banner .inner-content .title {
    font-size: 2.8rem;
    font-weight: 700;
    line-height: 4rem;
}

.bottom-banner-slider .item-banner .inner-content .view-now {
    color: #fff;
    text-decoration: underline;
    font-style: italic;
}

.bottom-banner-slider .item-banner .inner-content ul {
    list-style: disc;
    padding-left: 1.5rem;
    margin-bottom: 1.5rem;
    font-size: 1.4rem;
    line-height: 2.6rem;
}

.bottom-banner-slider > .row > div[class*=col-]:last-child .item-banner .inner-content .view-now {
    background: #CC4C0C;
    padding: 0.6rem 1rem;
    border-radius: 0.6rem;
    text-decoration: unset;
    font-style: normal;
    font-size: 1.2rem;
}

.sidebar-rfq-new {
    background: #fff;
    border-radius: 6px;
    padding: 10px;
    height: 100%;
}

.sidebar-rfq-new .header-title {
    text-transform: uppercase;
    font-size: 1.6rem;
    font-weight: 500;
    margin-bottom: 0.7rem;
    display: flex;
    align-items: center;
    gap: 0.8rem;
    color: #103460;
}

.sidebar-rfq-new .header-title > img {
    width: 2rem;
    height: 2rem;
}

.sidebar-rfq-new .list-item .item {
    background: #F7F8F8;
    margin-bottom: 0.7rem;
    border-radius: 0.6rem;
    padding: 0.7rem 1rem;
    border: 1px solid #bfbfbf;
    font-size: 1rem;
    line-height: 1.4;
}

.sidebar-rfq-new .list-item .item:last-child {
    margin-bottom: 0;
}

.sidebar-rfq-new .list-item .item .title {
    color: #F67B00;
    text-transform: uppercase;
    font-size: 1.2rem;
    margin-bottom: 0.5rem;
    font-weight: 700;
}

.sidebar-rfq-new .list-item .item .info {
    padding: 0;
    list-style: none;
    margin-bottom: 0.5rem;
}

.sidebar-rfq-new .list-item .item .info > li > span {
    color: var(--color-main);
    font-weight: 600;
}

.sidebar-rfq-new .list-item .item .info > li {
    display: flex;
    align-items: center;
    margin-bottom: 0.5rem;
    line-height: 1;
    gap: 1rem;
    color: var(--color-main);
}

.sidebar-rfq-new .list-item .item .info > li .icon {
    width: 1.4rem;
    height: 1.4rem;
    display: flex;
    align-items: center;
}

.sidebar-rfq-new .list-item .item .info > li .icon img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.sidebar-rfq-new .list-item .item .view-detail {
    text-decoration: underline;
    color: var(--color-main);
    font-style: italic;
    font-weight: 500;
}

.section-proucts {
    margin: 5rem 0 0;
}

.section-proucts .title-section {
    font-size: 2.8rem;
    font-weight: 400;
    line-height: 100%;
}

.btn-product-wishlist {
    flex: 0 0 20px;
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #DFDFDF;
    border: 1px solid #afafaf;
    border-radius: 100%;
}

.btn-product-wishlist > svg {
    width: 10px;
    height: 10px;
}

.btn-product-wishlist > svg > path {
    stroke: var(--color-main);
}

.btn-product-wishlist.added-wishlist > svg > path {
    fill: var(--color-main);
}

.btn-product-wishlist:hover {
    background: #f97316;
}

.btn-product-wishlist:hover > svg > path {
    stroke: #fff;
}

.product-item .seller-name {
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    display: -webkit-box;
    color: var(--color-main);
    text-transform: uppercase;
    padding-bottom: 0.5rem;
    margin-bottom: 0.5rem;
    border-bottom: 1px solid #DEDEDE;
    min-height: 5.5rem;
}

.product-item .seller-name > a {
    color: var(--color-main);
}

.product-item .seller-name > a > svg {
    margin-left: 1rem;
    margin-top: -0.2rem;
}

.product-item .attributes-price .item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: var(--color-main);
    margin-bottom: 0.4rem;
    font-size: 1.2rem;
}

.product-item .attributes-price .item .label {
    font-weight: 500;
}

.product-item .action-bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    margin-top: 1rem;
}

.product-item .action-bottom > .btn {
    flex: 0 0 50%;
    max-width: 50%;
    font-size: 1.6rem;
    padding: 0.6rem;
    border-radius: 0.6rem;
}

body.body-ja .product-item .action-bottom > .btn {
    flex: auto;
    max-width: 100%;
}

.product-item .action-bottom > .btn.btn-chat-now {
    border: 1px solid #767676;
}

.product-item .action-bottom > .btn.btn-request-quote {
    background: var(--color-main);
    color: #fff;
    font-weight: 300;
}

.btn.btn-add-product {
    background: var(--color-main);
    color: #fff;
    border-radius: 0.8rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.6rem 1rem;
}

.btn.btn-add-product > svg {
    width: 2.4rem;
    height: 2.4rem;
}

.form-product .action-filter, .form-list-rfq .action-filter {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.form-product .action-filter .btn, .form-list-rfq .action-filter .btn {
    padding: 0.5rem;
    width: 4rem;
}

.form-product .action-filter .btn > svg, .form-list-rfq .action-filter .btn > svg {
    width: 2rem;
    height: 2rem;
}

.list-product-element .img-product .img-fluid {
    width: 6rem;
    height: 6rem;
    object-fit: cover;
    border-radius: 0.6rem;
}

.list-product-element .product-name {
    color: var(--color-main);
    font-weight: 400;
}

.list-product-element .product-rating {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-top: 0.5rem;
}

.list-product-element .table th:first-child, .table td:first-child {
    padding-left: 2rem;
}

.list-product-element .table th, .table td {
    padding-left: 2.5rem;
}

@media (min-width: 1200px) {
    .list-product-element table {
        width: 100%;
        table-layout: fixed;
    }

    .list-product-element tbody td:nth-child(1) {
        width: 40%;
    }

    .list-product-element tbody td:nth-child(2) {
        width: 15%;
    }

    .list-product-element tbody td:nth-child(3) {
        width: 15%;
    }

    .list-product-element tbody td:nth-child(4) {
        width: 30%;
    }

    .list-product-element tbody td:nth-child(5) {
        width: 5%;
    }

    .list-product-element tbody td:nth-child(6) {
        width: 5%;
    }
}

.list-product-element .product-rating .rating-number {
    font-weight: 600;
}

.list-product-element .price {
    color: var(--color-highlight);
}

.form-product .action-form .btn-submit {
    background: var(--color-main);
    border: 0;
    color: #fff;
    border-radius: 0.8rem;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 1rem 2rem;
}

.search-section__categories.form-control>.dropdown-toggle:after {
    background: transparent;
    padding: 0;
}

.form-coffee-quotes {
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    border-radius: 0.6rem;
    padding: 2rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.form-coffee-quotes .inner-form {
    background: #fff;
    padding: 2rem 3rem;
    border-radius: 0.6rem;
    flex: 0 0 43%;
}

.form-coffee-quotes .inner-text {
    color: #fff;
    font-weight: 300;
    padding-left: 3rem;
}

.form-coffee-quotes .inner-text .title {
    font-size: 2.6rem;
    font-weight: 700;
    text-transform: uppercase;
    margin-bottom: 1.5rem;
}

.form-coffee-quotes .inner-text .desc {
    font-style: italic;
    margin-bottom: 3rem;
}

.form-coffee-quotes .inner-text ul {
    margin-bottom: 2.5rem;
    padding-left: 1.5rem;
}

.form-coffee-quotes .inner-text .submit-now {
    font-weight: 600;
    font-size: 2rem;
}

.form-coffee-quotes .inner-form .title-form {
    font-size: 2rem;
    font-weight: 400;
    margin-bottom: 1.5rem;
}

.form-coffee-quotes .inner-form textarea {
    height: 8.4rem;
}

.form-coffee-quotes .inner-form .form-control::placeholder {
    color: #DFDFDF
}

.form-coffee-quotes .inner-form .btn-submit {
    background: #964800;
    border: 0;
    border-radius: 0.8rem;
    width: 15rem;
    height: 4rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.section-ncc {
    margin: 4rem 0;
}

.list-seller .item-seller {
    background: #f7f8f8;
    border-radius: 0.8rem;
    margin-bottom: 1rem;
    box-shadow: 0 0.5rem 1rem rgb(0 0 0 / 19%) !important;
    height: 100%;
}

.list-seller>.row {
    margin-left: -5px;
    margin-right: -5px;
}

.list-seller>.row>div[class*=col-] {
    padding-left: 5px;
    padding-right: 5px;
}

.list-seller .item-seller .banner {
    position: relative;
    overflow: hidden;
    border-radius: 0.8rem;
}

.list-seller .item-seller .banner img {
    width: 100%;
    height: 25.6rem;
    object-fit: cover;
}

.list-seller .item-seller .inner-content {
    padding: 3rem;
}

.list-seller .item-seller .inner-content .company-info {
    display: flex;
    margin-bottom: 2rem;
    min-height: 10rem;
}

.list-seller .item-seller .inner-content .company-info .logo {
    flex: 0 0 7.2rem;
    height: 7.2rem;
}

.list-seller .item-seller .inner-content .company-info .logo > img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.list-seller .item-seller .inner-content .company-info .info-right {
    flex: 0 0 calc(100% - 7.2rem);
    padding-left: 1rem;
}

.list-seller .item-seller .inner-content .company-info .info-right .company-name {
    color: #F6B400;
    text-transform: uppercase;
    text-decoration: unset;
    margin-bottom: 1.5rem;
}

.list-seller .item-seller .inner-content .company-info .info-right .company-name > a > svg {
    margin-left: 1rem;
    margin-top: -0.2rem;
}

.list-seller .item-seller .inner-content .company-info .info-right .company-name > a {
    color: #F6B400;
}

.list-seller .item-seller .inner-content .company-info .info-right .company-name > svg, .product-item .seller-name > svg {
    margin-left: 7px;
    margin-top: -2px;
}

.list-seller .item-seller .inner-content .company-info .info-right .company-address {
    font-size: 1.2rem;
    color: #0F3556;
    line-height: 2rem;
    text-align: justify;
}

.list-seller .item-seller .inner-content .company-profile {
    font-size: 1.4rem;
}

.list-seller .item-seller .inner-content .company-profile > ul {
    margin-bottom: 0;
    padding-left: 0;
    list-style: none;
}

.list-seller .item-seller .inner-content .company-profile > ul > li {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1rem;
    color: #103460;
}

.list-seller .item-seller .inner-content .company-profile > ul > li > span.label {
    font-weight: 600;
}

.list-seller .item-seller .inner-content .action {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 5px;
}

.list-seller .item-seller .inner-content .action > .btn {
    flex: auto;
    height: 3.5rem;
    border: 1px solid #103460;
    border-radius: 0.8rem;
    padding: 0.5rem 1rem;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.6rem;
    color: #103460;
}

.list-seller .item-seller .inner-content .action > .btn.btn-contact-seller {
    background: #103460;
    color: #fff;
}

.section-ncc .action-block {
    text-align: center;
}

.section-ncc .action-block .view-more {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-top: 2rem;
    background: #103460;
    color: #fff;
    width: 150px;
    height: 40px;
    border-radius: 8px;
    font-size: 14px;
}

.box-sidebar {
    background: #fff;
    padding: 12px;
    border-radius: 8px;
}

.box-sidebar .title-sidebar {
    font-size: 16px;
    font-weight: 700;
    color: var(--color-main);
}

.content-filter-product {
    margin: 1rem 0;
}

.content-filter-product .item-filter {
    background: #fff;
    padding: 1.2rem;
    border-radius: 0.8rem;
    margin-bottom: 1rem;
}

.item-filter .content-filter-range {
    display: flex;
    align-items: center;
    gap: 0.8rem;
    margin-bottom: 2.5rem;
}
.content-filter-range .form-range {
    display: flex;
    align-items: center;
    gap: 0.8rem;
    margin-bottom: 0;
}

.content-filter-product .item-filter .title-filter {
    font-size: 1.6rem;
    font-weight: 500;
    margin-bottom: 1rem;
}

.content-filter-product .item-filter .row {
    margin-left: -0.5rem;
    margin-right: -0.5rem;
}

.content-filter-product .item-filter .row>div[class*=col-] {
    padding-left: 0.5rem;
    padding-right: 0.5rem;
}

.content-filter-product .item-filter.item-title {
    display: flex;
    align-items: center;
    gap: 1.5rem;
    color: #103460;
    font-weight: 500;
}

.content-filter-product .item-filter .content-filter .inner-product-attribute {
    display: inline-flex;
    width: 100%;
    align-items: center;
    color: #333;
    padding: 10px 0;
}

.content-filter-product .item-filter .content-filter .inner-product-attribute .inner-switch > span, .content-filter-rfq .form-check .form-check-label .inner-switch > span {
    width: 22px;
    height: 22px;
    margin-right: 1rem;
    display: block;
    position: relative;
    border: 0.1rem solid #e3e3e3;
    -webkit-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
    border-radius: 4px;
}

.content-filter-product .item-filter .content-filter .inner-product-attribute:hover .inner-switch > span::after .content-filter-product .item-filter .content-filter .inner-product-attribute.active .inner-switch > span::after {
    content: "\f00c";
    font-family: "Font Awesome 6 Pro";
    font-weight: 900;
    position: absolute;
    top: 0;
    left: 0;
    line-height: 1;
}

.tab-products-sellers {
    display: flex;
    align-items: center;
    margin-bottom: 15px;
    gap: 15px;
}

.tab-products-sellers .tab-item {
    position: relative;
    color: var(--color-main);
    text-transform: uppercase;
    padding-bottom: 2px;
    font-size: 1.8rem;
    margin-right: 2.5rem;
}

.tab-products-sellers .tab-item.active {
    font-weight: 700;
}

.tab-products-sellers .tab-item:before {
    content: "";
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 3px;
    background: transparent;
}

.tab-products-sellers .tab-item.active:before {
    background: var(--color-main);
}

.product-detail-head > .row {
    margin-left: -10px;
    margin-right: -10px;
}

.product-detail-head > .row > div[class*="col-"] {
    padding-left: 10px;
    padding-right: 10px;
}

.wishlist-product-detail {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 21px;
}

.wishlist-product-detail .btn-product-wishlist {
    flex: 0 0 22px;
    height: 22px;
}

.wishlist-product-detail .btn-product-wishlist > svg {
    width: 12px;
    height: 22px;
}

.wishlist-product-detail .label {
    color: #6F788A;
}

.box-price-info {
    background: #F4F9FF;
    padding: 12px;
    border-radius: 8px;
}

.box-price-info .item-price {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.box-price-info .item-price .price {
    font-size: 3.2rem;
    font-weight: bold;
    text-transform: uppercase;
}

.box-price-info .item-price .action .btn-rfq {
    background: #F67B00;
    color: #fff;
    border-radius: 100px;
    padding: 4px 12px;
    font-size: 1.4rem;
}

.box-price-info .item-min-order {
    margin: 12px 0;
}

.box-price-info .item-price-info {
    background: #B7D7FE;
    border-radius: 6px;
    display: flex;
    align-items: center;
    padding: 4px 5px;
    font-size: 12px;
    gap: 15px;
    line-height: 1.4;
}

.box-price-info .item-price-info .info {
    display: flex;
    align-items: center;
    color: #103460;
    gap: 5px;
}

.box-description {
    margin-top: 15px;
    background: #F4F9FF;
    border-radius: 8px;
    padding: 12px;
    font-size: 1.2rem;
}

.box-description .inner-title {
    font-weight: 600;
}

.box-payment-method {
    margin: 2rem 0;
}

.box-payment-method .title-box {
    font-size: 1.6rem;
    font-weight: 700;
    color: var(--color-main);
    margin-bottom: 2rem;
}

.product-content-detail .box-action > .row {
    margin-left: -5px;
    margin-right: -5px;
}

.product-content-detail .box-action > .row > div[class*=col-] {
    padding-left: 5px;
    padding-right: 5px;
}

.product-content-detail .box-action .btn-request-quote {
    background: #103460;
    color: #fff;
}

.product-content-detail .box-action .btn {
    width: 100%;
    border-radius: 0.8rem;
    height: 5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.8rem;
}

.product-content-detail .box-action .btn-chat {
    border: 1px solid #333;
}

.product-attributes .box-title, .product-detail-head .product-content .box-title {
    font-size: 1.8rem;
    color: var(--color-main);
    font-weight: 600;
    margin-bottom: 1rem;
}

.product-attributes .list-attribute .item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1.5rem 0;
    border-bottom: 1px solid #c3c3c35c;
}

.product-attributes .list-attribute .item .label {
    font-weight: 600;
}

.product-attributes .list-attribute .item:last-child {
    padding-bottom: 0;
    border: 0;
}

.product-attributes .view-report {
    text-align: center;
    margin-top: 3rem;
}

.product-attributes .view-report > a {
    display: inline-block;
    border: 1px solid #000;
    color: #000;
    border-radius: 0.8rem;
    padding: 0.5rem 1.5rem;
}

.product-detail-head .product-content {
    margin: 2rem 0;
}

.product-detail-head .product-content img {
    max-width: 100%;
}

.swiper-slider-main .swiper-slide video {
    height: auto;
    width: 100%;
    border-radius: 0.8rem;
}

.swiper-slider-main.swiper-slider-landing .swiper-slide img {
    height: 80rem;
    border-radius: 0;
}

.swiper-slider-main.swiper-slider-landing .swiper-slide {
    position: relative;
}

.swiper-slider-main.swiper-slider-landing .swiper-slide:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    background: #0F3556CC;
}

.landing-header-menu {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    z-index: 99;
    padding: 9rem 0;
}

.swiper-slide--wrap .slogan {
    border: 1px solid #FFFFFF80;
    border-radius: 100px;
    padding: 0.2rem 2rem 0.2rem 0.5rem;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: #fff;
    font-weight: 300;
}

.swiper-slide--wrap .slogan .icon img {
    height: 24px;
    width: auto;
    object-fit: contain;
}

.swiper-slider-landing .swiper-slide--wrap {
    top: calc(50% + 5rem);
    /*left: calc(12.5% + 15px);*/
    left: auto;
    max-width: 52rem;
}

.swiper-slider-landing .swiper-slide--wrap .swiper-slide--tile {
    font-size: 3.6rem;
    font-weight: 700;
    line-height: 5.5rem;
    color: #fff;
    margin: 4rem 0 2rem;
}

.swiper-slider-landing .swiper-slide--wrap .swiper-slide--tile > span {
    color: #E8B34A;
}

.swiper-slider-landing .swiper-slide--wrap .swiper-slide--description-short, .swiper-slider-landing .swiper-slide--wrap .swiper-slide--description {
    color: #F7F8F8;
    margin-bottom: 2rem;
    font-size: 1.6rem;
}

.swiper-slider-landing .swiper-slide--wrap .swiper-slide--link {
    background: #E8B34A;
    color: #24262D;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    gap: 1rem;
    border-radius: 0.8rem;
    text-transform: none;
    padding: 0.6rem 1.5rem;
    margin-top: 3rem;
    margin-right: 1rem;
}

.section-connect-support {
    background: #103460;
    padding: 5rem 0 11rem;
}

.section-connect-support .title-landing {
    font-size: 3.2rem;
    font-weight: 600;
    color: #F7F8F8;
    margin-bottom: 2rem;
}

.section-connect-support .list-support>.row {
    margin-left: -7.5px;
    margin-right: -7.5px;
}

.section-connect-support .list-support>.row>div[class*=col-] {
    padding-left: 7.5px;
    padding-right: 7.5px;
}

.section-connect-support .list-support .item {
    border: 1px solid #FFFFFF80;
    border-radius: 0.8rem;
    background: #F5F5F51A;
    padding: 2.5rem;
    height: 100%;
    color: #F7F8F8;
}

.section-connect-support .list-support .item .icon {
    width: 4rem;
    height: 4rem;
    margin-bottom: 2rem;
}

.section-connect-support .list-support .item .icon img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.section-connect-support .list-support .item .title {
    font-size: 1.8rem;
    font-weight: 600;
    margin-bottom: 1.5rem;
}

.section-connect-support .list-support .item .desc {
    text-align: justify;
}

.section-value-brought {
    padding: 7rem 0 10rem;
}

.section-value-brought .title-landing {
    text-align: center;
    font-size: 4rem;
    line-height: 4rem;
    font-weight: 600;
    color: #103460;
    margin-bottom: 5rem;
}

.section-value-brought .list-value {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.section-value-brought .list-value .left, .section-value-brought .list-value .right {
    flex: 0 0 30rem;
    max-width: 30rem;
}

.section-value-brought .list-value .center {
    flex: 0 0 calc(100% - 60rem);
    max-width: calc(100% - 60rem);
    text-align: center;
    padding: 0 5rem;
}

.section-value-brought .list-value .center img {
    max-width: 100%;
    object-fit: contain;
}

.section-value-brought .list-value .item .title {
    font-size: 2.8rem;
    font-weight: 600;
    margin-bottom: 1.5rem;
    color: #24262D;
}

.section-value-brought .list-value .item {
    margin-bottom: 8rem;
}

.section-value-brought .list-value .item .desc {
    text-align: justify;
}

.section-value-brought .list-value .item:last-child {
    margin-bottom: 0;
}

.bg-value-about {
    background: #F2F2F7;
}

.section-promotional-products {
    padding: 5rem 0 12rem;
}

.section-promotional-products .title-landing {
    font-size: 4rem;
    line-height: 4rem;
    font-weight: 600;
    margin-bottom: 3rem;
}

.section-promotional-products .box-slogan {
    background: linear-gradient(90deg, rgba(178, 203, 255, 0.1) 0%, rgba(107, 122, 153, 0.1) 100%);
    border-radius: 1rem;
    padding: 5rem 4rem;
    margin-bottom: 4rem;
}

.section-promotional-products .box-slogan .title {
    font-size: 3.6rem;
    font-weight: 700;
    line-height: 4rem;
    margin-bottom: 3rem;
}

.section-promotional-products .box-slogan .desc {
    font-size: 2.4rem;
    line-height: 4rem;
    color: #24262D;
}

.section-promotional-products {
    padding: 5rem 0 12rem;
}

.section-promotional-products .title-landing {
    font-size: 4rem;
    line-height: 4rem;
    font-weight: 600;
    margin-bottom: 3rem;
    color: #103460;
}

.section-promotional-products .box-slogan {
    background: linear-gradient(90deg, rgba(178, 203, 255, 0.1) 0%, rgba(107, 122, 153, 0.1) 100%);
    border-radius: 1rem;
    padding: 5rem 4rem;
    margin-bottom: 4rem;
}

.section-promotional-products .box-slogan .title {
    font-size: 3.6rem;
    font-weight: 700;
    line-height: 4rem;
    margin-bottom: 3rem;
    color: #103460;
}

.section-promotional-products .box-slogan .desc {
    font-size: 2.4rem;
    line-height: 4rem;
    color: #24262D;
}

.section-promotional-products .list-products .item {
    margin-bottom: 4rem;
}

.section-promotional-products .list-products .item > img {
    height: 32rem;
    width: 100%;
    object-fit: cover;
    border-radius: 1.5rem;
    margin-bottom: 2.5rem;
}

.section-promotional-products .list-products .item .title {
    font-size: 3rem;
    line-height: 4rem;
    font-weight: 700;
    color: #103460;
    margin-bottom: 1.5rem;
}

.section-promotional-products .list-products .item .desc {
    font-size: 2.4rem;
    line-height: 4rem;
    color: #24262D;
    text-align: justify;
}

.parameter .item .number {
    font-size: 15rem;
    font-weight: 700;
    line-height: 1.2;
}

.parameter .item {
    text-align: center;
    font-weight: 700;
    line-height: 4rem;
    color: #fff;
}

.parameter .item .title {
    font-size: 3.6rem;
}

.section-promotion-pro > .container, .section-parameter > .container, .section-coffee-story > .container, .section-official-partner > .container, .section-tieu-chi > .container {
    max-width: 1610px;
    width: 100%;
}

.section-parameter {
    position: relative;
    padding: 14rem 0;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}

.section-parameter .parameter {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.section-parameter:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    background: #103460;
    opacity: 70%;
}

.section-coffee-story .inner-content {
    max-width: 69.5rem;
    font-size: 2.4rem;
    line-height: 4rem;
}

.section-coffee-story .inner-content .title {
    font-size: 4rem;
    line-height: 4rem;
    font-weight: 600;
    color: #103460;
    margin-bottom: 1.5rem;
}

.section-coffee-story {
    padding: 10rem 0;
}

.section-coffee-story .inner-content {
    max-width: 69.5rem;
    font-size: 2.4rem;
    line-height: 4rem;
    color: #24262D;
    text-align: justify;
}

.section-coffee-story .inner-content .title {
    font-size: 4rem;
    line-height: 4rem;
    font-weight: 600;
    color: #103460;
    margin-bottom: 3rem;
}

.section-coffee-story {
    padding: 10rem 0;
}

.section-coffee-story .inner-image {
    max-width: 79rem;
    position: relative;
    padding-top: 120%;
}

.section-coffee-story .inner-image > img {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 1.5rem;
}

.section-coffee-story .inner-content .desc {
    text-align: justify;
    font-size: 3.6rem;
    font-weight: 700;
    line-height: 4rem;
    color: #F67B00;
    margin-bottom: 3rem;
}

.section-coffee-story .inner-content .desc p {
    margin-bottom: 4rem;
}

.section-coffee-story .inner-content .action {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
}

.section-coffee-story .inner-content .action > a {
    display: inline-block;
    flex: 0 0 calc(50% - 10px);
    background: #103460;
    color: #fff;
    text-align: center;
    font-size: 3rem;
    font-weight: 400;
    line-height: 2.2rem;
    padding: 2.2rem 2rem;
    border-radius: 0.8rem;
    text-transform: none;
}

.section-coffee-story .inner-content .action > a.buy-now {
    background: #F67B00;
}

.section-official-partner .title-landing {
    font-size: 4rem;
    font-weight: 600;
    line-height: 100%;
    margin-bottom: 2rem;
    color: #103460;
}

.section-official-partner .list-partner {
    background: linear-gradient(90deg, rgba(178, 203, 255, 0.05) 0%, rgba(107, 122, 153, 0.05) 100%);
    border-radius: 1.5rem;
    padding: 4.5rem;
    margin-bottom: 5rem;
}

.section-official-partner .list-partner .item-partner {
    display: flex;
    align-items: center;
    margin-top: 4rem;
}

.section-official-partner .list-partner .item-partner .inner-image {
    flex: 0 0 62%;
    max-width: 62%;
}

.section-official-partner .list-partner .item-partner .inner-content {
    flex: 0 0 38%;
    max-width: 38%;
    padding-left: 5rem;
}

.section-official-partner .list-partner .item-partner .inner-content .title {
    font-size: 3rem;
    line-height: 4rem;
    font-weight: 700;
    color: #F67B00;
    margin-bottom: 3rem;
}

.section-official-partner .list-partner .item-partner .inner-content .desc {
    font-size: 2.2rem;
    line-height: 4rem;
    text-align: justify;
}

.section-official-partner .list-partner .item-partner .inner-image > img {
    width: 100%;
    height: 32rem;
    object-fit: contain;
    border-radius: 1.5rem;
}

.section-official-partner .list-partner .action {
    text-align: right;
}

.section-official-partner .list-partner .action .read-more {
    font-size: 2rem;
    text-transform: none;
    line-height: 100%;
    font-weight: 500;
    font-style: italic;
    color: #000;
}

.section-official-partner .list-partner .item-partner:first-child {
    margin-top: 0;
}

.action-landing {
    text-align: right;
    margin-top: 1.5rem;
}

.action-landing .view-more {
    font-size: 2rem;
    font-weight: 500;
    font-style: italic;
    color: #000;
}

.section-coffee-network .title, .section-new-cf .title-section {
    font-size: 4rem;
    line-height: 100%;
    font-weight: 600;
    color: #103460;
    margin-bottom: 3rem;
}

.section-coffee-network {
    margin: 5rem 0;
}

.section-coffee-network .box-content {
    background: linear-gradient(90deg, rgb(178 203 255 / 17%) 0%, rgb(107 122 153 / 14%) 100%);
    padding: 3rem;
    border-radius: 1.5rem;
}

.section-coffee-network .box-content>.row {
    align-items: center;
}

.section-coffee-network .box-content .inner-content .desc {
    font-size: 3rem;
    line-height: 4rem;
    font-weight: 700;
    color: #F67B00;
    margin-bottom: 4rem;
}

.section-coffee-network .box-content .inner-content .content {
    font-size: 2.4rem;
    line-height: 4rem;
    font-weight: 400;
    text-align: justify;
}

.section-coffee-network .box-content .inner-content .content > p {
    margin-bottom: 3rem;
}

.section-coffee-network .box-content .inner-content .action {
    text-align: right;
    margin-top: 5rem;
}

.section-coffee-network .box-content .inner-content .action .read-more {
    font-style: italic;
    font-size: 2rem;
    line-height: 4rem;
    text-transform: none;
    font-weight: 500;
    color: #000;
}

.section-coffee-network .box-content .inner-image {
    /* margin-left: 4rem; */
}

.section-coffee-network .box-content .inner-image > img {
    width: 100%;
    height: auto;
}

.section-new-cf {
    margin-bottom: 5rem;
}

.section-new-cf .title-section {
    margin-bottom: 3rem;
}

.section-new-cf .article-item .inner-content .post-date {
    background: #fff;
    border: 1px solid #B5B9C5;
    border-radius: 0.6rem;
    display: flex;
    align-items: center;
    padding: 5px 10px;
    gap: 3px;
    font-size: 1.4rem;
    color: #0F3556;
    margin-bottom: 1.5rem;
}

.section-new-cf .article-item .inner-content .post-date > svg {
    width: 28px;
    height: 28px;
    margin-right: 1rem
}

.section-new-cf .article-item .inner-content .article-title {
    font-size: 3rem;
    font-weight: 700;
    line-height: 4rem;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    display: -webkit-box;
    margin-bottom: 1.5rem;
}

.section-new-cf .article-item .inner-content .article-description {
    -webkit-line-clamp: 4;
    font-size: 2.4rem;
    line-height: 4rem;
    text-align: justify;
    color: #24262D;
}

/* Certification Section Styles */
.certification-section {
    margin-top: 2rem;
}

.certification-section-header {
    margin-bottom: 2rem;
}

.certification-section-header.collapsed i.fa-chevron-down::before {
    content: "\f078";
}

.certification-section-header:not(.collapsed) i.fa-chevron-down::before {
    content: "\f077";
}

.certification-list {
    margin-bottom: 1.5rem;
}

.certification-item {
    margin-bottom: 1.5rem;
}
.certification-section.form-group .bootstrap-select>.dropdown-toggle {
    padding-left: 4rem;
}
.certification-card {
    background: #ffffff;
    border: 1px solid #e2e5ec;
    border-radius: 8px;
    padding: 2rem;
    position: relative;
}

.certification-item-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    margin-bottom: 1.5rem;
}

.certification-name-group {
    flex: 1;
    margin-right: 1rem;
}

.certification-label {
    font-weight: 600;
    font-size: 1.4rem;
    color: #333;
    margin-bottom: 0.8rem;
    display: block;
}

.certification-other-tab {
    font-weight: normal;
    color: #666;
    font-size: 1.3rem;
    margin-left: 0.5rem;
}

.certification-input-wrapper {
    position: relative;
    display: flex;
    align-items: center;
}

.certification-drag-icon {
    position: absolute;
    left: 1rem;
    color: #999;
    z-index: 2;
    pointer-events: none;
}

.certification-select, .certification-input-other {
    padding-left: 3.5rem;
    padding-right: 3.5rem;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    height: 40px;
    width: 100%;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
}

.certification-input-other {
    margin-left: 0.5rem;
    padding-left: 1rem;
}

.certification-chevron {
    position: absolute;
    right: 1rem;
    color: #999;
    pointer-events: none;
    z-index: 2;
}

.btn-certification-delete {
    background: transparent;
    border: none;
    color: #dc3545;
    font-size: 1.6rem;
    cursor: pointer;
    padding: 0.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 3.5rem;
    height: 3.5rem;
    border-radius: 4px;
    transition: all 0.3s ease;
}

.btn-certification-delete:hover {
    background: #fee;
    color: #c82333;
}

.certification-file-group {
    margin-top: 1.5rem;
}

.certification-file-upload {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.certification-file-upload .btn-select-file {
    border: 1px solid #007bff;
    color: #007bff;
    background: transparent;
    padding: 0.6rem 1.5rem;
    border-radius: 6px;
    font-size: 1.4rem;
    cursor: pointer;
    transition: all 0.3s ease;
}

.certification-file-upload .btn-select-file:hover {
    background: #007bff;
    color: #fff;
}

.file-name-display {
    font-size: 1.4rem;
    color: #666;
    flex: 1;
}

.file-name-display a {
    color: #007bff;
    text-decoration: none;
}

.file-name-display a:hover {
    text-decoration: underline;
}

.btn-add-certification {
    border: 1px solid #007bff;
    color: #007bff;
    background: transparent;
    padding: 0.8rem 1.5rem;
    border-radius: 6px;
    font-size: 1.4rem;
    cursor: pointer;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.btn-add-certification:hover {
    background: #007bff;
    color: #fff;
}

.btn-add-certification i {
    font-size: 1.6rem;
}

.form-profile-seller .company-logo {
    width: 8.4rem;
    height: 8.4rem;
    position: relative;
    border-radius: 0.6rem;
}

.form-profile-seller .company-logo .btn-select-image {
    position: absolute;
    top: -1rem;
    right: -1rem;
    background: #f67b00;
    border: 1px solid #f67b00;
    width: 2.5rem;
    height: 2.5rem;
    font-size: 1.1rem;
    border-radius: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: #fff;
}

.form-profile-seller .company-logo .btn-clear-image {
    display: none;
}

.form-profile-seller .btn-select-image-album, .certification-file-group .btn-select-file {
    border-radius: 0.6rem;
    background: var(--color-main);
    border-color: var(--color-main);
}

.certification-section-header label {
    display: flex;
    align-items: center;
    gap: 10px;
}

.certification-section-header label > small {
    margin: 0 !important;
}

.form-profile-seller .list-image-album {
    border: 1px solid #dee2e6;
}

.form-profile-seller .list-payment-method {
    border: 1px solid #dee2e6;
    border-radius: 0.6rem;
    padding: 5px 10px;
}

.form-profile-seller .list-payment-method .form-check-label {
    background: #F5F6F6;
    border-radius: 6px;
    padding: 8px 10px;
    min-width: 12rem;
    padding-left: 4rem;
    margin-bottom: 0;
}

.form-profile-seller .list-payment-method .form-check-label > span {
    top: 10px;
    left: 10px;
    width: 2rem;
    height: 2rem;
    background: transparent;
    border: 1px solid #cccfd2;
}

.kt-avatar .kt-avatar__holder {
    width: 100%;
    height: 100%;
    border-radius: 6px;
    background-repeat: no-repeat;
    background-size: cover;
}

.form-profile-seller .btn-submit {
    background: var(--color-main);
    border-color: var(--color-main);
    border-radius: 0.8rem;
}

.page-detail-seller .header-seller {
    border-bottom: 1px solid #D4D4D4;
    padding: 3rem 0;
}

.page-detail-seller .header-seller .row {
    align-items: center;
}

.page-detail-seller .header-seller .company-info {
    display: flex;
    align-items: center;
}

.page-detail-seller .header-seller .company-info .inner-logo {
    flex: 0 0 13rem;
    max-width: 13rem;
}

.page-detail-seller .header-seller .company-info .inner-info {
    flex: 0 0 calc(100% - 13rem);
    max-width: calc(100% - 13rem);
    padding-left: 2rem;
}

.page-detail-seller .header-seller .company-info .inner-logo > img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.page-detail-seller .header-seller .company-info .inner-info .company-name {
    font-size: 2.4rem;
    font-weight: 700;
    line-height: 3.2rem;
    color: #103460;
    text-decoration: none;
}

.page-detail-seller .header-seller .company-info .inner-info .company-list {
    margin: 1rem 0;
}

.page-detail-seller .text-dxm-detail {
    font-weight: 700;
    color: #103460;
    font-size: 1.6rem;
}

.page-detail-seller .text-dxm-colo {
    color: #103460;
}

.page-detail-seller .header-seller .company-info .inner-info .company-list ul {
    padding: 0;
    margin: 0;
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 2rem;
}

.page-detail-seller .header-seller .action {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 1rem;
}

.page-detail-seller .header-seller .action .btn {
    background: var(--color-main);
    width: 19.5rem;
    border-radius: 0.8rem;
    color: #fff;
    font-size: 1.6rem;
}

.page-detail-seller .header-seller .action .btn.btn-chat-now {
    border: 1px solid #103460;
    background: #fff;
    color: var(--color-main);
}

.content-seller .tab-seller .nav-tabs .nav-link {
    background: transparent;
    padding: 1.5rem 0 1.5rem 0;
    border: 0;
    font-size: 1.8rem;
    font-weight: 400;
    line-height: 2.6rem;
    color: #595F72;
    position: relative;
    margin-bottom: 1rem;
}

.content-seller .tab-seller .nav-tabs {
    gap: 4rem;
    border: 0;
}

.content-seller .tab-seller .nav-tabs .nav-link.active {
    color: #103460;
    font-weight: 600;
}

.content-seller .tab-seller .nav-tabs .nav-link:before {
    content: "";
    position: absolute;
    bottom: 1rem;
    left: 0;
    right: 0;
    width: 100%;
    height: 3px;
    background: transparent;
}

.content-seller .tab-seller .nav-tabs .nav-link.active:before, .content-seller .tab-seller .nav-tabs .nav-link:hover:before {
    background: var(--color-main);
}

.content-seller .profile-seller .banner img {
    width: 100%;
    height: 57rem;
    object-fit: cover;
}

.content-seller .profile-seller .banner .swiper-button-next, .content-seller .profile-seller .banner .swiper-button-prev {
    background: #000;
    opacity: 70%;
    color: #fff;
    width: 3rem;
    height: 13rem;
}

.content-seller .profile-seller .banner .swiper-button-next {
    right: 0;
}

.content-seller .profile-seller .banner .swiper-button-prev {
    left: 0;
}

.content-seller .profile-seller .description {
    margin: 4rem 0;
    text-align: justify;
    line-height: 2.6rem;
}

.content-seller .profile-seller .description .title {
    color: #103460;
    font-size: 1.8rem;
    font-weight: 700;
    margin-bottom: 1.5rem;
}

.content-seller .profile-seller .parameter > .row {
    align-items: center;
    margin-left: -3rem;
    margin-right: -3rem;
}

.content-seller .profile-seller .parameter > .row > div[class*="col-"] {
    padding-left: 3rem;
    padding-right: 3rem;
}

.content-seller .profile-seller .parameter .video {
    position: relative;
    padding-top: 57%;
}

.content-seller .profile-seller .parameter .video > iframe {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    border-radius: 1.5rem;
}

.content-seller .profile-seller .parameter .list {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    row-gap: 3rem;
}

.content-seller .profile-seller .parameter .list .item {
    flex: 0 0 calc(100% / 3 - 2rem);
    text-align: left;
    color: #000;
    font-size: 1.4rem;
    font-weight: 400;
    line-height: 2.4rem;
}

.content-seller .profile-seller .parameter .list .item .value {
    font-size: 1.6rem;
    font-weight: 500;
}

.content-seller .profile-seller .parameter .list .item .icon {
    margin-bottom: 1.5rem;
}

.content-seller .profile-seller .certification {
    margin: 6rem 0;
}

.content-seller .profile-seller .products-featured {
    margin-top: 4rem;
}

.content-seller .profile-seller .certification .list {
    background: linear-gradient(266.61deg, rgb(33 136 96 / 64%) 2.17%, #F7F8F8 45.74%);
    box-shadow: 0px 4px 4px 0px #00000040;
    padding: 3rem 4rem 2rem;
    border-radius: 0.8rem;
}

.content-seller .profile-seller .certification .title, .content-seller .profile-seller .products-featured .title {
    font-size: 3.2rem;
    font-weight: 700;
    line-height: 4rem;
    text-align: center;
    color: #103460;
    text-transform: uppercase;
    margin-bottom: 3rem;
}

.content-seller .profile-seller .certification .list .icon {
    position: relative;
    padding-top: 47%;
    background: #fff;
    margin: 0 auto;
    border-radius: 0.8rem;
    margin-bottom: 1.5rem;
    max-width: 22rem;
}

.content-seller .profile-seller .certification .list .item .icon > img {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    object-fit: contain;
    padding: 2rem;
}

.content-seller .profile-seller .certification .list .item {
    text-align: center;
}

.content-seller .profile-seller .certification .list .item .name {
    font-size: 1.8rem;
    font-weight: 600;
    line-height: 2.6rem;
    color: #24262D;
    text-transform: capitalize;
}

.content-seller .profile-seller .certification .list .item .file > a {
    font-size: 1.4rem;
    font-weight: 300;
    font-style: italic;
    color: #000000;
    text-decoration: underline;
}

.album-seller .box-album {
    padding: 3rem;
    background: #fff;
    border-radius: 0.8rem;
    margin: 2rem 0;
}

.album-seller .box-album .list .swiper-button-next, .album-seller .box-album .list .swiper-button-prev, .product-image-detail-top .swiper-button-next, .product-image-detail-top .swiper-button-prev {
    background: #000;
    opacity: 70%;
    color: #fff;
    width: 3rem;
    height: 13rem;
}

.album-seller .box-album .list .swiper-button-next, .product-image-detail-top .swiper-button-next {
    right: 0;
}

.album-seller .box-album .list .swiper-button-prev, .product-image-detail-top .swiper-button-prev {
    left: 0;
}

.album-seller .box-album .title {
    font-size: 2.4rem;
    line-height: 2.6rem;
    font-weight: 600;
    color: #103460;
    margin-bottom: 2rem;
}

.album-seller .box-album .list .image {
    position: relative;
    padding-top: 61%;
}

.album-seller .box-album .list .image > img {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 0.8rem;
}

.content-seller .contact-seller {
    background: #fff;
    border-radius: 0.8rem;
    margin: 2rem 0;
}

.content-seller .contact-seller .header-title, .content-seller .contact-seller .footer-contact {
    font-size: 2.4rem;
    line-height: 2.6rem;
    font-weight: 700;
    color: #103460;
    padding: 3rem 4rem;
}

.content-seller .contact-seller .contact {
    background: var(--color-main);
    color: #fff;
}

.content-seller .contact-seller .contact .row-contact {
    padding: 3rem 4rem;
    border-bottom: 1px solid #B18686;
}

.content-seller .contact-seller .contact .row-contact:last-child {
    border-bottom: 0
}

.content-seller .contact-seller .contact .row-contact .item-contact > ul {
    padding: 0;
    margin: 0;
    list-style: none;
}

.content-seller .contact-seller .contact .row-contact .item-contact > ul > li {
    display: flex;
    flex-direction: column;
    margin-bottom: 2rem;
    row-gap: 1rem;
}

.content-seller .contact-seller .contact .row-contact .item-label {
    display: flex;
    align-items: center;
    gap: 1rem;
    font-size: 1.8rem;
    line-height: 2.6rem;
}

.content-seller .contact-seller .contact .row-contact .item-contact > ul > li > .value {
    font-weight: 700;
}

.content-seller .contact-seller .footer-contact {
    display: flex;
    gap: 1rem;
    font-size: 1.6rem;
    color: #3F424E;
}

.content-seller .contact-seller .footer-contact .address .label {
    font-size: 2rem;
    color: #103460;
    line-height: 2.6rem;
    font-weight: 600;
    margin-bottom: 1rem;
}

.modal-member .form-element .form-group label.custom-file-label {
    display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
}

#member-register .bootstrap-select>.dropdown-toggle {
    height: 44px;
}

.landing-header-menu > .container > .row > div[class*=col-] {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.landing-header-menu .language-switch {
    padding: 0.7rem 1rem;
    border: 1px solid #FFFFFF80;
    border-radius: 0.8rem;
    background: #F5F5F51A;
}

.landing-header-menu .language-switch .language-picker:before {
    display: none;
}

.landing-product .title-section {
    font-size: 4rem;
    line-height: 100%;
    color: #103460;
    font-weight: 600;
    margin-bottom: 3rem;
}

.box-contact-us {
    background: #fff;
    border-radius: 1.5rem;
    padding: 5rem 10rem;
    margin: 2rem 0 6rem;
}

.box-contact-us .header-title {
    display: flex;
    align-items: center;
    gap: 1.5rem;
    line-height: 100%;
    margin-bottom: 3rem;
}

.box-contact-us .header-title > img {
    height: 3rem;
}

.box-contact-us .header-title .title {
    font-size: 3.2rem;
    font-weight: 500;
    line-height: 100%;
    color: #0F3556;
}

.box-contact-us .form-input .form-group label {
    font-size: 1.8rem;
    line-height: 2.4rem;
    font-weight: 600;
    color: #0F3556;
    margin-bottom: 1rem;
}

.box-contact-us .form-input .form-group .form-control {
    height: 4.4rem;
}

.box-contact-us .form-input .form-group textarea.form-control {
    height: 23rem;
}

.box-contact-us .form-input .form-group .btn-submit {
    background: #103460;
    border: 0;
    border-radius: 0.8rem;
    font-size: 2rem;
    line-height: 2.2rem;
    height: 4.6rem;
    display: inline-flex;
    align-items: center;
    padding: 0.5rem 3rem;
}

/* Profile Info Layout Styles */
.box-profile .profile-info-layout {
    margin: 0;
    gap: 0;
}

.box-profile .profile-info-layout .profile-info-left {
    padding: 0;
}

.box-profile .profile-info-layout .profile-info-right {
    padding: 0;
}

.box-profile .profile-info-layout .profile-info-panel {
    background: #103460;
    color: #fff;
    padding: 2rem;
    border-radius: 8px;
    min-height: 100%;
    display: flex;
    flex-direction: column;
}

.box-profile .profile-info-layout .profile-avatar-section {
    text-align: center;
    margin-bottom: 3rem;
}

.box-profile .profile-info-layout .profile-avatar-section .avatar-display {
    display: flex;
    justify-content: center;
}

.box-profile .profile-info-layout .profile-avatar-section .avatar-circle {
    width: 12rem;
    height: 12rem;
    border-radius: 50%;
    background-color: #fff;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    border: 0.4rem solid #fff;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    margin: 0;
}

.box-profile .profile-info-layout .profile-info-item {
    margin-bottom: 2.5rem;
    padding-bottom: 2rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}

.box-profile .profile-info-layout .profile-info-item:last-child {
    border-bottom: none;
    margin-bottom: 0;
    padding-bottom: 0;
}

.box-profile .profile-info-layout .profile-info-label {
    font-size: 1.4rem;
    color: rgba(255, 255, 255, 0.8);
    margin-bottom: 0.8rem;
    font-weight: 400;
}

.box-profile .profile-info-layout .profile-info-value {
    font-size: 1.6rem;
    color: #fff;
    font-weight: 500;
    word-break: break-word;
}

.box-profile .profile-info-layout .profile-info-right {
    background: #fff;
    padding: 0 3rem;
    border-radius: 0 8px 8px 0;
}

.box-profile .profile-info-layout .profile-info-right .form-group {
    margin-bottom: 2rem;
}

.box-profile .profile-info-layout .profile-info-right .form-group label {
    font-size: 1.4rem;
    font-weight: 600;
    color: #333;
    margin-bottom: 0.8rem;
    display: block;
}

.box-profile .profile-info-layout .profile-info-right .form-group label .required {
    color: #dc3545;
    margin-left: 3px;
}

.box-profile .profile-info-layout .profile-info-right .form-control {
    height: 44px;
}

.box-profile .profile-info-layout .profile-info-right .form-control:focus {
    border-color: #103460;
    box-shadow: 0 0 0 0.2rem rgba(16, 52, 96, 0.25);
}

.box-profile .profile-info-layout .avatar-upload-wrapper {
    margin-bottom: 1rem;
}

.box-profile .profile-info-layout .avatar-upload {
    position: relative;
    display: inline-block;
    width: 120px;
    height: 120px;
    overflow: unset;
}

.box-profile .profile-info-layout .avatar-upload .avatar-edit {
    position: absolute;
    right: 0;
    bottom: 0;
    z-index: 1;
}

.box-profile .profile-info-layout .avatar-upload .avatar-edit input {
    display: none;
}

.box-profile .profile-info-layout .avatar-upload .avatar-edit label {
    display: inline-block;
    width: 34px;
    height: 34px;
    margin-bottom: 0;
    border-radius: 50%;
    background: #103460;
    border: 2px solid #fff;
    box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.12);
    cursor: pointer;
    font-weight: normal;
    transition: all 0.2s ease-in-out;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 1.2rem;
}

.box-profile .profile-info-layout .avatar-upload .avatar-edit label:hover {
    background: #0d2a4a;
}

.box-profile .profile-info-layout .avatar-upload .avatar-preview {
    width: 120px;
    height: 120px;
    position: relative;
    border-radius: 50%;
    border: 4px solid #f0f0f0;
    box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.1);
    overflow: hidden;
}

.box-profile .profile-info-layout .avatar-upload .avatar-preview > div {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}

.box-profile .profile-info-layout .form-actions {
    display: flex;
    gap: 1.5rem;
    justify-content: flex-end;
    margin-top: 2rem;
    margin-bottom: 0;
}

.box-profile .profile-info-layout .form-actions .btn {
    padding: 1rem 2.5rem;
    font-size: 1.4rem;
    font-weight: 500;
    border-radius: 6px;
    display: inline-flex;
    align-items: center;
    gap: 0.8rem;
    transition: all 0.3s ease;
}

.box-profile .profile-info-layout .form-actions .btn i {
    font-size: 1.4rem;
}

.box-profile .profile-info-layout .form-actions .btn-submit, .box-profile .profile-info-layout .form-actions .btn-change-password {
    background-color: #103460;
    border-color: #103460;
    color: #fff;
}

.box-profile .profile-info-layout .form-actions .btn-submit:hover, .box-profile .profile-info-layout .form-actions .btn-change-password:hover {
    background-color: #0d2a4a;
    border-color: #0d2a4a;
    color: #fff;
}

@media (max-width: 991px) {
    .box-profile .profile-info-layout .profile-info-panel {
        border-radius: 8px 8px 0 0;
        margin-bottom: 0;
    }

    .box-profile .profile-info-layout .profile-info-right {
        border-radius: 0 0 8px 8px;
    }

    .box-profile .profile-info-layout .profile-info-item {
        margin-bottom: 2rem;
        padding-bottom: 1.5rem;
    }
}

@media (max-width: 767px) {
    .box-profile .profile-info-layout .profile-info-panel, .box-profile .profile-info-layout .profile-info-right {
        padding: 2rem;
    }

    .box-profile .profile-info-layout .profile-avatar-section .avatar-circle, .box-profile .profile-info-layout .avatar-upload, .box-profile .profile-info-layout .avatar-upload .avatar-preview {
        width: 100px;
        height: 100px;
    }

    .box-profile .profile-info-layout .form-actions {
        flex-direction: column;
    }

    .box-profile .profile-info-layout .form-actions .btn {
        width: 100%;
        justify-content: center;
    }
}

/* RFQ News Styles */
.rfq-news-card {
    border: 1px solid #dee2e6;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
    transition: box-shadow 0.3s ease;
    margin-bottom: 2rem;
}

.rfq-news-card:hover {
    box-shadow: 0 4px 8px rgba(0,0,0,0.15);
}

.rfq-news-card .rfq-news-header h5 {
    color: #ff6b35;
    font-size: 18px;
    font-weight: 700;
}

.rfq-news-card .card-body {
    padding: 20px;
}

.rfq-news-card .border-top {
    border-top: 1px solid #dee2e6 !important;
    margin-top: 15px;
    padding-top: 15px;
}

.rfq-news-card .text-muted {
    color: #6c757d;
    font-size: 14px;
}

.rfq-news-card .btn-primary {
    background-color: #103460;
    border-color: #103460;
    border-radius: 6px;
    padding: 8px 20px;
    font-size: 14px;
}

.rfq-news-card .btn-primary:hover {
    background-color: #0d2a4a;
    border-color: #0d2a4a;
}

.box-sidebar {
    background: #fff;
    padding: 1.2rem;
    border-radius: 0.8rem;
    position: sticky;
}

.box-sidebar .title-sidebar {
    font-size: 1.6rem;
    font-weight: 700;
    color: #103460;
    line-height: 2.4rem;
}

.box-sidebar .item-filter {
    margin-bottom: 2rem;
}

.box-sidebar .item-filter .title-filter {
    font-size: 1.6rem;
    font-weight: 600;
    color: #103460;
    margin-bottom: 1.2rem;
}

.box-sidebar .item-filter .content-filter {
    max-height: 20rem;
    overflow-y: auto;
    padding-right: 0.5rem;
}

.box-sidebar .item-filter .content-filter::-webkit-scrollbar {
    width: 0.6rem;
}

.box-sidebar .item-filter .content-filter::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 0.3rem;
}

.box-sidebar .item-filter .content-filter::-webkit-scrollbar-thumb {
    background: #888;
    border-radius: 3px;
}

.box-sidebar .item-filter .content-filter::-webkit-scrollbar-thumb:hover {
    background: #555;
}

.box-sidebar .form-check {
    margin-bottom: 8px;
}

.box-sidebar .form-check-label {
    font-size: 14px;
    color: #333;
    cursor: pointer;
}

.box-sidebar .form-check-input {
    cursor: pointer;
}

.box-sidebar .input-group-text {
    background-color: #f8f9fa;
    border-right: none;
}

.box-sidebar .form-control {
    border-left: none;
}

.box-sidebar .btn-primary {
    background-color: #103460;
    border-color: #103460;
    border-radius: 6px;
    padding: 10px 20px;
    font-weight: 600;
}

.box-sidebar .btn-primary:hover {
    background-color: #0d2a4a;
    border-color: #0d2a4a;
}

.box-sidebar .categories-section li {
    margin-bottom: 0;
}

.box-sidebar .categories-section li a {
    padding: 1rem 0;
    display: block;
    width: 100%;
    color: var(--color-main);
}

.form-group.form-check-register-seller {
    padding: 0.4rem 0.8rem;
    background: linear-gradient(90deg, #0C4487 55.77%, #FFFFFF 96.15%);
    border-radius: 0.8rem;
    color: #fff;
}

.static-list .list-item .top-title.top-title-rfq {
    justify-content: flex-start;
}

.dropdown-member .dropdown-menu, .action-rfq .dropdown-menu {
    padding: 0;
    border-radius: 0.6rem;
}

.dropdown-member .dropdown-menu .dropdown-item, .action-rfq .dropdown-menu .dropdown-item {
    padding: 0.5rem 1rem;
    border-bottom: 1px dashed #d0d0d0;
    display: flex;
    align-items: center;
    gap: 0.8rem;
}

.dropdown-member .dropdown-menu .dropdown-item:last-child, .action-rfq .dropdown-menu .dropdown-item:last-child {
    border-bottom: 0;
}

.dropdown-member .dropdown-menu .dropdown-item > svg, .action-rfq .dropdown-menu .dropdown-item > svg {
    width: 2rem;
    height: 2rem;
}

.dropdown-member .dropdown-menu .dropdown-item > svg > path, .action-rfq .dropdown-menu .dropdown-item > svg > path {
    stroke: #103460;
}

.form-list-product .form-group .form-control, .form-list-rfq .form-group .form-control {
    height: 4rem;
}

.list-rfq-element table thead th {
    font-size: 1.8rem;
    font-weight: 600;
    border-bottom: 1px solid #EAE9E9;
    padding: 1.6rem 1.5rem;
    border-top: 0;
    color: black;
}

.list-rfq-element {
    border: 1px solid #EAE9E9;
    border-radius: 0.8rem;
}

.list-rfq-element table tbody td {
    padding: 1rem;
    vertical-align: middle;
}

.list-rfq-element table {
    margin-bottom: 0;
    font-size: 1.4rem;
    color: #103460;
    line-height: 2.2rem;
}

.list-rfq-element table tbody td .type-request {
    margin-bottom: 1.5rem;
    font-weight: 700;
}

.list-rfq-element table tbody td .type-request a {
    color: #103460;
}

.list-rfq-element table tbody .action-rfq .dropdown-toggle:after {
    display: none;
}

.box-member .action-right .btn-list-rfq, .box-member .action-right .btn-refresh-rfq {
    background: #103460;
    border-radius: 0.6rem;
    height: 3.3rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 0;
}

.box-member .action-right {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.box-rfq-detail .box-header-info {
    border: 1px solid #EAE9E9;
    border-radius: 0.6rem;
}

.box-rfq-detail .box-header-info .title-info {
    font-size: 1.8rem;
    line-height: 2.6rem;
    font-weight: 600;
    padding: 1rem 2rem;
    border-bottom: 1px solid #EAE9E9;
}

.box-rfq-detail .box-header-info .header-content {
    padding: 1rem 2rem;
}

.box-rfq-detail .box-header-info .header-content .item {
    display: flex;
    align-items: center;
    padding: 1rem 0;
}

.box-rfq-detail .box-header-info .header-content .item .item-label {
    width: 18rem;
    font-size: 1.4rem;
    color: #103460;
}

.box-rfq-detail .box-header-info .header-content .item .item-value {
    font-size: 1.4rem;
    font-weight: 700;
    color: #103460;
}

.box-rfq-detail .box-header-info .header-content .item.item-product {
    flex-direction: column;
    align-items: flex-start;
    gap: 1rem;
}

/* RFQ Detail - Layout mÃ¡Â»â€ºi theo hÃƒÂ¬nh Ã¡ÂºÂ£nh */
.box-rfq-detail .rfq-title-header {
    border-bottom: 2px solid #EAE9E9;
    padding-bottom: 2rem;
    margin-bottom: 3rem;
}

.box-rfq-detail .rfq-main-title {
    font-size: 2.4rem;
    font-weight: 700;
    color: #103460;
    text-transform: uppercase;
    margin-bottom: 1rem;
    line-height: 1.4;
}

.box-rfq-detail .rfq-main-title .product-title {
    color: #F67B00;
    text-transform: none;
}

.box-rfq-detail .rfq-date {
    font-size: 1.4rem;
    color: #6F788A;
    display: flex;
    align-items: center;
}

/* ThÃƒÂ´ng tin ngÃ†Â°Ã¡Â»Âi mua */
.box-rfq-detail .box-buyer-info {
    background: #F7F8F8;
    border-radius: 0.8rem;
    padding: 2rem;
    margin-bottom: 3rem;
}

.box-rfq-detail .section-header {
    font-size: 1.8rem;
    font-weight: 700;
    color: #103460;
    margin-bottom: 1.5rem;
    display: flex;
    align-items: center;
    text-transform: uppercase;
}

.box-rfq-detail .buyer-info-content .info-item {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
}

.box-rfq-detail .buyer-info-content .info-label {
    font-weight: 700;
    color: #103460;
    min-width: 12rem;
    flex-shrink: 0;
}

.box-rfq-detail .buyer-info-content .info-value {
    color: #0F3556;
    flex: 1;
}

.box-rfq-detail .buyer-info-content .info-value a {
    color: #103460;
    text-decoration: none;
    transition: color 0.3s;
}

.box-rfq-detail .buyer-info-content .info-value a:hover {
    color: var(--color-main);
    text-decoration: underline;
}

/* Chi tiÃ¡ÂºÂ¿t yÃƒÂªu cÃ¡ÂºÂ§u */
.box-rfq-detail .box-request-details {
    background: #fff;
    border: 1px solid #EAE9E9;
    border-radius: 0.8rem;
    padding: 2.5rem;
}

.box-rfq-detail .request-details-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 1.5rem;
    margin-top: 2rem;
}

.box-rfq-detail .request-details-grid .detail-item {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    padding: 1.5rem;
    background: #F7F8F8;
    border-radius: 0.6rem;
    border-left: 3px solid var(--color-main);
}

.box-rfq-detail .request-details-grid .detail-label {
    font-weight: 700;
    color: #103460;
    font-size: 1.3rem;
    text-transform: uppercase;
}

.box-rfq-detail .request-details-grid .detail-value {
    color: #0F3556;
    font-size: 1.5rem;
    font-weight: 600;
    line-height: 1.6;
}

/* Ghi chÃƒÂº tÃ¡Â»Â« ngÃ†Â°Ã¡Â»Âi mua */
.box-rfq-detail .request-note {
    background: #F4F9FF;
    border-radius: 0.8rem;
    padding: 2rem;
    border-left: 4px solid var(--color-main);
}

.box-rfq-detail .request-note .note-title {
    font-size: 1.6rem;
    font-weight: 700;
    color: #103460;
    margin-bottom: 1.5rem;
    display: flex;
    align-items: center;
}

.box-rfq-detail .request-note .note-content {
    font-size: 1.4rem;
    line-height: 1.8;
    color: #0F3556;
    white-space: pre-wrap;
    word-wrap: break-word;
}

/* HÃƒÂ¬nh Ã¡ÂºÂ£nh sÃ¡ÂºÂ£n phÃ¡ÂºÂ©m */
.box-rfq-detail .request-image {
    margin-top: 2rem;
}

.box-rfq-detail .request-image .image-title {
    font-size: 1.6rem;
    font-weight: 700;
    color: #103460;
    display: flex;
    align-items: center;
}

.box-rfq-detail .product-image-wrapper {
    margin-top: 1rem;
}

.box-rfq-detail .product-image-wrapper .image-preview {
    position: relative;
    display: inline-block;
    border-radius: 0.8rem;
    overflow: hidden;
    max-width: 100%;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    transition: box-shadow 0.3s;
}

.box-rfq-detail .product-image-wrapper .image-preview:hover {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.box-rfq-detail .product-image-wrapper .image-preview img {
    width: 100%;
    height: auto;
    display: block;
    max-width: 600px;
    transition: transform 0.3s;
}

.box-rfq-detail .product-image-wrapper .image-preview:hover img {
    transform: scale(1.02);
}

.box-rfq-detail .product-image-wrapper .image-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: opacity 0.3s;
}

.box-rfq-detail .product-image-wrapper .image-preview:hover .image-overlay {
    opacity: 1;
}

.box-rfq-detail .product-image-wrapper .image-overlay i {
    color: #fff;
    font-size: 3rem;
}

@media (max-width: 768px) {
    .box-rfq-detail .rfq-main-title {
        font-size: 1.8rem;
    }

    .box-rfq-detail .request-details-grid {
        grid-template-columns: 1fr;
        gap: 1rem;
    }

    .box-rfq-detail .buyer-info-content .info-label {
        min-width: 10rem;
    }
}

.box-replies-content {
    border: 1px solid #EAE9E9;
    border-radius: 0.6rem;
    padding: 3rem 2rem;
    margin-top: 3rem;
}

.box-replies-content .box-replies {
    overflow-y: auto;
    max-height: 50rem;
    padding-right: 1rem;
}

.box-replies-content .box-replies .item {
    display: flex;
    margin-bottom: 4rem;
}

.box-replies-content .box-replies .item .avatar {
    flex: 0 0 10rem;
    max-width: 10rem;
    text-align: center;
}

.box-replies-content .box-replies .item .avatar > img {
    width: 6.6rem;
    height: 6.6rem;
    object-fit: cover;
    border-radius: 0.4rem;
}

.box-replies-content .box-replies .item .avatar .label-name {
    font-size: 1.4rem;
    margin-top: 1rem;
}

.box-replies-content .box-replies .item .info-request {
    flex: 0 0 calc(100% - 11rem);
    max-width: calc(100% - 11rem);
    background: #F7F8F8;
    border-radius: 0.6rem;
    padding: 2rem;
}

.box-replies-content .box-replies .item .info-request .fullname-time {
    display: flex;
    align-items: center;
    gap: 2rem;
    font-size: 1.4rem;
    color: #103460;
    margin-bottom: 1.5rem;
}

.box-replies-content .box-replies .item .info-request .fullname-time .fullname {
    font-weight: 700;
}

.box-replies-content .box-replies .item .info-request .request-content > ul {
    padding: 0;
    margin-bottom: 0.5rem;
    list-style: none;
}

.box-replies-content .box-replies .item .info-request .request-content > ul > li {
    font-size: 1.4rem;
    color: #103460;
    gap: 0.5rem;
    display: flex;
    align-items: center;
    padding-bottom: 0.5rem;
}

.box-replies-content .box-replies .item .info-request .request-attachment > label {
    font-weight: 500;
    font-size: 1.4rem;
    color: #103460;
}

.box-replies-content .box-replies .item .info-request .request-attachment .attachment-file {
    background: #8C95A44D;
    border-radius: 0.6rem;
    padding: 0.5rem;
    max-width: 28rem;
}

.box-replies-content .box-replies .item .info-request .request-attachment .attachment-file img {
    width: 4rem;
    height: 4rem;
    object-fit: cover;
}

.box-replies-content .box-reply-form .form-control-input {
    display: flex;
    align-items: center;
    height: 4.8rem;
}

.box-replies-content .box-reply-form .form-control-input .form-control {
    border: 0;
}

.box-replies-content .box-reply-form {
    border: 1px dashed #6F788A;
    border-radius: 0.6rem;
    margin-top: 4rem;
    padding: 2rem;
}

.box-replies-content .box-reply-form .form-control-textarea {
    display: flex;
    align-items: center;
    position: relative;
    height: 10rem;
    padding: 0;
}

.box-replies-content .box-reply-form .form-control-textarea textarea {
    height: 100%;
    width: 100%;
    border: 0;
    padding-left: 4rem;
}

.box-replies-content .box-reply-form .form-control-textarea > svg {
    position: absolute;
    top: 1.2rem;
    left: 1.2rem;
}

.box-replies-content .box-reply-form .btn {
    background: #103460;
    border-radius: 0.6rem;
    border: 0;
    font-size: 1.4rem;
}

/* CÃ¡ÂºÂ£i thiÃ¡Â»â€¡n giao diÃ¡Â»â€¡n RFQ Detail */
.box-rfq-detail .top-title {
    margin-bottom: 2rem;
}

.box-rfq-detail .badge-lg {
    font-size: 1.4rem;
    padding: 0.6rem 1.2rem;
    font-weight: 600;
}

.box-rfq-detail .info-section {
    padding: 1.5rem;
    background: #F7F8F8;
    border-radius: 0.6rem;
}

.box-rfq-detail .section-title {
    font-size: 1.6rem;
    font-weight: 700;
    color: #103460;
    display: flex;
    align-items: center;
}

.box-rfq-detail .item-label {
    display: flex;
    align-items: center;
    font-weight: 400;
}

.box-rfq-detail .item-label i {
    width: 1.6rem;
    text-align: center;
    color: #6F788A;
}

.box-rfq-detail .item-value a {
    color: #103460;
    text-decoration: none;
    transition: color 0.3s;
}

.box-rfq-detail .item-value a:hover {
    color: var(--color-main);
    text-decoration: underline;
}

.box-replies-content .title-section-replies {
    padding-bottom: 1.5rem;
    border-bottom: 2px solid #EAE9E9;
}

.box-replies-content .title-section-replies h5 {
    font-size: 1.8rem;
    font-weight: 700;
    color: #103460;
    display: flex;
    align-items: center;
}

.box-replies-content .box-replies .item {
    position: relative;
    padding-left: 2rem;
}

.box-replies-content .box-replies .item .timeline-line {
    position: absolute;
    left: 5rem;
    top: 8rem;
    bottom: -4rem;
    width: 2px;
    background: #EAE9E9;
}

.box-replies-content .box-replies .item:last-child .timeline-line {
    display: none;
}

.box-replies-content .box-replies .item .avatar-placeholder {
    width: 6.6rem;
    height: 6.6rem;
    background: #E3E3E3;
    border-radius: 0.4rem;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto;
}

.box-replies-content .box-replies .item .avatar-placeholder i {
    font-size: 2.4rem;
    color: #6F788A;
}

.box-replies-content .box-replies .item .avatar .label-name {
    margin-top: 0.8rem;
    font-size: 1.2rem;
    padding: 0.4rem 0.8rem;
    border-radius: 0.4rem;
}

.box-replies-content .box-replies .item .message-header {
    margin-bottom: 1.5rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid #E3E3E3;
}

.box-replies-content .box-replies .item .fullname-time {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 1rem;
}

.box-replies-content .box-replies .item .fullname-time .time {
    display: flex;
    align-items: center;
    color: #6F788A;
    font-size: 1.2rem;
}

.box-replies-content .box-replies .item .request-type-badge {
    margin-bottom: 1.5rem;
}

.box-replies-content .box-replies .item .request-details {
    font-size: 1.4rem;
    line-height: 1.8;
}

.box-replies-content .box-replies .item .detail-item {
    margin-bottom: 1rem;
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.box-replies-content .box-replies .item .detail-item .label {
    font-weight: 600;
    color: #103460;
    display: flex;
    align-items: center;
    min-width: 15rem;
}

.box-replies-content .box-replies .item .detail-item .value {
    color: #0F3556;
    flex: 1;
}

.box-replies-content .box-replies .item .content-text {
    white-space: pre-wrap;
    word-wrap: break-word;
    line-height: 1.8;
}

.box-replies-content .box-replies .item .quote-details {
    background: #F4F9FF;
    padding: 1.5rem;
    border-radius: 0.6rem;
}

.box-replies-content .box-replies .item .reply-title h6 {
    font-size: 1.6rem;
    font-weight: 700;
    color: #103460;
    display: flex;
    align-items: center;
}

.box-replies-content .box-replies .item .reply-message {
    background: #fff;
    padding: 1.5rem;
    border-radius: 0.6rem;
    border-left: 3px solid var(--color-main);
}

.box-replies-content .box-replies .item .request-attachment .image-preview {
    position: relative;
    display: inline-block;
    border-radius: 0.6rem;
    overflow: hidden;
    max-width: 30rem;
}

.box-replies-content .box-replies .item .request-attachment .image-preview img {
    width: 100%;
    height: auto;
    display: block;
    transition: transform 0.3s;
}

.box-replies-content .box-replies .item .request-attachment .image-preview:hover img {
    transform: scale(1.05);
}

.box-replies-content .box-replies .item .request-attachment .image-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: opacity 0.3s;
}

.box-replies-content .box-replies .item .request-attachment .image-preview:hover .image-overlay {
    opacity: 1;
}

.box-replies-content .box-replies .item .request-attachment .image-overlay i {
    color: #fff;
    font-size: 2.4rem;
}

.box-replies-content .box-reply-form h5 {
    font-size: 1.8rem;
    font-weight: 700;
    color: #103460;
    display: flex;
    align-items: center;
}

@media (max-width: 768px) {
    .box-replies-content .box-replies .item {
        padding-left: 1rem;
    }

    .box-replies-content .box-replies .item .timeline-line {
        left: 3.5rem;
    }

    .box-replies-content .box-replies .item .avatar {
        flex: 0 0 7rem;
        max-width: 7rem;
    }

    .box-replies-content .box-replies .item .info-request {
        flex: 0 0 calc(100% - 8rem);
        max-width: calc(100% - 8rem);
    }

    .box-rfq-detail .info-section {
        margin-bottom: 1.5rem;
    }
}

.overall-rating .col-rating {
    flex: 0 0 19%;
    max-width: 19%;
    text-align: left;
}

.overall-rating .col-star {
    flex: 0 0 55%;
    max-width: 55%;
}

.overall-rating .col-btn-rating {
    flex: 0 0 26%;
    max-width: 26%;
}

.overall-rating .col-btn-rating .btn {
    border-radius: 0.6rem;
    font-weight: 700;
    text-transform: capitalize;
}

.content-filter-product .item-filter .content-filter .inner-product-attribute.active .inner-switch > span:after {
    content: "\f00c";
    font-family: 'Font Awesome 6 Pro';
}

.content-filter-product .item-filter .content-filter .inner-product-attribute.active .inner-switch > span {
    background: var(--color-main);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
}

.content-filter-product .item-filter .content-filter .form-control, .content-filter-product .item-filter .content-filter .bootstrap-select>.dropdown-toggle {
    height: 3.8rem;
}

.page-list-seller > .container {
    width: 159rem;
    max-width: 159rem;
}

.page-list-seller > .container > .row > div[class*=col-]:first-child {
    flex: 0 0 29rem;
    max-width: 29rem;
}

.page-list-seller > .container > .row > div[class*=col-]:last-child {
    flex: 0 0 calc(100% - 29rem);
    max-width: calc(100% - 29rem);
}

.page-list-seller .content-filter-product {
    margin: 0;
}

.page-list-seller {
    margin-top: 3rem;
}

.section-tieu-chi .criterias {
    background: linear-gradient(90deg, rgba(178, 203, 255, 0.1) 0%, rgba(107, 122, 153, 0.1) 100%);
    border-radius: 1.5rem;
    padding: 4rem 3rem;
    margin-bottom: 7rem;
}

.section-tieu-chi .criterias .title {
    font-size: 4rem;
    font-weight: 600;
    color: #103460;
    margin-bottom: 4rem;
}

.section-tieu-chi .criterias .desc-short {
    font-size: 3.6rem;
    font-weight: 700;
    color: #F67B00;
    line-height: 4rem;
    margin-bottom: 3rem;
}

.section-tieu-chi .criterias .desc {
    font-size: 2.4rem;
    line-height: 4rem;
    text-align: justify;
    font-style: italic;
}

.section-tieu-chi .criterias .list {
    margin-top: 4.5rem;
}

.section-tieu-chi .criterias .list .item .content-list {
    background: #fff;
    border-radius: 0.8rem;
    padding: 4rem 3rem;
    text-align: left;
    margin-top: 2.5rem;
    height: 100%;
}

.section-tieu-chi .criterias .list > .row {
    margin-left: -1rem;
    margin-right: -1rem;
}

.section-tieu-chi .criterias .list > .row > div[class*=col-] {
    padding-left: 1rem;
    padding-right: 1rem;
}

.section-tieu-chi .criterias .list .item {
    text-align: center;
    height: 100%;
    overflow: hidden;
}

.section-tieu-chi .criterias .item .icon img {
    /* width: 12rem; */
    /* object-fit: contain; */
}

.section-tieu-chi .criterias .list .item .name {
    font-size: 4rem;
    font-weight: 700;
    text-transform: uppercase;
    line-height: 100%;
    margin: 1.5rem 0;
    color: #6D4C2E;
}

.section-tieu-chi .criterias .list > .row > div[class*=col-]:nth-child(2) .item .name {
    color: #ABA8A8;
}

.section-tieu-chi .criterias .list > .row > div[class*=col-]:nth-child(3) .item .name {
    color: #F7B632;
}

.section-tieu-chi .criterias .list .item .sca {
    font-size: 3rem;
    line-height: 100%;
    color: #103460;
}

.section-tieu-chi .criterias .list .item .content-list .child-list {
    margin-bottom: 3rem;
}

.section-tieu-chi .criterias .list .item .content-list .child-list .title {
    font-size: 2.5rem;
    font-weight: 600;
    text-transform: uppercase;
    padding-bottom: 1rem;
    border-bottom: 1px solid #103460;
    margin-bottom: 2rem;
}

.section-tieu-chi .criterias .list .item .content-list .child-list > ul {
    margin-bottom: 0;
    padding-left: 2rem;
    font-size: 1.9rem;
    color: #103460;
}

.section-tieu-chi .criterias .list .item .content-list .child-list > ul > li {
    padding: 1.5rem 0;
}

.box-widget-chat {
    padding: 0;
}

.box-widget-chat .search-section {
    border: 0;
    border-radius: 0;
    height: auto;
    margin: 0;
    display: block;
}

.breadcrumbs-landing {
    height: 62rem;
    position: relative;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    padding-top: 19rem;
}

.breadcrumbs-landing:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    background: #0F3556CC;
}

.breadcrumbs-landing .slogan {
    border: 1px solid #FFFFFF80;
    border-radius: 100px;
    padding: 0.2rem 2rem 0.2rem 0.5rem;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: #fff;
    font-weight: 300;
}

.breadcrumbs-landing .slogan .icon img {
    height: 24px;
    width: auto;
    object-fit: contain;
}

.breadcrumbs-landing .title-main {
    text-align: center;
    font-size: 6rem;
    line-height: 5.5rem;
    font-weight: 700;
    color: #E8B34A;
    text-transform: uppercase;
    margin-top: 6rem;
    margin-bottom: 4rem;
}

.breadcrumbs-landing .breadcrumb-list {
    display: flex;
    align-items: center;
    justify-content: center;
}

.breadcrumbs-landing .breadcrumb-list a {
    color: #fff;
    font-size: 2rem;
    line-height: 2.4rem;
    font-weight: 500;
    padding-right: 2.5rem;
    margin-right: 1rem;
    position: relative;
}

.breadcrumbs-landing .breadcrumb-list a:before {
    content: "//";
    position: absolute;
    top: 0;
    right: 0;
}

.breadcrumbs-landing .breadcrumb-list a:last-child {
    padding-right: 0;
    margin-right: 0;
}

.breadcrumbs-landing .breadcrumb-list a:last-child:before {
    display: none;
}

.contact-infomation {
    position: relative;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    padding: 5rem;
    border-radius: 1rem;
    margin-bottom: 4rem;
}

.contact-infomation:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    background: #0F3556F2;
    border-radius: 1rem;
}

.contact-infomation .company-name, .contact-infomation .title-contact {
    font-size: 2.5rem;
    line-height: 4rem;
    font-weight: 500;
    color: #FFCC00;
    text-decoration: unset;
    position: relative;
    padding-bottom: 0.8rem;
    margin-bottom: 2rem;
    text-transform: uppercase;
}

.contact-infomation .company-name:before, .contact-infomation .title-contact:before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    width: 30rem;
    height: 0.2rem;
    background: #F6B400;
}

.contact-infomation .company .desc {
    font-size: 2.2rem;
    color: #fff;
    line-height: 3.5rem;
    font-weight: 300;
}

.contact-infomation .company {
    max-width: 75%;
}

.contact-infomation .list .item {
    display: flex;
    gap: 1rem;
    margin-bottom: 3rem;
    line-height: 3.5rem;
}

.contact-infomation .list .item .text {
    display: flex;
    flex-direction: column;
    font-size: 2.2rem;
    color: #fff;
    font-weight: 300;
}

.contact-infomation .list .item .text .label {
    font-size: 2.5rem;
    font-weight: 500;
    color: #FFCC00;
    margin-bottom: 1rem;
}

.contact-infomation .list .item a {
    color: #fff;
}

.page-new-cf {
    margin: 7rem 0 2rem;
}

.keyword-suggestions .list {
    display: flex;
    flex-direction: column;
}

.keyword-suggestions .list > a {
    color: #000;
    margin-bottom: 1.5rem;
}

.keyword-suggestions .list > a:last-child {
    margin-bottom: 0;
}

.keyword-suggestions .list {
    background: #D7D8DA33;
    border-radius: 0.8rem;
    padding: 2rem;
}

.filter-post-cf {
    border: 0.5rem solid #F6B400;
    border-radius: 1rem;
    margin-bottom: 4rem;
    padding-right: 0.5rem;
}

.filter-post-cf .form-control {
    border: 0;
}

.filter-post-cf .btn-submit-search-header {
    height: 3rem;
}

.filter-post-cf .input-group {
    align-items: center;
}

.keyword-suggestions .title {
    font-size: 2rem;
    font-weight: 500;
    margin-bottom: 2rem;
}

.box-business-profile .business-info {
    text-align: center;
}

.box-profile.box-business-profile .profile-info-layout .profile-avatar-section .avatar-circle {
    width: 10.6rem;
    height: 10.6rem;
}

.box-business-profile .business-info .company-name {
    font-size: 1.8rem;
    font-weight: 600;
    text-decoration: unset;
    line-height: 2.6rem;
    margin-bottom: 1rem;
}

.box-business-profile .business-taxcode {
    background: #fff;
    margin: 1.5rem 0;
    border-radius: 0.6rem;
    color: #000;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 1rem;
}

.box-business-profile .business-contact .item {
    display: flex;
    align-items: center;
    gap: 1.5rem;
    margin-bottom: 1.5rem;
}

.box-profile .profile-info-layout .profile-info-right .form-group label.invalid-feedback {
    color: #dc3545 !important;
    font-weight: 400;
}

.content-filter-rfq .form-check {
    display: inline-flex;
    width: 100%;
    align-items: center;
    color: #333;
    padding: 10px 0;
}

.content-filter-rfq .form-check > input {
    position: absolute;
    z-index: -1;
    opacity: 0;
}

.content-filter-rfq .form-check .form-check-label {
    cursor: pointer;
    width: 100%;
    display: flex;
    align-items: center;
    font-weight: 400;
}

.content-filter-rfq .item-filter .content-filter .input-group .input-group-text {
    border-top-left-radius: 0.6rem;
    border-bottom-left-radius: 0.6rem;
    border-right: 0;
    background: transparent;
}

.content-filter-rfq .form-check .form-check-label:hover .inner-switch > span, .content-filter-rfq .form-check input:checked + .form-check-label .inner-switch > span {
    background: var(--color-main);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
}

.content-filter-rfq .form-check .form-check-label:hover .inner-switch > span::after, .content-filter-rfq .form-check input:checked + .form-check-label .inner-switch > span::after {
    content: "\f00c";
    font-family: "Font Awesome 6 Pro";
    font-weight: 900;
    position: absolute;
    top: 0;
    left: 0;
    line-height: 1;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.rfq-news-list {
    margin-top: 1rem;
}

.rfq-news-list .rfq-news-header .title {
    color: #F67B00;
    font-size: 1.6rem;
    font-weight: 700;
    text-transform: uppercase;
}

.rfq-news-list .rfq-news-header {
    margin-bottom: 1rem;
}

.rfq-news-list .customer-item {
    display: flex;
    align-items: center;
    color: #0F3556;
    font-size: 1.4rem;
    line-height: 2.4rem;
}

.rfq-news-list .customer-item > span {
    font-weight: 700;
    margin-right: 0.5rem;
}

.rfq-news-list .customer-item > span > i {
    width: 2rem;
}

.rfq-news-list .box-rfq-detail {
    margin: 2rem 0;
}
.rfq-news-list .box-rfq-note {
    color: #4A5568;
    font-style: italic;
    margin-bottom: 1.5rem;
}

.rfq-news-list .box-rfq-detail .title-rfq-detail {
    font-weight: 700;
    text-transform: uppercase;
    font-size: 1.6rem;
    color: #103460;
    margin-bottom: 1rem;
}

.rfq-news-list .box-rfq-detail .detail-item {
    font-size: 1.4rem;
    color: #0F3556;
    line-height: 2.4rem;
    margin-bottom: 0.6rem;
}

.rfq-news-list .box-rfq-detail .detail-item > span {
    font-weight: 700;
}

.rfq-news-list .box-rfq-date {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.rfq-news-list .box-rfq-date .date {
    font-size: 1.4rem;
    font-weight: 400;
    color: #103460;
}

.rfq-news-list .box-rfq-date .view-detail {
    color: #103460;
    font-size: 1.4rem;
    font-style: italic;
}

.price-coffes {
    margin: 5rem 0;
}

.price-coffes .box-price {
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    position: relative;
    margin-bottom: 2rem;
    border-radius: 1rem;
    font-size: 2.5rem;
    line-height: 3rem;
    color: #fff;
    padding: 7rem;
}

.price-coffes .box-price:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    background: rgb(15 53 86 / 90%);
    border-radius: 1rem;
}

.price-coffes .box-price .title {
    font-size: 3rem;
    line-height: 3rem;
    font-weight: 600;
    color: #FFCC00;
    margin-bottom: 3rem;
}

.price-coffes .box-price .average-price {
    display: flex;
    flex-direction: column;
}

.price-coffes .box-price .average-price .value-unit {
    font-size: 4rem;
    line-height: 3rem;
    font-weight: 600;
    margin-top: 1.5rem;
    margin-bottom: 4rem;
    display: flex;
    align-items: center;
    gap: 1rem;
}

.price-coffes .box-price .table-price .sub-title {
    margin-bottom: 2rem;
    font-size: 2.5rem;
    line-height: 3rem;
}

.price-coffes .box-price .table-price .table {
    border: 0;
    color: #fff;
}

.price-coffes .box-price .table-price .table thead tr th {
    border-top: 0;
    border-bottom: 1px solid #fff;
    font-weight: 300;
    padding: 2rem 0;
    border-color: #FFFFFF80;
}

.price-coffes .box-price .table-price .table tr td {
    border-color: #FFFFFF80;
    padding: 2rem 0;
    font-weight: 500;
}

.price-coffes .box-price .table-price .table tr td:first-child {
    font-weight: 400;
}

.price-coffes .box-price .table-price .price-source {
    margin-bottom: 2rem;
    margin-top: 3rem;
    font-weight: 400;
}

.price-coffes .box-price .table-price .price-source > a {
    color: #fff;
    margin-left: 0.5rem;
    font-weight: 300;
}

.price-coffes .box-price .last-update {
    margin-bottom: 3rem;
}

.price-coffes .box-price .table-price .table tr td.plus {
    color: #34C759;
}

.price-coffes .box-price .table-price .table tr td.minus {
    color: #FF383C;
}
.sidebar-policy {
    background-image: linear-gradient(to right bottom, lab(98.1434 -0.369519 -1.05966) 0%, lab(96.286 -0.852436 -2.46847) 100%);
    border: 1px solid #e2e8f0;
    border-radius: 1.2rem;
    padding: 2rem;
}
.sidebar-policy .title-policy {
    color: var(--color-main);
    font-size: 1.4rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
}
.sidebar-policy .view-policy .item a {
    color: #45556c;
    display: flex;
    align-items: center;
    gap: 0.8rem;
    font-size: 1.4rem;
}
.sidebar-policy .view-policy .item a > svg {
    width: 1.2rem;
    height: 1.2rem;
}
#register-modal .modal-dialog.modal-lg {
    max-width: 800px;
}

.daterangepicker .drp-buttons .btn {
    border-radius: 0.4rem;
    border: 0;
}
.daterangepicker .drp-buttons .btn.applyBtn,
.daterangepicker .ranges li.active,
.daterangepicker td.active, .daterangepicker td.active:hover {
    background: var(--color-main) !important;
}
.bg-detail-article-right.detail-policy {
    padding: 5rem;
    color: #334155;
}

@media (max-width: 1680px) {
    html {
        font-size: 54.6875%;
    }
}

@media (max-width: 1440px) {
    html {
        font-size: 50%;
    }
}

@media (max-width: 1280px) {
    html {
        font-size: 48.67%;
    }
}

@media (max-width: 1024px) {
    html {
        /*font-size: 35.33%;*/
    }
}

@media (max-width: 768px) {
    html {
        font-size: 50%;
    }
}

@media (min-width: 1440px) and (max-width: 1680px) {
    .swiper-slider-landing .swiper-slide--wrap {
        left: calc(14% + 15px);
    }

    .section-promotion-pro > .container, .section-parameter > .container, .section-coffee-story > .container, .section-official-partner > .container, .section-tieu-chi > .container {
        max-width: 1400px;
        width: 100%;
    }

    .sidebar-rfq-new .list-item {
        overflow-y: auto;
        max-height: 76rem;
    }
}

@media (max-width: 1600px) {
    .swiper-slider-landing .swiper-slide--wrap {
        left: auto;
    }

    .section-promotion-pro > .container, .section-parameter > .container, .section-coffee-story > .container, .section-official-partner > .container, .section-tieu-chi > .container {
        max-width: 1340px;
    }
}

@media (min-width: 1280px) and (max-width: 1440px) {
    .container, .container-sm, .container-md, .container-lg, .container-xl {
        width: 1150px;
        max-width: 1150px;
    }

    .swiper-slider-landing .swiper-slide--wrap {
        left: auto;
    }

    .section-promotion-pro > .container, .section-parameter > .container, .section-coffee-story > .container, .section-official-partner > .container, .section-tieu-chi > .container {
        max-width: 1200px;
    }

    .sidebar-rfq-new .list-item {
        overflow-y: auto;
        max-height: 80.5rem;
    }
}

@media (max-width: 1366px) {
    .swiper-slider-landing .swiper-slide--wrap {
        left: auto;
    }

    .section-tieu-chi .criterias .list .item .content-list .child-list > ul {
        font-size: 1.8rem;
    }
}

@media (max-width: 767px) {
    .container, .container-sm, .container-md, .container-lg, .container-xl, .section-promotion-pro > .container, .section-parameter > .container, .section-coffee-story > .container, .section-official-partner > .container {
        max-width: 100%;
    }

    .swiper-slider-landing .swiper-slide--wrap {
        left: 1.5rem;
        max-width: calc(100% - 3rem);
        top: 50%;
    }

    .section-connect-support .list-support .item {
        padding: 2rem 1rem;
    }

    .section-connect-support .list-support > .row > div[class*="col-"] {
        margin-bottom: 15px;
    }

    .landing-header-menu {
        padding: 1rem 0;
    }

    .landing-header-menu .btn-menu-mobile {
        color: #fff;
    }

    .swiper-slider-main.swiper-slider-landing .swiper-slide > a > img {
        height: 65rem;
    }

    .section-value-brought .list-value .left, .section-value-brought .list-value .right, .section-value-brought .list-value .center, .section-official-partner .list-partner .item-partner .inner-image, .section-official-partner .list-partner .item-partner .inner-content, .box-footer-01 > .container > .row > div {
        flex: 0 0 100%;
        max-width: 100%;
    }

    .section-value-brought .list-value, .section-official-partner .list-partner .item-partner {
        flex-wrap: wrap;
    }

    .section-value-brought .list-value .item {
        margin-bottom: 3rem;
    }

    .section-value-brought .list-value .center {
        padding: 0 2rem;
        margin: 4rem 0;
    }

    .section-promotional-products .title-landing {
        font-size: 2.8rem;
    }

    .section-promotional-products .box-slogan, .section-official-partner .list-partner {
        padding: 4rem 2rem;
    }

    .section-promotional-products .box-slogan .title {
        font-size: 3rem;
    }

    .section-parameter {
        padding: 5rem 0;
    }

    .parameter .item {
        margin-bottom: 1rem;
    }

    .parameter .item .title {
        font-size: 2rem;
    }

    .section-coffee-story .inner-image {
        margin-top: 2rem;
    }

    .section-official-partner .list-partner .item-partner .inner-content {
        padding-left: 0;
        margin-top: 2rem;
    }

    .box-footer-01 > .container > .row > div {
        margin-bottom: 2rem;
    }

    .header-icon-mb {
        padding: 1rem 0;
        border-bottom: 1px solid #ffffff52;
    }

    .header-icon-mb>.container>.row>div[class*="col-"], .header-logo-mb>.container>.row>div[class*="col-"] {
        display: flex;
        align-items: center;
    }

    .header-icon-mb>.container>.row>div[class*="col-"]:first-child {
        justify-content: flex-start;
    }

    .header-icon-mb>.container>.row>div[class*="col-"]:last-child, .header-logo-mb>.container>.row>div[class*="col-"]:last-child {
        justify-content: flex-end;
        gap: 1rem;
    }

    .icon-header.icon-account {
        color: #fff;
    }

    .header-logo-mb {
        padding: 1rem 0;
    }

    .bottom-banner-slider .item-banner {
        flex-direction: column;
        height: 100%;
    }

    .bottom-banner-slider>.row>div[class*="col-"]:last-child {
        margin-top: 1rem;
    }

    .sidebar-rfq-new {
        margin-top: 2rem;
        height: auto;
    }

    .form-coffee-quotes {
        flex-direction: column;
        gap: 2rem;
    }

    .form-coffee-quotes .inner-text {
        padding-left: 0;
    }

    .box-price-info .item-price {
        flex-direction: column;
        gap: 1rem;
        align-items: flex-start;
        line-height: 4rem;
    }

    .box-price-info .item-price-info .info {
        align-items: flex-start;
        flex-direction: column;
    }

    .product-detail-head .product-content img {
        max-width: 100%;
        height: auto;
    }

    .page-detail-seller .header-seller .company-info .inner-logo {
        flex: 0 0 10rem;
        max-width: 10rem;
    }

    .page-detail-seller .header-seller .company-info .inner-info {
        flex: 0 0 calc(100% - 10rem);
        max-width: calc(100% - 10rem);
        padding-left: 2rem;
    }

    .page-detail-seller .header-seller .action {
        flex-wrap: nowrap;
        margin-top: 2rem;
        justify-content: flex-end;
        flex-direction: row;
    }

    .content-seller .tab-seller .nav-tabs {
        gap: 2rem;
    }

    .content-seller .profile-seller .banner img {
        height: 20rem;
    }

    .content-seller .profile-seller .parameter .list {
        margin-top: 3rem;
    }

    .content-seller .profile-seller .parameter .list .item {
        flex: 0 0 calc(100% / 2 - 2rem);
    }

    .album-seller .box-album {
        padding: 2rem;
    }

    .content-seller .contact-seller .contact .row-contact .item-label {
        margin-bottom: 2rem;
    }

    .header-search-mb {
        padding-bottom: 1rem;
    }

    .section-parameter .parameter {
        flex-wrap: wrap;
    }

    .parameter .item .number {
        font-size: 6rem;
        font-weight: 700;
        line-height: 1.2;
    }
}

/* Month Range Picker Styles */
.month-range-picker-wrapper {
    position: relative;
}

.month-range-input {
    cursor: pointer;
}

.month-range-picker {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 1000;
    background: #fff;
    border: 1px solid #e2e5ec;
    border-radius: 0.8rem;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    margin-top: 0.5rem;
    min-width: 300px;
    max-width: 100%;
}

@media (max-width: 576px) {
    .month-range-picker {
        left: auto;
        right: 0;
        min-width: 280px;
    }
}

.month-picker-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.5rem;
    border-bottom: 1px solid #e2e5ec;
}

.month-picker-title {
    font-size: 1.6rem;
    font-weight: 600;
    color: #333;
}

.month-picker-close {
    background: none;
    border: none;
    font-size: 2.4rem;
    color: #999;
    cursor: pointer;
    padding: 0;
    width: 2.4rem;
    height: 2.4rem;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
}

.month-picker-close:hover {
    color: #333;
}

.month-picker-body {
    padding: 1.5rem;
}

.month-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.8rem;
}

.month-item {
    padding: 1rem;
    text-align: center;
    border: 1px solid #e2e5ec;
    border-radius: 0.6rem;
    cursor: pointer;
    font-size: 1.4rem;
    color: #666;
    transition: all 0.2s ease;
    user-select: none;
}

.month-item:hover {
    background-color: #f5f5f5;
    border-color: #0f3556;
}

.month-item.selected {
    background-color: #0f3556;
    color: #fff;
    border-color: #0f3556;
}

.month-item.in-range {
    background-color: #e3f2fd;
    color: #0f3556;
    border-color: #90caf9;
}

.month-picker-footer {
    display: flex;
    justify-content: flex-end;
    gap: 1rem;
    padding: 1.5rem;
    border-top: 1px solid #e2e5ec;
}

.month-picker-footer .btn {
    padding: 0.8rem 2rem;
    font-size: 1.4rem;
    border-radius: 0.6rem;
}

.box-member.box-add-product .form-product .wrap-album .btn-success, .box-member.box-add-product .wrap-files .btn-success {
    background-color: #103460;
    border-color: #103460;
}

.form-profile-seller .form-group .form-control::placeholder {
    color: #6F788A80;
}

.box-member form.form-profile-seller .form-group .form-control:placeholder {
    color: #6F788A80 !important;
}

.box-member form.form-profile-seller .form-group .form-control {
    color: black !important;
}

.text-thu-hut-kh > span {
    color: #6F788A80;
    font-style: italic;
    font-size: 1.6rem;
}

.text-thu-hut-kh {
    margin-bottom: 1.5rem;
}

.icon-giay-phep-form-seler {
    display: flex;
    align-items: flex-start;
}

.cus-seler-icon-giay-phep {
    margin-bottom: 0.5rem;
}

.css-border-bc-atrr-cl {
    padding: 10px 15px 15px;
    border: 1px solid #dee2e6;
    margin-bottom: 15px;
    border-radius: 6px;
}

.gia-mo-doi-header {
    color: #b5b5b6;
    font-size: 1.4rem;
    margin-left: 4px;
}

@media (min-width: 1200px) and (max-width: 1700px) {
    .header-menu .search-section .form-search .input-group .form-control {
        min-width: 23rem;
    }
}

@media (min-width: 1400px) and (max-width: 1700px) {
    .header-menu>.container>.row>div:nth-child(1) {
        flex: 0 0 63%;
        max-width: 63%;
    }

    .header-menu>.container>.row>div:nth-child(2) {
        flex: 0 0 37%;
        max-width: 37%;
    }
}

@media (min-width: 1200px) {
    .product-content-page-ctsp img {
        width: 100%;
        height: 57rem;
        object-fit: cover;
    }

    .product-content-page-ctsp .swiper-button-next, .product-content-page-ctsp .swiper-button-prev {
        background: #000;
        opacity: 70%;
        color: #fff;
        width: 3rem;
        height: 13rem;
    }

    .product-content-page-ctsp .swiper-button-next {
        right: 0;
    }

    .product-content-page-ctsp .swiper-button-prev {
        left: 0;
    }
        
    .sticky-top.sticky-top-stbv-page {
        top: 7rem;
        z-index: 2;
    }
}

@media (max-width: 767px) {
    .header-search-mb form.form-search {
        display: flex;
        align-items: center;
    }

    .header-search-mb .search-section {
        background-color: white;
        border-radius: 5px;
    }

    .topbar-section ul.topbar-dropdown {
        left: auto;
        right: 0;
    }

    .product-item .action-bottom > .btn {
        padding: 0.2rem;
    }

    .section-official-partner .list-partner .item-partner .inner-image > img {
        height: auto;
    }

    .page-list-seller > .container > .row > div[class*=col-]:first-child {
        flex: 0 0 100%;
        max-width: 100%;
    }

    .page-list-seller > .container > .row > div[class*=col-]:last-child {
        flex: 0 0 calc(100%);
        max-width: calc(100%);
    }

    .page-list-seller > .container {
        width: 100%;
        max-width: 100%;
    }
}

@media (max-width: 968px) {
    .layout-member>.container>.row>div[class*="col-"]:first-child {
        flex: 0 0 100%;
        max-width: 100%;
    }

    .layout-member>.container>.row>div[class*="col-"]:last-child {
        flex: 0 0 100%;
        max-width: 100%;
    }

    .static-list .list-item .top-title {
        margin-top: 1.5rem;
    }

    .list-product-element .table-rounded tbody tr {
        margin-bottom: 3rem;
    }

    .form-list-rfq .list-rfq-element {
        overflow-y: scroll;
    }

    .swiper-slider-landing .swiper-slide--wrap .swiper-slide--tile {
        line-height: 4.5rem;
        margin: 3rem 0 2rem;
    }

    .box-contact-us {
        padding: 4rem 2rem;
    }

    .section-tieu-chi .criterias {
        padding: 3rem 2rem;
        margin-bottom: 5rem;
    }
}

@media (min-width: 968px) and (max-width: 1024px) {
    .header-menu .search-section .form-search .input-group .form-control {
        min-width: 8rem;
    }

    .page-list-seller > .container > .row > div[class*=col-]:first-child {
        flex: 0 0 15%;
        max-width: 15%;
    }

    .page-list-seller > .container > .row > div[class*=col-]:last-child {
        flex: 0 0 85%;
        max-width: 85%;
    }

    .page-list-seller > .container {
        width: auto;
        max-width: 159rem;
    }

    .list-seller .item-seller .inner-content .action > .btn {
        padding: 0.5rem 0rem;
    }

    .product-image-detail .gallery-thumbs {
        height: auto;
    }

    .list-seller .item-seller .inner-content .company-info {
        margin-bottom: 1rem;
        min-height: 15rem;
    }
}

@media (min-width: 768px) and (max-width: 968px) {
    .header-menu>.container>.row>div[class*="col-"] {
        flex: 0 0 100%;
        max-width: 100%;
        justify-content: space-between;
    }

    .header-menu>.container>.row>div[class*="col-"]:last-child {
        padding-top: 1rem;
    }

    .bottom-banner-slider > .row > div[class*=col-] {
        flex: 0 0 100%;
        max-width: 100%;
        margin-bottom: 2rem;
    }

    .list-seller .item-seller .inner-content {
        padding: 1rem;
    }

    .list-seller .item-seller .inner-content .action > .btn {
        font-size: 1.3rem;
    }

    .page-list-seller > .container > .row > div[class*=col-]:first-child {
        flex: 0 0 100%;
        max-width: 100%;
    }

    .page-list-seller > .container > .row > div[class*=col-]:last-child {
        flex: 0 0 100%;
        max-width: 100%;
    }

    .page-list-seller > .container {
        width: auto;
        max-width: 159rem;
    }

    .menu-container .btn-menu-mobile i {
        color: white;
    }

    .section-parameter .parameter {
        display: flex;
        align-items: center;
        justify-content: center;
        flex-wrap: wrap;
    }

    .section-parameter .parameter .item {
        margin: 0 2rem 2rem 2rem;
    }

    .section-coffee-story .inner-content {
        max-width: 100%;
    }

    .section-coffee-story .inner-image {
        max-width: 100%;
        position: relative;
        padding-top: 100%;
    }

    .product-image-detail .gallery-thumbs {
        height: auto;
    }

    .list-seller .item-seller .inner-content .company-info {
        margin-bottom: 1rem;
        min-height: 15rem;
    }
}

@media (min-width: 768px) and (max-width: 800px) {
    .list-seller .item-seller .inner-content .action > .btn {
        font-size: 1.1rem;
    }
}

@media (min-width: 968px) and (max-width: 1280px) {
    .header-menu .search-section .form-search .input-group .form-control {
        min-width: auto;
    }
}

@media (min-width: 968px) and (max-width: 1024px) {
    .header-menu>.container>.row>div[class*="col-"] {
        flex: 0 0 100%;
        max-width: 100%;
        justify-content: space-between;
    }

    .header-menu>.container>.row>div[class*="col-"]:last-child {
        padding-top: 1rem;
    }
}

@media (min-width: 993px) and (max-width: 1200px) {
    .sidebar-rfq-new .list-item {
        overflow-y: auto;
        max-height: 69.5rem;
    }
}

@media (min-width: 970px) and (max-width: 992px) {
    .sidebar-rfq-new .list-item {
        overflow-y: auto;
        max-height: 60.5rem;
    }

    .bottom-banner-slider .item-banner {
        height: 27.5rem;
        padding: 3rem 2rem;
    }
}

.bg-detail-article-right {
    background-color: white;
    border-radius: 2rem;
    padding: 2rem;
}

.btn_dat_lai a {
    background: var(--color-main);
    color: #fff;
    font-weight: 300;
    font-size: 1.6rem;
    padding: 0.6rem 2.5rem;
    border-radius: 0.6rem;
}

.content-filter-product .btn_dat_lai a:hover {
    background: var(--color-main);
    color: #fff;
}

.content-filter-product .btn_dat_lai {
    margin-top: 2rem;
    margin-bottom: 2rem;
}

.content-filter input.form-control::placeholder {
    color: #D9D9D9;
    opacity: 1;
}

.content-filter input.form-control {
    color: #000;
}

