/*************** ADD CUSTOM CSS HERE.   ***************/

/* =========================
 * ACF Menu Manager Styles
 * ========================= */

/* Top Bar Menu Styles */
.payment-col.qr-col{
    display: none;
}
@media screen and (max-width: 849px) {
    .medium-logo-center .logo {
        -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
        order: 2;
        text-align: center;
        margin: 0 15px;
        display: flex;
        justify-content: center;
    }
}
@keyframes float {

    0%,
    100% {
        transform: translateY(0px);
    }

    50% {
        transform: translateY(-10px);
    }
}
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes spin {
    to {
        transform: rotate(360deg);
    }
}
@media(min-width: 992px) {

    #masthead .flex-right {
        width: 60%
    }

}

@media (max-width: 480px) {
    .category-banner {
        height: 150px;
    }

    .category-banner-title {
        font-size: 1.5rem;
    }

    .category-banner-description {
        font-size: 0.9rem;
    }
}

@media (max-width: 549px) {
    header #logo img {
        padding: 0px
    }
}

@media (max-width: 768px) {

    .acf-left-sidebar-menu,
    .acf-right-sidebar-menu {
        transform: translateX(-100%);
        width: 280px !important;
    }

    .acf-right-sidebar-menu {
        transform: translateX(100%);
    }

    .acf-left-sidebar-menu.menu-open {
        transform: translateX(0);
    }

    .acf-right-sidebar-menu.menu-open {
        transform: translateX(0);
    }

    .has-left-sidebar-menu,
    .has-right-sidebar-menu,
    .has-left-sidebar-menu.has-right-sidebar-menu {
        margin-left: 0;
        margin-right: 0;
    }

    .acf-top-bar-menu .acf-menu-list {
        flex-direction: column;
        align-items: stretch;
    }

    .acf-top-bar-menu .acf-menu-item {
        margin: 5px 0;
    }

    .acf-top-bar-menu .acf-menu-item a {
        justify-content: center;
        padding: 12px 15px;
    }

    .category-banner {
        height: 200px;
    }

    .category-banner-title {
        font-size: 1.8rem;
    }

    .category-banner-description {
        font-size: 1rem;
    }

    .category-banner-content {
        padding: 15px;
    }

    .hdevvn-show-cats {
        display: none;
    }

    .specs-box {
        max-height: 220px;
    }

    .slider .flickity-page-dots {
        bottom: 15px;
    }

    .slider .flickity-page-dots .dot {
        width: 6px;
        height: 6px;
        margin: 0 3px;
    }

    .post-item .box-text {
        padding: 10px;
        border-radius: 0px 0px 8px 8px
    }

    .archive-page-header h1.page-title {
        font-size: 20px !important
    }

    /* #masthead {
        background-color: #1435c3;
    } */

    .header-main .mobile-nav>li>a {
        color: #fff
    }

    .mobile-nav .image-icon img {
        filter: brightness(0) invert(1);
    }

    form.searchform {
        background: rgba(255, 255, 255, 0.1);
        border-radius: 8px
    }

    form input[type='search'] {
        background-color: #f1f1f1 !important;
        box-shadow: none !important;
        border: 0px;
        color: black;
        border-radius: 20px;
    }

    form .submit-button {
        background: none !important;
        box-shadow: none;
        background: rgba(255, 255, 255, 0.1);
        border: 0px;
    }

    form input[type='search']::placeholder {
        /* Chrome, Firefox, Opera, Safari 10.1+ */
        color: #000000;
        opacity: 1;
        /* Firefox */
    }
.searchform .button.icon i{
    color: #000;
}
    footer#footer .footer-1>.row>.col>div {
        display: none;
    }

    footer#footer .footer-1 .widget-title:after {
        display: inline-block;
        font: normal normal normal 14px/1 FontAwesome;
        font-size: inherit;
        text-rendering: auto;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        content: "\f107";
        float: right;
    }

}

@media (max-width: 768px) {

    .acf-image-slider,
    .acf-image-grid {
        height: 150px;
    }

    .acf-menu-left {
        left: 10px;
    }

    .acf-menu-right {
        right: 10px;
    }

    .acf-menu-image {
        width: 60px;
        height: 60px;
    }

    .acf-banner-slider {
        height: 250px;
    }

    .acf-banner-side-images {
        padding: 10px;
    }

    .acf-banner-left-image,
    .acf-banner-right-image {
        width: 80px;
        height: 80px;
    }

    .acf-banner-title {
        font-size: 1.8rem;
    }

    .acf-banner-subtitle {
        font-size: 1rem;
    }

    .acf-menu-list {
        flex-direction: column;
        gap: 10px;
    }

    .acf-menu-item a {
        padding: 10px 15px;
    }
}

@media(min-width: 992px) {
    .single-product .product-main .product-info {
        position: static;
        top: auto;
        z-index: auto;
        align-self: auto;
        overflow: visible;
    }

    .single-product .product-main .content-row {
        align-items: flex-start;
    }
}

@media(min-width: 850px) {
    .product-main .product-gallery {
        /*border-radius: 8px 0px 0px 8px;*/
        /* margin-left: 12px */
    }
    footer#footer .footer-2 {
        padding: 15px;
    }

}



@media(max-width: 850px) {
    .product-small .product-title {
        text-overflow: ellipsis;
        overflow: hidden;
        height: 40px
    }

    .section-title-normal.section-title .section-title-main {
        font-size: 14px;
        width: 60%;
        height: 24px;
        text-overflow: ellipsis;
    }

    .section-title-normal a {
        font-size: 14px;

    }

    .product-main>.row {
        border-radius: 8px;
    }

    .product-main {
        padding-bottom: 20px
    }

    .product-page-title {
        display: none;
    }

    .product-title.product_title.entry-title {
        font-weight: 500;
        font-size: 16px;
        color: #3a3a3a;
    }
}






.acf-top-bar-menu {
    background: #fff;
    border-bottom: 1px solid #e0e0e0;
    padding: 10px 0;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    margin-bottom: 10px;
}

.acf-top-bar-menu .acf-menu-list {
    display: flex;
    list-style: none;
    margin: 0;
    padding: 0;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
}

.acf-top-bar-menu .acf-menu-item {
    margin: 0 15px;
}

.acf-top-bar-menu .acf-menu-item a {
    display: flex;
    align-items: center;
    padding: 8px 15px;
    text-decoration: none;
    color: #333;
    font-weight: 500;
    border-radius: 4px;
    transition: all 0.3s ease;
}

.acf-top-bar-menu .acf-menu-item a:hover {
    background: #f5f5f5;
    color: #007cba;
}

