/*
Theme Name:   Flatsome Child - Maxweb
Theme URI:    https://maxweb.vn
Description:  Child theme của Flatsome dùng cho khung web mẫu chuẩn nhận diện Maxweb. Kỹ thuật tùy biến code tại đây, không sửa trực tiếp theme cha để đảm bảo cập nhật an toàn.
Author:       Maxweb
Author URI:   https://maxweb.vn
Template:     flatsome
Version:      1.0.0
Text Domain:  flatsome-child
*/
@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100..900;1,100..900&display=swap');
/* =========================================================
   BIẾN MÀU NHẬN DIỆN MAXWEB
   Đổi nhanh nhận diện toàn site tại đây (hoặc chỉnh trong
   plugin Maxweb Setting). Khi có mã màu chính thức của khách,
   thay giá trị bên dưới.
   ========================================================= */
:root {
    --mw-primary: #e30613;      /* Đỏ chủ đạo Maxweb (nút, hotline) */
    --mw-primary-dark: #b30410;
    --mw-secondary: #0068ff;    /* Xanh Zalo / phụ */
    --mw-dark: #1f2733;
    --mw-light: #f7f7f7;
}

/* =========================================================
   CSS TÙY BIẾN CHUNG
   Ghi chú: CSS chi tiết nên viết trong assets/css/custom.css
   để dễ quản lý. File style.css này chủ yếu khai báo theme.
   ========================================================= */

html,body,span,label,a,p,button,b,div {
    font-family: "Roboto", sans-serif;
}
b,h1,h2,h3,h4,h5,h6,:is(h1,h2,h3,h4,h5,h6)>span {
    font-family: "Roboto", sans-serif!important;
}
.header-main, .sec-bg {
    background: linear-gradient(135deg, #8f3f18 0%, #b85a22 50%, #944018 100%);
}
#top-bar .nav>li>a>i+span {
    text-transform: initial;
}
.nav-spacing-xlarge>li {
    margin: 0 18px;
}
.nav-dropdown-default {
    padding: 0;
}
.nav-dropdown.nav-dropdown-default>li>a {
    border-bottom: 1px solid #ececec;
    margin: 0;
    padding-left: 10px;
    padding-right: 10px;
    color: #111;
}
.header-search .button.icon.is-small i {
    top: 1px;
}
.section-title-normal {
    border-bottom: 0;
}
.text-j p{
	text-align: justify;
}
.icon-box-left{
    align-items: center;
}
h3.p-count{
    font-size: 35px;
    margin-bottom: 0;
}
.is-divider, .post_comments.op-7 {
    display: none;
}
.entry-header-text {
    padding: 0;
}
.blog-wrapper h1.entry-title{
	text-align: center;
}
.recent-blog-posts a {
    color: #111;
}
.badge-circle-inside.badge {
    height: 70px;
    width: 70px;
}
.badge-circle-inside .badge-inner {
    border-radius: 5px;
}
.box-text-products{
    text-align: center;
}
.box-text-products a{
    color: #111;
	font-size: 17px;
	font-weight: 600;
}
.product-small.box:hover .box-text-products a{
    color: #b85a22;
}
button.single_add_to_cart_button.button.alt {
    width: calc(100% - 96px);
    float: right !important;
    color: #fff;
    border-radius: 2px;
    right: 0;
}
button.ux-buy-now-button {
    width: 100% !important;
    display: block;
    clear: both;
    float: none;
	border-radius: 2px;
    font-size: 25px;
}


.absolute-footer.dark {
    color: #fff !important;
    background-color: #974219 !important;
    padding: 15px 0;
}
.sec-footer p{
	margin-bottom: 10px;
}

.float-icon-hotline {
                display: block;
                width: 40px;
                position: fixed;
                bottom: 10px;
                left: 17px;
                z-index: 999999;
            }

            .float-icon-hotline ul {
                display: block;
                width: 100%;
                padding-left: 0;
                margin-bottom: 0;
            }

            .float-icon-hotline ul li {
                display: block;
                width: 100%;
                position: relative;
                margin-bottom: 10px;
                cursor: pointer;
            }

            .float-icon-hotline ul li .fa {
                background-color: #ed1c24;
                display: block;
                width: 40px;
                height: 40px;
                text-align: center;
                line-height: 36px;
                -moz-box-shadow: 0 0 5px #888;
                -webkit-box-shadow: 0 0 5px#888;
                box-shadow: 0 0 5px #888;
                color: #fff;
                font-weight: 700;
                border-radius: 50%;
                position: relative;
                z-index: 2;
                border: 2px solid #fff;
            }

            .float-icon-hotline ul li .fa-phone {
                background-color: #ed1c24;
            }

            .float-icon-hotline ul li .fa-zalo {
                background: #009dfe url(/wp-content/uploads/2026/08/zalo-1.png) center center no-repeat;
                background-size: 100%!important;
            }

            .float-icon-hotline ul li .fa-fb {
                background: #0084ff url(/wp-content/uploads/2026/08/messenger.jpg) center center no-repeat !important;
                background-size: 100%!important;
            }

            .float-icon-hotline ul li .fa-skype {
                background: #00adef url(/wp-content/uploads/2026/08/skype.jpg) center center no-repeat !important;
                background-size: 100%!important;
            }

            .animated.infinite {
                animation-iteration-count: infinite;
            }

            .tada {
                animation-name: tada;
            }

            .animated {
                animation-duration: 1s;
                animation-fill-mode: both;
            }

            .float-icon-hotline ul li span {
                display: inline-block;
                padding: 0;
                background-color: #ff6a00;
                color: #fff;
                border: 2px solid #fff;
                border-radius: 20px;
                height: 40px;
                line-height: 36px;
                position: absolute;
                top: 0;
                left: 15px;
                z-index: 0;
                width: 0;
                overflow: hidden;
                -webkit-transition: all 1s;
                transition: all 1s;
                background-color: #ff6a00;
                -moz-box-shadow: 0 0 5px #888;
                -webkit-box-shadow: 0 0 5px#888;
                box-shadow: 0 0 5px #888;
                font-weight: 400;
                white-space: nowrap;
                opacity: 0;
            }

            @media only screen and (min-width: 960px) {
                .float-icon-hotline ul li:hover span {
                    width: 215px;
                    padding-left: 30px;
                    padding-right: 10px;
                    opacity: 1;
                }
            }

            @media only screen and (max-width: 959px) {
                .float-icon-hotline ul {
                    display: flex !important ;
                }

                .float-icon-hotline ul li~li {
                    margin-left: 10px;
                }

                .page-title:not(.featured-title)+main .product-main {
                    padding-top: 0;
                }
            }

            @keyframes tada {
                0% {
                    transform: scale3d(1,1,1);
                }

                10%, 20% {
                    transform: scale3d(.9,.9,.9) rotate3d(0,0,1,-3deg);
                }

                30%, 50%, 70%, 90% {
                    transform: scale3d(1.1,1.1,1.1) rotate3d(0,0,1,3deg);
                }

                40%, 60%, 80% {
                    transform: scale3d(1.1,1.1,1.1) rotate3d(0,0,1,-3deg);
                }

                100% {
                    transform: scale3d(1,1,1);
                }
            }