/*
Theme Name: Flatsome Child
Description: This is a child theme for Flatsome Theme
Author: UX Themes
Template: flatsome
Version: 3.0
*/

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

.no-margin {margin: 0 !important}
.no-margin > * {margin: 0 !important}
.no-paddding {padding: 0 !important}
.no-paddding > *{padding: 0 !important}
.absolute-footer {display: none;}


:root {
    --primary-color: #b5121b;
    --secondary-color: #d4af37;
    --base-color: #2B1B17;
    --heading-color: #3B1E14;
    --gradient-color: linear-gradient(135deg, #B5121B, #D4AF37) ;
    --gradient-color-2: linear-gradient(135deg, #FFD700 0%, #FFA500 100%);
    --border-radius: 20px;
}
body, html {scroll-behavior: smooth;}
.btn-website {padding-top: 10px; padding-bottom: 10px; border-radius: 10px; font-size: 1.2rem; font-weight: 500;}
.row-about .col-inner {height: 100%;}
.row-about .img, .row-about .img-inner, .row-about .img-inner img {height: 100%;}
.row-about .img-inner img {object-fit: cover;}
.img-border-radius img {border-radius: var(--border-radius);}
.text-banner h1 {font-size: 2rem; font-weight: 700; -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; background-image: var(--gradient-color-2);}
.text-banner p {margin-bottom: 0; font-weight: 400; font-size: 1.2rem;}
.title-website {margin-bottom: 50px; position: relative;}
.title-website::after {position: absolute; content: ''; width: 100px; height: 3px; background-image: var(--gradient-color); bottom: -20px; left: calc(50% - 50px);}
.title-website h2 {font-size: 2rem; font-weight: 700; position: relative; display: inline; z-index: 1;}
.title-website h2::after {position: absolute; content: ''; background-image: url(./assets/images/petals.png); top: 0; right: -15px; background-repeat: no-repeat; width: 35px; height: 35px; background-size: contain; display: inline-block; z-index:-1;}
.title-website h2::before {position: absolute; content: ''; background-image: url(./assets/images/sakura.png); top: 0; left: -15px; background-repeat: no-repeat; width: 35px; height: 35px; background-size: contain; display: inline-block; z-index:-1;}
.title-website.m h2::after {background-image: url(./assets/images/hoamai1.png); width: 40px; height: 40px;}
.title-website.m h2::before {background-image: url(./assets/images/hoamai2.png); width: 40px; height: 40px;}

.text-about-us h3 {font-size: 1.6rem; margin-bottom: 1.5rem; line-height: 1.2;}
.text-about-us p {font-size: 1.1rem; line-height: 1.6; margin-bottom: 2rem;}
.row-number-about-us .col-inner {border-radius: var(--border-radius); border: 1px solid var(--secondary-color); background: linear-gradient(-135deg, rgba(181, 18, 27, 0.2), rgba(212, 175, 55, 0.2)); height: 100%;}
.row-number-about-us .text h5 span, .row-number-about-us .text h5{background-image: var(--gradient-color); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; font-size: 1.8rem; font-weight: 700; margin-bottom: 0;}
.row-number-about-us .text p {margin-bottom: 0; font-family: 0.9rem;}
.row-number-about-us .col-inner {position:relative; overflow: hidden;}
.row-number-about-us .col-inner::after {content: ''; position: absolute; top: -30px; right: -30px; width: 160px; height: 160px; border-radius: 50%; border: 2px solid rgba(212, 175, 55, 0.25); filter: blur(0.2px);}

#main {background: linear-gradient(-135deg,rgba(181, 18, 27, 0.1), rgba(212, 175, 55, 0.1)) !important;}
#footer {background: linear-gradient(-135deg,rgba(212, 175, 55, 0.1), rgba(212, 175, 55, 0.1)) !important;}
.section-products::after {position: absolute; content: unset; top: 0px; right: -20px; background-image: url(./assets/images/longden.png); width: 300px; height: 500px; background-size: contain; background-repeat: no-repeat;}
.section-products-1::before {position: absolute; content: unset; top: 0px; left: 0px; background-image: url(./assets/images/hoamaip.png); width: 300px; height: 500px; background-size: contain; background-repeat: no-repeat;}
.section-products-2::after {position: absolute; content: unset; top: 0px; right: 0px; background-image: url(./assets/images/dao2.png); width: 300px; height: 500px; background-size: contain; background-repeat: no-repeat;}
.product-small.box .box-image{ border-top-left-radius: var(--border-radius); border-top-right-radius: var(--border-radius); overflow: hidden;} 
.product-small.box .box-text {padding: 1.2rem; background: #fff; border-bottom-left-radius: var(--border-radius); border-bottom-right-radius: var(--border-radius);}
.product-small.box .box-text .product-title a { font-size: 1rem; font-weight: 700; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis;}
.product-small.box .box-text .product-title {margin-bottom: 1rem;}
.product-small.box .box-text .price-wrapper {margin-bottom: 1.5rem;}
.product-small.box .box-text .price-wrapper bdi { color: var(--primary-color); font-size: 1.2rem; font-weight: 700;}
.product-small.box .box-text .price-wrapper del bdi {font-size: 0.8rem; color: #766e6e;}
.product-small.box .box-text .price-wrapper .price {display:flex; flex-direction: row-reverse; align-items: flex-end; gap: 10px; justify-content: start;}
.product-small.box .box-text .add-to-cart-button {width: 100%;}
.product-small.box .box-text .add-to-cart-button a {margin-top: 0; width: 100%; display: inline-block; border-radius: 5px; height: 35px; margin-right: 0; line-height: 35px; background: var(--gradient-color-2); border: 0; color: #000;}
.product-small.box .box-text .added_to_cart {display: none;}
.product-lightbox {background: transparent; box-shadow: none;}
.product-quick-view-container {border-radius: var(--border-radius); background: linear-gradient(180deg, rgba(255, 255, 255, .03), rgba(255, 255, 255, .02)); border: 1px solid rgba(255, 255, 255, .06); overflow: hidden;}
.product-lightbox-inner {background: #fff; height: 100%;}
.product-lightbox-inner .plain h1 {margin-bottom: 18px;}
.product-lightbox-inner .is-divider {display: none;}
.product-lightbox-inner .price-wrapper {margin-bottom: 25px;}
.product-lightbox-inner .price-wrapper bdi {color: var(--primary-color); font-size: 2rem;}
.product-lightbox-inner .quantity.buttons_added input.minus{border-top-left-radius: 5px; border-bottom-left-radius: 5px;}
.product-lightbox-inner .quantity.buttons_added input.plus{border-top-right-radius: 5px; border-bottom-right-radius: 5px;}
.product-lightbox-inner input {box-shadow: unset;}
.product-lightbox-inner input:focus {box-shadow: unset;}
.product-lightbox-inner .single_add_to_cart_button {border-radius: 5px; background-image: var(--gradient-color-2); border: 0; color: #000;}

.col-special-offers .col-inner{border: 1px solid #ffffff33; border: 1px solid var(--secondary-color); background-image: linear-gradient(-135deg,rgba(181, 18, 27, 0.2), rgba(212, 175, 55, 0.2));}
.col-special-offers .icon-box .icon-box-text h3 {color: var(--primary-color); font-size: 1.5rem;}
.col-special-offers .icon-box .icon-box-text p {margin-bottom: 0; font-size: 1rem;}

.slider-clients .flickity-slider .row {margin-right: 5px; opacity: 1;}
.slider-clients .flickity-slider .row > .col {padding-bottom: 0;}
.col-partners .col-inner{border: 1px solid var(--secondary-color); border-radius: 10px;}
.col-partners .col-inner img {vertical-align: middle; object-fit: contain;}
.wpcf7-spinner {display: none;}

.form-contact {border-radius: var(--border-radius); background: linear-gradient(-135deg,rgba(181, 18, 27, 0.2), rgba(212, 175, 55, 0.2)); padding: 1.2rem;}
.form-contact input {margin-bottom: 0; height: 50px; box-shadow: none; border-radius: 5px; border: 0;}
.form-contact textarea {margin-bottom: 0; box-shadow: none; border-radius: 5px; border: 0;}
.form-contact .label {margin-bottom: 10px; font-weight: 600;}
.form-contact .label span {color: var(--primary-color); display: inline-block; margin-left: 5px;}
.form-contact button {border-radius: 5px; text-transform: inherit; padding: 10px 50px;}

.section-partners::before {position: absolute; content: unset; background-image: url(./assets/images/canhdao.png); background-size: contain; background-repeat: no-repeat; width: 500px; height: 300px; left: -7px; top: 0;}

.title-footer h3 {color: var(--primary-color); font-size: 1.3rem; margin-bottom: 1.5rem;}
.menu-footer i {color: var(--primary-color);}
.section-footer::before {position: absolute; content: ''; background-image: url(./assets/images/longden2.png); background-size: contain; width: 100%; height: 70px; left: 0; top: 0px;}

.tabbed-content a[role="tab"] {padding: 2px 30px; border-radius: 50px;  color: #000; background: #fff;}
.tabbed-content .active a[role="tab"] {background: var(--gradient-color-2); color: #000;}
.tabbed-content a[role="tab"] {margin-right: 10px; margin-bottom: 10px;}
.tabbed-content li:last-child a[role="tab"] {margin-right: 0;}
.tabbed-content .tab-panels {padding-top: 50px;}
.icon-box-wc {margin-bottom: 30px;}
.icon-box-wc:last-child {margin-bottom: 0;}
.icon-box-wc h4 {font-size: 1.2rem; margin-bottom: 0; color: var(--primary-color);}
.icon-box-wc p {margin-bottom: 0;}
.col-wc .col-inner {background: linear-gradient(-135deg, rgba(181, 18, 27, 0.2), rgba(212, 175, 55, 0.2)); height: 100%;}
.added_to_cart {display: none !important;}
.on-sale {background: var(--primary-color) !important; }
.on-sale .onsale {font-size: 20px;}
.section-advise .title-website {margin-bottom: 40px;}
.row-special .col-inner {height: 100%;}
.callout {height: 4rem; width: 4rem;}
/* md */
@media (min-width: 768px) {  
    .text-banner h1 {font-size: 3rem;}
    .text-banner p {font-size: 1.4rem;}
    .title-website {margin-bottom: 60px;}
    .product-small.box .box-text .product-title a {font-size: 0.9rem;}
    .product-small.box .box-text .price-wrapper bdi {font-size: 1.5rem;}
    .product-small.box .box-text {padding: 1.5rem;}
    .text-banner p { font-size: 1.6rem;}
    .text-about-us h3 {font-size: 1.8rem;}
    .form-contact {padding: 2rem;}
    .tabbed-content a[role="tab"] {margin-right: 20px;}
    .tabbed-content a[role="tab"] {padding: 5px 30px;}
}

/* lg */
@media (min-width: 992px) { 
    .row-no-padding-bottom > .col {padding-bottom: 0 !important;}
    .text-banner h1 {font-size: 4rem;}
    .title-website {margin-bottom: 70px;}
    .title-website h2 {font-size: 2.5rem;}
    .section-products::after {content: '';}
    .section-products-1::before {content: '';}
    .section-products-2::after {content: '';}
    .section-partners::before {content: '';}
    .text-banner p { font-size: 1.8rem;}
    .text-about-us h3 {font-size: 2rem;}
    .form-contact {padding: 3rem;}
    .tabbed-content ul.nav {width: 100% !important;}
    .tabbed-content a[role="tab"] {padding: 8px 30px;}
}