.acf-top-bar-menu .acf-menu-item i {
    margin-right: 8px;
    font-size: 14px;
}

/* Top Bar Menu Styles */
.acf-top-bar-menu-wrapper {
    width: 100%;
    background: #f8f9fa;
    border-bottom: 1px solid #e9ecef;
    padding: 10px 0;
}

.acf-top-bar-menu {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 15px;
}



/* Left Sidebar Menu Styles */
.acf-left-sidebar-menu {
    position: fixed;
    top: 0;
    left: 0;
    height: 100vh;
    background: #fff;
    border-right: 1px solid #e0e0e0;
    box-shadow: 2px 0 8px rgba(0, 0, 0, 0.1);
    z-index: 9999;
    overflow-y: auto;
    transition: transform 0.3s ease;
}

.acf-left-sidebar-menu.acf-menu-position-scroll {
    position: absolute;
    top: 0;
}

.acf-left-sidebar-menu.acf-menu-position-sticky {
    position: sticky;
    top: 0;
}

.acf-left-sidebar-menu .acf-menu-header {
    background: #007cba;
    color: #fff;
    padding: 15px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid #005a87;
}

.acf-left-sidebar-menu .acf-menu-header h3 {
    margin: 0;
    font-size: 16px;
    font-weight: 600;
}

.acf-left-sidebar-menu .acf-menu-toggle {
    background: none;
    border: none;
    color: #fff;
    font-size: 18px;
    cursor: pointer;
    padding: 5px;
    border-radius: 3px;
    transition: background 0.3s ease;
}

.acf-left-sidebar-menu .acf-menu-toggle:hover {
    background: rgba(255, 255, 255, 0.1);
}

.acf-left-sidebar-menu .acf-menu-list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.acf-left-sidebar-menu .acf-menu-item {
    border-bottom: 1px solid #f0f0f0;
}

.acf-left-sidebar-menu .acf-menu-item:last-child {
    border-bottom: none;
}

.acf-left-sidebar-menu .acf-menu-item a {
    display: flex;
    align-items: center;
    padding: 15px 20px;
    text-decoration: none;
    color: #333;
    transition: all 0.3s ease;
    border-left: 3px solid transparent;
}

.acf-left-sidebar-menu .acf-menu-item a:hover {
    background: #f8f9fa;
    border-left-color: #007cba;
    color: #007cba;
}

.acf-left-sidebar-menu .acf-menu-item i {
    margin-right: 12px;
    font-size: 16px;
    width: 20px;
    text-align: center;
}

/* Right Sidebar Menu Styles */
.acf-right-sidebar-menu {
    position: fixed;
    top: 0;
    right: 0;
    height: 100vh;
    background: #fff;
    border-left: 1px solid #e0e0e0;
    box-shadow: -2px 0 8px rgba(0, 0, 0, 0.1);
    z-index: 9999;
    overflow-y: auto;
    transition: transform 0.3s ease;
}

.acf-right-sidebar-menu.acf-menu-position-scroll {
    position: absolute;
    top: 0;
}

.acf-right-sidebar-menu.acf-menu-position-sticky {
    position: sticky;
    top: 0;
}

.acf-right-sidebar-menu .acf-menu-header {
    background: #28a745;
    color: #fff;
    padding: 15px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid #1e7e34;
}

.acf-right-sidebar-menu .acf-menu-header h3 {
    margin: 0;
    font-size: 16px;
    font-weight: 600;
}

.acf-right-sidebar-menu .acf-menu-toggle {
    background: none;
    border: none;
    color: #fff;
    font-size: 18px;
    cursor: pointer;
    padding: 5px;
    border-radius: 3px;
    transition: background 0.3s ease;
}

.acf-right-sidebar-menu .acf-menu-toggle:hover {
    background: rgba(255, 255, 255, 0.1);
}

.acf-right-sidebar-menu .acf-menu-list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.acf-right-sidebar-menu .acf-menu-item {
    border-bottom: 1px solid #f0f0f0;
}

.acf-right-sidebar-menu .acf-menu-item:last-child {
    border-bottom: none;
}

.acf-right-sidebar-menu .acf-menu-item a {
    display: flex;
    align-items: center;
    padding: 15px 20px;
    text-decoration: none;
    color: #333;
    transition: all 0.3s ease;
    border-right: 3px solid transparent;
}

.acf-right-sidebar-menu .acf-menu-item a:hover {
    background: #f8f9fa;
    border-right-color: #28a745;
    color: #28a745;
}

.acf-right-sidebar-menu .acf-menu-item i {
    margin-right: 12px;
    font-size: 16px;
    width: 20px;
    text-align: center;
}
.acf-left-sidebar-menu::-webkit-scrollbar,
.acf-right-sidebar-menu::-webkit-scrollbar {
    width: 6px;
}

.acf-left-sidebar-menu::-webkit-scrollbar-track,
.acf-right-sidebar-menu::-webkit-scrollbar-track {
    background: #f1f1f1;
}

.acf-left-sidebar-menu::-webkit-scrollbar-thumb,
.acf-right-sidebar-menu::-webkit-scrollbar-thumb {
    background: #c1c1c1;
    border-radius: 3px;
}

.acf-left-sidebar-menu::-webkit-scrollbar-thumb:hover,
.acf-right-sidebar-menu::-webkit-scrollbar-thumb:hover {
    background: #a8a8a8;
}
/* Body adjustments for sidebar menus */
.has-left-sidebar-menu {
    margin-left: 250px;
}

.has-right-sidebar-menu {
    margin-right: 250px;
}

.has-left-sidebar-menu.has-right-sidebar-menu {
    margin-left: 250px;
    margin-right: 250px;
}
/* Layout với Left Sidebar */
.has-left-sidebar-menu .category-banner-wrapper {
    margin-left: 0;
    margin-right: 0;
}

.has-right-sidebar-menu .category-banner-wrapper {
    margin-left: 0;
    margin-right: 0;
}

.has-left-sidebar-menu.has-right-sidebar-menu .category-banner-wrapper {
    margin-left: 0;
    margin-right: 0;
}
/* Menu overlay for mobile */
.menu-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    z-index: 9998;
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease;
}

.menu-overlay.active {
    opacity: 1;
    visibility: visible;
}

/* Scroll behavior for sticky menus */
.acf-menu-position-sticky {
    position: sticky !important;
    top: 0;
}

/* Animation for menu items */
.acf-menu-item a {
    position: relative;
    overflow: hidden;
}

.acf-menu-item a::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
    transition: left 0.5s;
}

.acf-menu-item a:hover::before {
    left: 100%;
}

/* Custom scrollbar for sidebar menus */


/* =========================
 * Category Banner Styles
 * ========================= */

/* Category Banner Wrapper */
.category-banner-wrapper {
    width: 100%;
    margin-bottom: 30px;
    position: relative;
    overflow: hidden;
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

/* Category Banner Container */
.category-banner {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
}

/* Banner Height Classes */
.banner-height-small .category-banner {
    height: 200px;
}

.banner-height-medium .category-banner {
    height: 300px;
}

.banner-height-large .category-banner {
    height: 400px;
}

.banner-height-custom .category-banner {
    height: 100%;
}

/* Category Banner Image */
.category-banner-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s ease;
}

.category-banner:hover .category-banner-image {
    transform: scale(1.05);
}

/* Category Banner Overlay */
.category-banner-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(45deg, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.3));
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Category Banner Content */
.category-banner-content {
    text-align: center;
    color: #fff;
    padding: 20px;
    max-width: 600px;
}

.category-banner-title {
    font-size: 2.5rem;
    font-weight: 700;
    margin: 0 0 15px 0;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
    line-height: 1.2;
}

.category-banner-subtitle {
    font-size: 1.3rem;
    font-weight: 500;
    margin: 0 0 10px 0;
    opacity: 0.9;
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5);
    line-height: 1.3;
}

.category-banner-description {
    font-size: 1.1rem;
    margin: 0;
    opacity: 0.9;
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5);
    line-height: 1.4;
}





/* Animation Effects */
.category-banner-wrapper {
    animation: fadeInUp 0.6s ease-out;
}



/* Hover Effects */
.category-banner-wrapper:hover {
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);
    transform: translateY(-2px);
    transition: all 0.3s ease;
}

/* Loading State */
.category-banner-wrapper.loading {
    background: #f5f5f5;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 200px;
}

.category-banner-wrapper.loading::after {
    content: '';
    width: 40px;
    height: 40px;
    border: 4px solid #e0e0e0;
    border-top-color: #007cba;
    border-radius: 50%;
    animation: spin 1s linear infinite;
}

:root {
    --primary-color: #C8333A;
}

#masthead .searchform {
    background-color: #F5F5F5;
    border: 1px solid #dcdcdc;
    /* padding: 1px; */
    border-radius: var(--search-bar-border-radius, 8px);
    --button-icon-border-radius: var(--search-bar-border-radius, 8px);
    border: 1px solid #eaeaea;
}

#masthead .searchform .search-field {
    /* border-radius: 4px; */
    padding: 0.375rem 2rem;
    border: 1px solid #e0e0e0;
    max-height: 45px;
    height: 45px;
    border: 0;
    background-color: transparent;
    box-shadow: none
}

#masthead .searchform .ux-search-submit {
    /* width: 38px;
    height: 38px;
    border-radius: 8px !important; */
    max-height: 47px;
    height: 47px;
}

.TextCaptions {
    padding: 0px !important
}

.wbcslider_tgdd .TextCaptions .item {
    background: #fff;
    padding: 10px 0px !important;
    margin: 0px !important;
    color: #333333 !important;
    text-align: center !important;
    cursor: pointer !important;
    border-right: 1px solid #f0f0f0 !important;
    display: block;
    font-size: 12px;
    height: auto !important
}


.wbcslider_tgdd .TextCaptions .item.is-selected {
    font-weight: bold;
    border-bottom: 4px solid #dc0f20;
}


#shop-sidebar .widget .widget-title {
    flex: 0 0 auto;
    width: 12.5%;
    padding-right: 0.5rem;
    padding-left: 15px;
    font-size: 14px;
    font-weight: 500
}

.sidebar-inner aside.widget {
    display: flex;
    margin-bottom: 10px
}

.sidebar-inner aside.widget ul li.chosen a {

        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        cursor: pointer;
        padding: 10px 0;
        border-bottom: 1px solid var(--clr-border);
        }

.sidebar-inner aside.widget ul li.chosen a:before {
    content: "";
    position: absolute;
    top: -1px;
    right: -1px;
    width: 0px;
    height: 0px;
    border-style: solid;
    border-width: 0px 20px 20px 0px;
    border-color: transparent rgb(20, 53, 195) transparent transparent;
    margin-right: 0px;
    opacity: 1;

}

.sidebar-inner aside.widget ul li.chosen a:after {
    position: absolute;
    top: 0px;
    right: 2px;
    color: rgb(255, 255, 255);
    z-index: 0;
    font-size: 7px;
    content: "✓";
}

.yith-wcan-list {
    flex: 0 0 auto;
    width: 83.3333%;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    height: 2.5rem;
    overflow: hidden;
}

.yith-wcan-list li {
    display: inline-block;
}

.yith-wcan-list li a {
    border-radius: 4px;
    display: inline-block;
    border: 1px solid rgb(224, 224, 224);
    background-color: rgb(255, 255, 255);
    position: relative;
    overflow: hidden;
    margin-right: 0.5rem;
    margin-bottom: 0.3rem;
    padding: 0.375rem 1.25rem !important;
    color: rgb(51, 51, 51);
    cursor: pointer;
}

.yith-wcan-list li a:hover {
    background: rgb(243, 243, 243);
}

.widget>ul>li .count {
    display: none;
}

.woocommerce-tabs .nav-tabs>li>a {
    text-transform: uppercase;
    font-size: 18px;
    background: #fff;
    color: #333;
    border: 0px !important;
}

.woocommerce-tabs .nav-tabs>li.active>a {
    border-top-color: #dc0021;
    background: #dc0021 !important;
    color: #fff;
    border: 0px !important;
}

.woocommerce-tabs .nav-tabs>li {
    margin: 0px !important;
    border: 0px !important;
}

.woocommerce-tabs .nav-tabs {
    background: #fff
}

.woocommerce-tabs .nav-tabs+.tab-panels {
    border: 0px;
    border-top: 1px solid #f0f0f0;
}


.yith-wcan-list li a {
    font-size: 14px;
    font-weight: 400;
    color: #333
}

.yith-wcan-list li {
    border: 0px !important;
}

#mega-menu-wrap {
    width: auto;
    position: initial;
    background: none
}

.header-nav-main {
    position: initial;
}

#masthead .header-inner {
    position: relative;
}

#mega-menu-title {
    cursor: pointer;
    border-radius: 4px;
    overflow: hidden;
    line-height: 1rem;
    padding: 0.365rem 0.75rem;
    display: inline-flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    text-align: center;
    background-color: rgb(255, 255, 255);
    color: rgb(51, 51, 51);
    border-width: 1px;
    border-style: solid;
    user-select: none;
    text-decoration: none;
    flex-direction: row;
    position: relative;
    border-color: rgb(224, 224, 224);
    font-weight: normal;
}

#mega_menu {
    width: 180px;
    left: 70px;
    margin-top: 15px;
    border-radius: 8px;
    padding: 8px 0px
}


.header-main .nav>li>a .header-cart-title {
    font-weight: normal;
}

.nav-dark .is-outline,
.dark .nav>li>a,
.dark .nav>li.html,
.dark .nav-vertical li li.menu-item-has-children>a,
.dark .nav-vertical>li>ul li a,
.nav-dropdown.dark>li>a,
.nav-dropdown.dark .nav-column>li>a,
.nav-dark .nav>li>a,
.nav-dark .nav>li>button {
    color: #fff
}


.mobile-nav .image-icon img {
    width: 27px
}

#wide-nav {}

#mega_menu>li>a {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-align-items: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    background: #fff;
    padding: 0.6rem;
    font-size: 0.75rem;
    font-weight: 500;
    color: #333;
    padding: 0 0.4rem;
    line-height: 32px;
    border-radius: 4px;
    overflow: hidden;
    border: 0px;
}

#mega_menu>li>a span {
    padding-left: 0px;
    font-size: 12px;
    font-weight: 500;
    color: #333;
    text-overflow: ellipsis;
    overflow: hidden;
    line-height: 32px;
    width: 100%;
}

.sf-vertical.sf-arrows>li>.sf-with-ul:after {
    display: none;
}

#mega_menu {
    border: 0px;
}

#mega_menu>li:last-child {
    border-radius: 0px 0px 5px 5px
}

#mega_menu a {
    font-size: 12px
}

.sf-menu a {
    border: 0px;
    padding: 6px 10px;
    font-size: 12px;
}

#mega_menu .sub-menu {
    border-radius: 8px;
    top: -8px;
    overflow: hidden;
    margin-left: 10px;
}

.logo-left .logo {
    margin-right: 10px
}



.ux-timer span strong {
    display: none !important;
}

.ux-timer {
    width: auto !important
}

.ux-timer span {
    padding: 2px 4px !important;
    border-radius: 3px;
    background: #333;
    font-size: 14px;
    color: #fff;
    width: 22px !important;
    height: 22px !important;
    line-height: 22px !important
}

.shadow .sanpham>.col-inner {}

.hdevvn-show-cats .hdevvn_cats {
    display: inline-block;
    margin-bottom: 0px;
    margin-left: 10px
}

.section-title-normal a {
    border: 0;
    font-size: 15px;
    line-height: 1.5;
    text-decoration: none;
    color: #848788 !important;
    cursor: pointer;
    -webkit-transition: .3s ease-out;
    -moz-transition: .3s ease-out;
    -ms-transition: .3s ease-out;
    -o-transition: .3s ease-out;
    transition: .3s ease-out;
    font-weight: normal;
    margin-bottom: 0px;
    margin-left: 0px;
}

.section-title-normal b {
    opacity: 0
}

.section-title-normal.section-title {
    /* padding: 16px;
    position: relative;
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
    border: 0px;
    margin-bottom: 0px */
}

.section-title-normal.section-title .section-title-main {
    color: #333;
    font-size: 20px;
    font-weight: 600;
    line-height: 24px;
    border: 0px;
    margin: 0px;
    padding-bottom: 0px;
}

.section-title-normal.section-title .section-title-main:before {
    /* content: "";
    border-left: 3px solid #000;
    margin-left: -16px;
    margin-right: 16px; */
}

.section-title-normal.section-title a:hover {
    color: #1435c3 !important;
}

.product-small .badge-inner.on-sale {
    width: 39px;
    height: 35px;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0 0 5px;
    background-image: url(images/sticker.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    font-size: 12px;
    font-weight: 400;
    color: #fff;
    border-radius: 0px;
    background-color: #fff0 !important;
    margin-right: 0px
}

.product-small .badge-container {
    margin: 0px;
    left: auto;
    right: 0px
}

.product-small .product-title {
    margin-bottom: 0;
    font-size: 13px;
    line-height: 1.4em;
    overflow: hidden;
}

.product-small .product-title a {
    line-height: 18px;
}

.product-small .title-wrapper {
    margin-bottom: 10px
}

.product-small.box {
    padding: 10px
}

.home .product-small.box {
    transition: transform 0.3s ease;
}

.home .product-small.box:hover {
    transform: scale(1.05);
}

.section-title-container {
    margin-bottom: 0px
}


.slider>.flickity-prev-next-button.previous {
    padding-right: 7px;
    border-radius: 0 100px 100px 0;
    left: -2px;
    width: 50px;
    height: 60px;
    display: flex;
    justify-content: center;
    align-items: center;
    background: #fff;
    box-shadow: 0 0 4px 0 rgba(0, 0, 0, .2) !important;
    color: #707070;
    top: 35%;
    transition: .3s;
    outline: none;
    opacity: .9;
    margin-top: 0px !important;
    transform: initial !important;
}

.slider>.flickity-prev-next-button.next {
    padding-left: 7px;
    border-radius: 100px 0 0 100px;
    right: -2px;
    width: 50px;
    height: 60px;
    display: flex;
    justify-content: center;
    align-items: center;
    background: #fff;
    box-shadow: 0 0 4px 0 rgba(0, 0, 0, .2) !important;
    color: #707070;
    top: 35%;
    transition: .3s;
    outline: none;
    opacity: .9;
    margin-top: 0px !important;
    transform: initial !important;
}

.slider>.slider-nav-light .flickity-prev-next-button svg,
.slider-nav-light .flickity-prev-next-button .arrow {
    fill: #707070;
}

.slider>.flickity-prev-next-button svg {
    width: 25px !important;
    border: 0px !important;
    padding: 5px
}

.star-rating {
    font-size: 12px
}

.woo-variation-swatches .variable-items-wrapper .variable-item:not(.radio-variable-item) {
    box-shadow: none !important
}

.woo-variation-swatches .variable-items-wrapper .variable-item:not(.radio-variable-item).selected,
.woo-variation-swatches .variable-items-wrapper .variable-item:not(.radio-variable-item).selected:hover {
    /*border: 2px solid #dc0f20;*/
}

b,
strong {
    font-weight: 700;
}

body {
    font-family: 'Montserrat-Medium', serif;
}

.badge-container.absolute {
    display: none;
}

.product-small .badge-inner.on-sale,
.product-main .badge-inner.on-sale {
    background-image: linear-gradient(-90deg, #ec1f1f 0%, #ff9c00 100%);
    border-radius: 10px;
    padding: 1px 7px;
    padding-left: 0;
    padding-right: 0px;
    height: 20px;
    color: #fff;
    font-weight: 400;
    left: 10px;
    z-index: 1;
    bottom: 10px;
    font-size: 11px;
    width: auto;
    display: none;
}

.product-small .badge-container,
.product-main .badge-container {
    margin: 0px;
    left: auto;
    right: 10px;
    top: 10px;
    display: block;
}

.product-small .badge-inner.on-sale:before,
.product-main .badge-inner.on-sale:before {
    content: ' ';
    display: inline-block;
    background: url(images/flash.png);
    background-size: 50% 50%;
    width: 20px;
    height: 20px;
    background-repeat: no-repeat;
    background-position: center center;
    background-color: #f13500;
    border-radius: 50%;
    vertical-align: middle;
    position: relative;
    top: -1px;
    margin-right: 5px;
    left: 0px
}

/* =========================
 * Badge HOT (featured) overlay
 * ========================= */
.product-small .box-image {
    position: relative;
}

.product-small.box {
    position: relative;
}

.product-small .col-inner {
    position: relative;
}

.xyz-badge-hot {
    position: absolute;
    top: 10px;
    left: 10px;
    right: auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #e60023;
    color: #fff;
    font-weight: 700;
    text-transform: uppercase;
    font-size: 12px;
    padding: 8px 10px;
    border-radius: 3px;
    box-shadow: 0 2px 6px rgba(0, 0, 0, .2);
    z-index: 6;
    pointer-events: none;
}

.xyz-badge-hot::after {
    content: '';
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: -6px;
    width: 0;
    height: 0;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-top: 6px solid #e60023;
}

.single-product .product-gallery {
    position: relative;
}

.single-product .xyz-badge-hot {
    top: 12px;
    left: 12px;
    right: auto;
}

.product-small .badge-inner.on-sale,
.product-main .badge-inner.on-sale {
    padding-right: 5px
}

.product-title.product_title.entry-title {
    /*overflow: hidden;*/
    /*text-overflow: ellipsis;*/
    /*text-align: left;*/
    /*-webkit-box-orient: vertical;*/
    /*-webkit-line-clamp: 3;*/
    /*max-height: 3.775rem;*/
    /*min-height: 3.775rem;*/
    /*font-size: 24px;*/
    /*line-height: 1.33;*/
    /*display: unset;*/
    /*word-break: break-word;*/
    /*font-weight: normal;*/
    font-size:28px;
    line-height:1.142857;
    font-weight:700;
}

/* Product title meta under H1 */
.product-title-meta {
    font-size: 14px;
    color: #a6a6a6;
    /*margin-top: 4px;*/
}

.product-title-meta .sep {
    opacity: .5;
    margin: 0 6px;
}

h1,
h2,
h3,
h4,
h5,
h6,
.heading-font {
    color: #0a0a0a;
    font-size: 100%;
}

span.amount {
    color: #1435c3;
}

del span.amount,
.price del {
    font-size: 13px;
    color: rgb(0, 0, 0) !important;
    opacity: 1;
}

p {
    margin-bottom: 10px
}

[data-icon-label]:after,
.secondary.is-underline:hover,
.secondary.is-outline:hover,
.icon-label,
/* .button.secondary:not(.is-outline), */
.button.alt:not(.is-outline),
.badge-inner.on-sale,
.button.checkout,
.single_add_to_cart_button,
.current .breadcrumb-step {
    border-radius: 3px
}

#product-sidebar span.widget-title {
    display: block;
    width: 100%;
    background-color: #f7f7f7;
    float: left;
    text-align: center;
    text-transform: uppercase;
    border: 1px #eee solid;
    line-height: 40px;
    color: #3c3d41;
}

.recent-blog-posts-li .badge {
    width: 70px;
    height: 60px
}

#product-sidebar a {
    font-size: 14px;
    line-height: 18px
}

#product-sidebar span.amount {
    font-size: 14px
}

.shop-page-title .page-title-inner {
    border-bottom: 1px solid rgb(234, 234, 234);
    padding-bottom: 20px;
}

/* footer#footer {
    font-size: 13px;
    border-top: 3px solid #1435c3;
} */

footer#footer .widget .is-divider {
    display: none;
}

footer#footer .footer-2 {
    font-size: 12px
}

.absolute-footer {
    display: none;
}

footer#footer ul.menu>li+li,
.widget>ul>li+li {
    border: 0px;
}

footer#footer span.widget-title {
    display: block;
    margin-bottom: 15px;
    font-size: 14px
}

footer#footer p>a {
    color: #1435c3
}

.category .col.post-item .post-title {
    font-weight: 600;
    letter-spacing: 0.6px;
    font-size: 20px
}

.category .post-item {
    border-bottom: 1px solid #f1f1f1;
    margin-bottom: 10px;
    padding-bottom: 10px;
}

.category .post-item .cat-label {
    color: #dd3333;
    display: block;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.6px;
    line-height: 1.2em;
    text-transform: uppercase;
    margin-bottom: 10px;
    opacity: 1
}

.category .post-item .post-meta {
    font-weight: 700;
    color: #ccc;
    color: #ababab;
    font-size: 12px;
    opacity: 1;
}

.recent-blog-posts-li .badge.post-date {
    width: 60px;
    height: 60px;
    border-radius: 5px;
    overflow: hidden;
}

#secondary span.widget-title {}

#secondary .widget .is-divider {
    display: none;
}

.breadcrumbs {
    font-size: 13px;
    position: relative;
    font-weight: 300;
}

.archive-page-header {
    margin-bottom: 30px
}

.breadcrumbs a {
    color: #e11b1e;
    font-weight: normal;
}

.dvls_maps_sidebar,
.dvls_maps_header {
    background: none !important
}

.dvls_maps_wrap input.dvls-submit {
    border: 0;
    background: #000000 !important;
    height: 35px;
    padding: 0 15px;
    border-radius: 3px;
    color: #fff;
    font-size: 12px;
}

.dvls_result_item {
    border: 0px !important;
    background: none !important;
    padding: 2px 10px !important
}

.dvls_result_infor {
    overflow: hidden;
    border: 1px solid #ccc;
    padding: 10px;
    font-size: 13px;
    line-height: 15px;
}

.dvls_maps_row.dvls_maps_header {
    display: none
}



#comments a.btn-reviews-now {
    background-color: #f6470e;
    color: #fff;
    display: inline-block;
    padding: 10px 20px;
    border-radius: 3px;
    /* text-transform: uppercase; */
    font-weight: 300;
    text-decoration: none;
}

span.devvn_num_reviews {
    min-width: 150px;
    color: #f6470e;
}

span.devvn_stars_value i {
    margin: 0 3px;
    color: #f57201;
}
.row, .gallery{
    flex-flow: unset !important;
}



.header-block-block-1 .icon-box-text {
    display: none;
}

.header-nav>.header-block {
    width: 85% !important;
    /* margin: 0px !important; */
    text-align: center;
}

/*.header-nav>.account-item {*/
/*    width: 25%;*/
/*    margin: 0px;*/
/*    text-align: center;*/
/*}*/

/*.header-nav>.cart-item {*/
/*    width: 25%;*/
/*    margin: 0px;*/
/*    text-align: center;*/
/*}*/

.icon-box-center .icon-box-img {
    margin: 0px auto !important
}

.header-nav>.account-item>a {
    background: url('images/icon8.svg');
    width: 32px;
    height: 32px;
}

.header-nav>.account-item i {
    display: none;
}

.menu-item a img,
img.menu-image-title-after {
    width: 32px;
    height: 22px
}

#header.header.has-sticky .header-wrapper.stuck #mega-menu-wrap:hover #mega_menu:not(.active) {
    display: none !important;
}

.header-cart-icon[data-icon-label]:after {
    background-color: #dc0021 !important;
    border-radius: 100%;
    box-shadow: none;
    font-weight: normal;
}

.slidertop {
    position: absolute !important;
    max-width: 100% !important;

}

.slidertop .col {
    padding: 0px
}

#top-bar img.menu-image {
    width: 18px;
    height: 18px;
    filter: brightness(0) invert(1);
    padding-right: 0px
}

#header.header.has-sticky .header-wrapper.stuck #mega_menu {
    margin-top: 15px
}

.nk_custom_pc_builder_page_body .list-item .item {
    box-shadow: 0.1rem 0.1rem 0.5rem 0.1rem rgb(0 0 0 / 8%);
    border-radius: 8px;
    background-color: #FFFFFF !important;
    overflow: hidden;
    position: relative;
    padding: 1.5rem 1rem;
    -webkit-transition: box-shadow 0.2s ease-in-out;
    transition: box-shadow 0.2s ease-in-out;
    margin-bottom: 1rem;
    border: 0px
}

.nk_custom_pc_builder_page_body .list-item {
    border: 0px;
}

.nk_custom_pc_builder_page_header,
.nk_custom_pc_builder_page_footer {
    background: none
}

.nk_custom_pc_builder_page .btn.btn-primary {
    background-color: #1435c3;
    border-color: #1435c3;
    border-radius: 4px;
}

.nk_custom_pc_builder_page_body .list-item .item .right {
    border-left: 0px
}

.nk_custom_pc_builder_page_body .list-item .item .right .inner-item .info,
.nk_custom_pc_builder_page_body .list-item .item .right .inner-item .price-wrap,
.nk_custom_pc_builder_page_body .list-item .item .right .inner-item .action {
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    display: flex;
}

.nk_custom_pc_builder_page_body .list-item .item .right .inner-item .info a {
    font-weight: normal;
}

.topslider .img .image-zoom {
    border-radius: 8px
}

.box-category .count {
    text-transform: inherit;
    font-size: 14px;
    margin-top: 10px;
}

.boxsmall .product-small .product-title a {
    height: 35px;
    text-overflow: ellipsis;
    overflow: hidden;
}

.boxsmall .box-text.text-center {
    padding-bottom: 0px
}

.boxsmall .box-image img {
    max-height: 100px;
    width: auto;
    margin: auto;
    display: block;
}

.boxsmall .product-small .title-wrapper {
    margin-bottom: 0px
}

.category-page-row {
    margin-bottom: 30px;
}

.shop-page-title.category-page-title .page-title-inner {
    background: rgb(255, 255, 255);
    margin-top: 30px;
    border-radius: 8px 8px 0px 0px
}

.category-page-title .medium-text-center {
    font-size: 13px
}

.category-page-title .shop-page-title:before {
    position: absolute;
    left: 0;
    margin-top: 2px;
    width: 3px;
    height: 21px;
    background-color: #333;
    content: ""
}

.woocommerce-breadcrumb a {
    line-height: 1rem;
    position: relative;
    /*padding: 8px;*/
    color: rgb(0 0 0) !important;
    text-decoration: none;
    background-color: rgb(255, 255, 255);
    /* border: 1px solid rgb(224, 224, 224); */
    border-radius: 9999px;
    --button-icon-color: #333333;
    display: inline-block;
}

.product-info {
    height: 450px;
}

.product-main .product-gallery,
.product-main .product-info {
    /*padding: 15px !important;*/
    background: #f1f0f1
}

#product-sidebar aside {
    border-radius: 8px;
    background-color: rgb(255, 255, 255);
    overflow: hidden;
    position: relative;
    padding: 10px
}

.product-main .bg-wh {
    border-radius: 8px;
    background: #fff
}

.product-main .product-info {
    border-radius: 0px 8px 8px 0px;
}

.single-product .product-main .product-info {
    position: static;
    display:grid
}


.product-section {
    border-radius: 8px;
    background-color: rgb(255, 255, 255);
    /*padding: 15px;*/
    margin-bottom: 10px
}

.related.related-products-wrapper {
    border-radius: 8px;
    background-color: rgb(255, 255, 255);
    padding: 15px
}

.shop-page-title.product-page-title .page-title-inner {
    border-bottom: 0px
}

.product-section h5 {
    color: #333;
    font-size: 20px;
    font-weight: 600;
    line-height: 24px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
}

.product-section h5:before {
    position: absolute;
    left: 0;
    margin-top: 2px;
    width: 3px;
    height: 21px;
    background-color: #333;
    content: ""
}

.product-gallery .flickity-button {
    display: none !important;
}

.product-thumbnails .is-nav-selected a {
    border-color: rgb(20 53 195);
    padding: 10px;
    border-radius: 5px
}

.product-thumbnails a {
    padding: 10px;
}

.product-info .price-wrapper {
    /*border-bottom: 1px dashed rgb(224, 224, 224);*/
}

.product-info .product-short-description {
    font-size: 13px;
    display: inline-block;
    border: 1px solid rgb(20, 53, 195);
    background-color: rgba(20, 53, 195, 0.08);
    padding: 0.5rem 1.25rem;
    position: relative;
    overflow: hidden;
    cursor: pointer;
    width: 100%;
    margin-top: 0.5rem;
    border-radius: 0.5rem;
}

#product-sidebar .icon-box {
    font-size: 14px
}

.css-18wywdr {
    position: absolute;
    top: -1px;
    right: -1px;
    width: 0px;
    height: 0px;
    border-style: solid;
    border-width: 0px 36px 36px 0px;
    border-color: transparent rgb(20, 53, 195) transparent transparent;
}

.css-th3zma {
    position: absolute;
    top: 0px;
    right: 6px;
    color: rgb(255, 255, 255);
    z-index: 0;
    font-size: 10px;
}

.product-short-description {
    margin-bottom: 20px
}

#product-sidebar {
    background: #f1f1f1
}

/* Extra CTA buttons under add-to-cart */
.nk-checkout-cta {
    margin-top: 10px;
}

.nk-checkout-cta .nk-btn {
    display: block;
    width: 100%;
    border-radius: 10px;
    background: #e10f19;
    /* red */
    color: #fff;
    text-align: center;
    padding: 14px 12px 10px;
    line-height: 1.1;
    text-decoration: none;
    margin-bottom: 10px;
}

.nk-checkout-cta .nk-btn strong {
    display: block;
    font-size: 18px;
}

.nk-checkout-cta .nk-btn span {
    display: block;
    font-size: 12px;
}

.nk-checkout-cta .nk-installments {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

.nk-checkout-cta .nk-btn-install {
    background: #0b7cf6;
    /* blue */
}

.nk-checkout-cta .nk-btn-install.inst-card {
    background: #0b7cf6;
}

.nk-checkout-cta .nk-btn-install.inst-paper {
    background: #0b7cf6;
}

.woocommerce-cart-form,
.cart_totals,
.checkout_coupon {
    background: #fff;
    padding: 10px;
    border-radius: 8px;
    margin-bottom: 20px
}



#wrapper>.message-wrapper {
    display: none;
}

.category-page-title .woocommerce-breadcrumb {
    /*display: none;*/
}


ul.product_list_widget li a:not(.remove) {
    font-size: 13px
}

.button {
    font-size: 13px;
    font-weight: normal;
}

/* Woo Add to Cart icon (Font Awesome 4.7 already enqueued) */
/* Use custom image icon for Add to Cart (override FontAwesome rule above) */
.single_add_to_cart_button,
.add_to_cart_button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
}

.single_add_to_cart_button:before,
.add_to_cart_button:before {
    /*content: "";*/
    /*display: inline-block;*/
    /*width: 20px;*/
    /*height: 20px;*/
    /*margin: 0;*/
    /*background-image: url('wp-content/uploads/2025/09/shopping-bag.png');*/
    /*background-repeat: no-repeat;*/
    /*background-position: center;*/
    /*background-size: 20px 20px;*/
    /*image-rendering: -webkit-optimize-contrast;*/
    /*image-rendering: crisp-edges;*/
    /*filter: brightness(0) invert(1) contrast(1.2) saturate(0);*/
}

footer#footer {}

.post-sidebar aside {
    background: #fff;
    padding: 20px;
    border-radius: 8px;
}

.woocommerce-billing-fields,
.woocommerce-additional-fields,
.woocommerce-checkout-payment,
.shop_table.woocommerce-checkout-review-order-table {
    padding: 16px;
    /* margin-bottom: 16px; */
    border-radius: 8px;
    background-color: rgb(255, 255, 255);
    position: relative;
    overflow: visible;
}

form.checkout h3 {
    text-transform: inherit;
    font-weight: 500
}

.woocommerce-billing-fields {
    border-top: 0px;
}

form.checkout .col-inner.has-border {
    padding: 0px;
    border: 0px;
}

label {
    color: #222;
    font-weight: 400;
}

.post-item .box-text {
    background: #fff;
    border-radius: 0px 8px 8px 0px;
}

.blog-single article.post {
    background: #fff;
    border-radius: 8px;
    padding: 20px
}


.cart-item .nav-dropdown {
    min-width: 350px
}

.button {
    border-radius: 3px
}

a.remove,
a.icon-remove {
    border: 0px;
    font-size: 18px
}


#comments a.btn-reviews-now {
    background-color: #1435c3;
}

span.devvn_num_reviews {
    min-width: 150px;
    color: #1435c3;
    font-size: 14px;
}


#shop-sidebar .widget .is-divider {
    display: none;
}

.woocommerce .is-well.col-inner {
    background: #fff;
    padding: 20px;
    border-radius: 8px;
    border: 0px;
    box-shadow: none
}

.woocommerce-order-details,
.woocommerce-customer-details,
#frame-thanhtoan {
    background: #fff;
    padding: 20px;
    border-radius: 8px;
    margin-bottom: 20px
}

.product-summary .quantity {
    margin-bottom: 0px;
}

.single_add_to_cart_button {
    margin: 0;
}

.cart {
    margin-top: 1.3em;
}

.devvn_readmore_flatsome {
    z-index: 0 !important;
}

/* ================= WooCommerce Product Slider Smooth Navigation ================= */
/* Đơn giản hóa để tránh xung đột với Flatsome */
/* .slider .flickity-slider {
    transition: transform 0.3s ease-out;
    will-change: transform;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
} */

/* Tắt wrap around behavior */
.slider[data-flickity] {
    --flickity-wrap-around: 0;
}

/* Đảm bảo slider không quay về đầu */
.slider .flickity-viewport {
    overflow: hidden;
}

/* Đảm bảo smooth transition */
/* .slider .flickity-slider .product-small {
    transition: none !important;
} */

/* Cải thiện dots navigation */
.slider .flickity-page-dots {
    bottom: 20px;
}

.slider .flickity-page-dots .dot {
    width: 8px;
    height: 8px;
    margin: 0 4px;
    background: rgba(0, 0, 0, 0.3);
    border-radius: 50%;
    transition: all 0.3s ease;
}

.slider .flickity-page-dots .dot.is-selected {
    background: #1435c3;
    transform: scale(1.2);
}

/* Smooth hover effects for navigation buttons */
.slider>.flickity-prev-next-button:hover {
    opacity: 1;
    transform: scale(1.05);
}


/* ================= Custom additions ================= */
/* Offer detail title: add padding */
.box-offer-detail .list-info-offter>.item-offer>.title-offer-detail {
    padding: 20px;
}

/* Card utilities similar to Bootstrap spacing */
.card-body {}

.py-3 {
    padding-top: 1rem;
    padding-bottom: 1rem;
}

.px-3 {
    padding-left: 1rem;
    padding-right: 1rem;
}




/* =========================
 * Product list: Saving banner promotion
 * ========================= */
.banner-promotion {
    position: absolute;
    top: 0;
    left: 10px;
    z-index: 6;
    pointer-events: none;
    transform: translateY(-50%);
}

.banner-promotion-inner {
    height: 36px;
    line-height: 12px;
    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iOTYiIGhlaWdodD0iNDAiIHZpZXdCb3g9IjAgMCA5NiA0MCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICA8cmVjdCB3aWR0aD0iOTYiIGhlaWdodD0iNDAiIHJ4PSI0IiBmaWxsPSJ1cmwoI3BhaW50MF9saW5lYXIpIiAvPgogIDxtYXNrIGlkPSJtYXNrMCIgbWFzay10eXBlPSJhbHBoYSIgbWFza1VuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeD0iMCIgeT0iMCIgd2lkdGg9Ijk2IiBoZWlnaHQ9IjQwIj4KICAgIDxyZWN0IHdpZHRoPSI5NiIgaGVpZ2h0PSI0MCIgcng9IjQiIGZpbGw9IndoaXRlIiAvPgogIDwvbWFzaz4KICA8ZyBtYXNrPSJ1cmwoI21hc2swKSI+CiAgICA8cGF0aCBvcGFjaXR5PSIwLjMiCiAgICAgIGQ9Ik03NC4yNDQ2IC05LjAyODY5TDY1Ljg3NjcgOC45MTYyMUw3MC43NzA4IDExLjE5ODNMNjMuOTI0NCAyNS44ODA1TDg0LjQ3MjQgMTEuNjI5M0w3Ny45NDcgOC41ODY0Mkw5MC41NTgxIC0xLjQyMTU2TDc0LjI0NDYgLTkuMDI4NjlaIgogICAgICBmaWxsPSIjMUIxRDI5IiAvPgogIDwvZz4KICA8ZGVmcz4KICAgIDxsaW5lYXJHcmFkaWVudCBpZD0icGFpbnQwX2xpbmVhciIgeDE9IjM1LjcyMDkiIHkxPSIxLjY2NTQ0ZS0wNiIgeDI9IjU3Ljg4ODYiIHkyPSI0MC4wODczIgogICAgICBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSI+CiAgICAgIDxzdG9wIHN0b3AtY29sb3I9IiNBQTIwRkYiIC8+CiAgICAgIDxzdG9wIG9mZnNldD0iMSIgc3RvcC1jb2xvcj0iIzQxM0VGRiIgLz4KICAgIDwvbGluZWFyR3JhZGllbnQ+CiAgPC9kZWZzPgo8L3N2Zz4=);
    background-repeat: no-repeat;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    padding: .25rem .5rem;
    border-radius: .25rem;
    -webkit-background-size: cover;
    background-size: cover;
}

.banner-promotion-text {
    font-size: 10px;
    color: #fff;
    font-weight: 700;
    letter-spacing: .5px;
}

.banner-promotion-price {
    font-size: 12px;
    color: #fff;
    font-weight: 700;
}



.acf-menu-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
}

.acf-menu-item {
    margin: 0;
}

.acf-menu-item a {
    display: flex;
    align-items: center;
    padding: 8px 12px;
    color: #333;
    text-decoration: none;
    border-radius: 4px;
    transition: all 0.3s ease;
}

.acf-menu-item a:hover {
    background: #007cba;
    color: #fff;
}

.acf-menu-item i {
    margin-right: 8px;
    font-size: 14px;
}



/* Banner Slider Styles */
.acf-banner-slider-wrapper {
    width: 100%;
    position: relative;
    overflow: hidden;
}

.acf-banner-slider {
    position: relative;
    width: 100%;
    height: 300px;
}

.banner-height-small {
    height: 200px;
}

.banner-height-medium {
    height: 300px;
}

.banner-height-large {
    height: 400px;
}

.acf-banner-slides {
    position: relative;
    width: 100%;
    height: 100%;
}

.acf-banner-slide {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    transition: opacity 0.5s ease;
    display: flex;
    align-items: center;
    justify-content: center;
}

.acf-banner-slide.active {
    opacity: 1;
}

.acf-banner-main-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
}

.acf-banner-side-images {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 2;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px;
}

.acf-banner-left-image,
.acf-banner-right-image {
    width: 150px;
    height: 150px;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3);
    animation: float 3s ease-in-out infinite;
}

.acf-banner-right-image {
    animation-delay: 1.5s;
}

.acf-banner-left-image img,
.acf-banner-right-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.acf-banner-content {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
    z-index: 3;
    background: rgba(0, 0, 0, 0.3);
    padding: 20px;
    border-radius: 10px;
    backdrop-filter: blur(5px);
}

.acf-banner-title {
    font-size: 2.5rem;
    font-weight: bold;
    margin: 0 0 10px 0;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
}

.acf-banner-subtitle {
    font-size: 1.2rem;
    margin: 0;
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5);
}

.acf-banner-dots {
    position: absolute;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: 10px;
    z-index: 4;
}

.acf-banner-dot {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.5);
    cursor: pointer;
    transition: all 0.3s ease;
}

.acf-banner-dot.active {
    background: #fff;
    transform: scale(1.2);
}

.acf-banner-dot:hover {
    background: rgba(255, 255, 255, 0.8);
}



/* Responsive Banner */


/* Left/Right Menu Styles */
.acf-left-right-menu {
    position: fixed;
    top: 50%;
    transform: translateY(-50%);
    z-index: 1000;
    pointer-events: none;
}

.acf-menu-position-fixed {
    position: fixed;
}

.acf-menu-position-scroll {
    position: absolute;
}

.acf-menu-position-sticky {
    position: sticky;
    top: 50%;
}

.acf-menu-left {
    position: fixed;
    left: 20px;
    top: 50%;
    transform: translateY(-50%);
    pointer-events: auto;
}

.acf-menu-right {
    position: fixed;
    right: 20px;
    top: 50%;
    transform: translateY(-50%);
    pointer-events: auto;
}

.acf-menu-image {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    object-fit: cover;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3);
    transition: all 0.3s ease;
    cursor: pointer;
}

.acf-menu-image:hover {
    transform: scale(1.1);
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.4);
}

.acf-menu-link {
    display: block;
    text-decoration: none;
}



@media (max-width: 480px) {

    .acf-menu-left,
    .acf-menu-right {
        display: none;
    }
}

/* Top Bar Images Styles */
.acf-top-bar-images {
    width: 100%;
    overflow: hidden;
    position: relative;
}

.acf-image-slider {
    position: relative;
    width: 100%;
    height: 200px;
}

.acf-slide {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    transition: opacity 0.5s ease;
}

.acf-slide.active {
    opacity: 1;
}

.acf-slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.acf-slider-dots {
    position: absolute;
    bottom: 10px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: 8px;
}

.acf-dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.5);
    cursor: pointer;
    transition: background 0.3s ease;
}

.acf-dot.active {
    background: #fff;
}

.acf-image-grid {
    display: flex;
    gap: 10px;
    height: 200px;
}

.acf-image-item {
    flex: 1;
    height: 100%;
}

.acf-image-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}