/*
Theme Name: Loodo Twenty Twenty-Four
Theme URI: https://example.com/loodo-twentytwentyfour
Description: Loodo — child theme of Twenty Twenty-Four.
Author: You
Author URI: https://example.com
Template: twentytwentyfour
Version: 1.0.7
Text Domain: loodo-twentytwentyfour
*/

/* =================================================================atea
 * CSS GRID SYSTEM (Row & Col)
 * ================================================================= */

/* 1. Reset & Cấu trúc chung cho Row */
.row {
  display: flex;
  flex-wrap: wrap;
  margin-left: -15px;
  margin-right: -15px;
}

/* Các biến thể khoảng cách (Gap) của Row */
.row.row-large {
  margin-left: -20px;
  margin-right: -20px;
}
.row.row-large > [class*="col"] {
  padding-left: 20px;
  padding-right: 20px;
}

.row {
  margin-left: -15px;
  margin-right: -15px;
}
.row > [class*="col"] {
  padding-left: 15px;
  padding-right: 15px;
}

.row.row-small {
  margin-left: -10px;
  margin-right: -10px;
}
.row.row-small > [class*="col"] {
  padding-left: 10px;
  padding-right: 10px;
}

.row.row-xsmall {
  margin-left: -5px;
  margin-right: -5px;
}
.row.row-xsmall > [class*="col"] {
  padding-left: 5px;
  padding-right: 5px;
}

/* 2. Cấu trúc mặc định cho Column */
.col {
  position: relative;
  width: 100%;
  min-height: 1px;
  padding-left: 15px;
  padding-right: 15px;
  box-sizing: border-box;
}

/* 3. Hàm tính toán % chiều rộng cho cột (1 tới 12) */
/* Mặc định cơ bản */
.col-1  { width: 8.33333%; }
.col-2  { width: 16.66667%; }
.col-3  { width: 25%; }
.col-4  { width: 33.33333%; }
.col-5  { width: 41.66667%; }
.col-6  { width: 50%; }
.col-7  { width: 58.33333%; }
.col-8  { width: 66.66667%; }
.col-9  { width: 75%; }
.col-10 { width: 83.33333%; }
.col-11 { width: 91.66667%; }
.col-12 { width: 100%; }


/* =================================================================
 * RESPONSIVE BREAKPOINTS
 * Desktop (Large): >= 850px (hoặc 1024px tùy bạn chỉnh)
 * Tablet (Medium): 550px đến 849px
 * Mobile (Small): < 550px
 * ================================================================= */

/* --- SMALL SCREENS (Điện thoại: dưới 550px) --- */
@media (max-width: 549px) {
  .small-col-1  { width: 8.33333%; }
  .small-col-2  { width: 16.66667%; }
  .small-col-3  { width: 25%; }
  .small-col-4  { width: 33.33333%; }
  .small-col-5  { width: 41.66667%; }
  .small-col-6  { width: 50%; }
  .small-col-7  { width: 58.33333%; }
  .small-col-8  { width: 66.66667%; }
  .small-col-9  { width: 75%; }
  .small-col-10 { width: 83.33333%; }
  .small-col-11 { width: 91.66667%; }
  .small-col-12 { width: 100%; }
}

/* --- MEDIUM SCREENS (Tablet: từ 550px đến 849px) --- */
@media (min-width: 550px) and (max-width: 849px) {
  .medium-col-1  { width: 8.33333%; }
  .medium-col-2  { width: 16.66667%; }
  .medium-col-3  { width: 25%; }
  .medium-col-4  { width: 33.33333%; }
  .medium-col-5  { width: 41.66667%; }
  .medium-col-6  { width: 50%; }
  .medium-col-7  { width: 58.33333%; }
  .medium-col-8  { width: 66.66667%; }
  .medium-col-9  { width: 75%; }
  .medium-col-10 { width: 83.33333%; }
  .medium-col-11 { width: 91.66667%; }
  .medium-col-12 { width: 100%; }
}

/* --- LARGE SCREENS (Desktop: từ 850px trở lên) --- */
@media (min-width: 850px) {
  .large-col-1  { width: 8.33333%; }
  .large-col-2  { width: 16.66667%; }
  .large-col-3  { width: 25%;}
  .large-col-4  { width: 33.33333%; }
  .large-col-5  { width: 41.66667%; }
  .large-col-6  { width: 50%; }
  .large-col-7  { width: 58.33333%; }
  .large-col-8  { width: 66.66667%; }
  .large-col-9  { width: 75%; }
  .large-col-10 { width: 83.33333%; }
  .large-col-11 { width: 91.66667%; }
  .large-col-12 { width: 100%; }
}

/* ==========================================================================
   STYLE CHO CÁC THÀNH PHẦN INPUT, SELECT, TEXTAREA
   ========================================================================== */

input[type="text"],
input[type="tel"],
input[type="email"],
input[type="password"],
input[type="number"],
input[type="url"],
input[type="search"],
input[type="date"],
select,
textarea {
    transition-property: all; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms;
    border:1px solid #e4dfd5;
    background-color: rgb(255 255 255 / 1);
    padding:5px 15px;
    min-height:44px;
    border-radius:0px;
    max-width:100%;
    box-sizing: border-box;
    width:100%;
    font-size:1em;
    border-radius:99px;
}
span.wpcf7-form-control-wrap{display:block;}
input::placeholder,
textarea::placeholder {
}

input:focus,
select:focus,
textarea:focus {
    outline:none;
    box-shadow: 0 0 0 2px rgba(242, 109, 32, 0.094);
}

select {
}

select option {
}

textarea {
    height: 70px;
    resize: vertical; 
    padding-top:10px;padding-bottom:10px;
}

.wpcf7-spinner{position: absolute; top: 50%; left: 50%; margin-top: -12px; margin-left: -12px; z-index: 9;}

.wpcf7 input.wpcf7-submit {
    min-height:44px;padding:0px 20px;
    border-width:0px;
    border-radius:0px;
    cursor:pointer;
    color:white!important;
    font-weight:bold;
    text-transform: none;
    background-color:var(--wp--preset--color--accent);
    border-radius:99px;
}
.wpcf7 input.wpcf7-submit.expand{width:100%;}

.wpcf7 input.wpcf7-submit:hover {
        background-color: #233d2d;
}

.wpcf7 form .wpcf7-response-output{box-sizing:border-box;margin-top:15px;margin-bottom:0px;width:100%;margin-right:0px;margin-left:0px;}

.email-form .wpcf7 input.wpcf7-submit{width:100%;}
.gtranslate_wrapper{text-align:right;}
.uagb-icon-list__wrap .uagb-icon-list__source-wrap > img{float:left;}
header .uagb-position__sticky.wp-block-uagb-container{--tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05); --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);}
header ul.wp-block-navigation__container li a:hover,header ul.wp-block-navigation__container li a:hover span,header ul.wp-block-navigation__container li.current-menu-item > a,header ul.wp-block-navigation__container li.current-menu-item > a span{color:#735b30;}

.home-image.wp-block-image > img{width:100%;}
.home-image.wp-block-image{position:relative;}
.home-image.wp-block-image:after{content:"";display:block;position:absolute;bottom:-30px;right:-30px;background-color:#eeebe4;border-radius:20px;width:100%;height:100%;z-index:0;}
.home-image.wp-block-image > *{position:relative;z-index:1;}

.wp-block-image{box-sizing:border-box;}
.wp-block-image img{width:100%;}

.product-list li.wp-block-post{border:1px solid #d0c5b6;border-radius:10px;background-color:white;--tw-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1); --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);}
.product-list li.wp-block-post figure{margin:0px;}
.product-list li.wp-block-post figure img{}
.product-list li.wp-block-post h2{}
.product-list li.wp-block-post h2 a{line-height:1.6em;height:62px;overflow:hidden;}
.product-list li.wp-block-post .wp-block-read-more{background-color:#f4f4f2;text-transform:uppercase;border:1px solid #735b30;color:#735b30;border-radius:5px;min-height:44px;text-align:center;display:flex;flex-direction: column;justify-content: center;align-items:middle;}
.product-list li.wp-block-post .wp-block-read-more:hover{background-color:#735b30;border-color:#735b30;color:white;}

.entry-content h1{font-size:1.8em;}
.entry-content h2{font-size:1.6em;}
.entry-content h3{font-size:1.25em;}
.entry-content h4{font-size:1.125em;}
.entry-content h5{font-size:1em;}
.entry-content h6{font-size:.85em;}

.entry-content blockquote, .entry-content dl, .entry-content figure, .entry-content form, .entry-content ol, .entry-content p, .entry-content pre, .entry-content ul,.entry-content table{margin-bottom: 1.3em;}
.entry-content h1, .entry-content h2, .entry-content h3, .entry-content h4, .entry-content h5, .entry-content h6{margin-bottom: .5em;}
.entry-content img.aligncenter{display:block;margin-left:auto;margin-right:auto;}
.entry-content table{border-collapse: collapse;border-spacing: 0;width:100%;}
.entry-content table th, .entry-content table td{padding:5px 10px;}

.wp-block-query-pagination > a,.wp-block-query-pagination .wp-block-query-pagination-numbers > a, .wp-block-query-pagination .wp-block-query-pagination-numbers > span{display: flex; justify-content: center; align-items: center; min-width: 40px; height: 40px; color: #233d2d !important; background-color:#ede8de; text-shadow: 0 1px 1px rgba(0, 0, 0, .18); position: relative; overflow: hidden; transition: transform .2s ease, box-shadow .2s ease, filter .2s ease, background-position .35s ease !important;filter: grayscale(.65); padding:0px 10px;border-radius:99px;box-sizing: border-box;}
.wp-block-query-pagination > a:hover,.wp-block-query-pagination .wp-block-query-pagination-numbers > a:hover, .wp-block-query-pagination .wp-block-query-pagination-numbers > span.current{opacity:1;background-position: 100% 0 !important;background-color:var(--wp--preset--color--accent);color:white!important;}
.wp-block-query-pagination .wp-block-query-pagination-numbers{display:flex;justify-content: center;align-items: center;gap:10px;margin-left:10px;margin-right:10px;}
.wp-block-query-pagination .wp-block-query-pagination-next-arrow,.wp-block-query-pagination .wp-block-query-pagination-prev-arrow{margin:0px;}
.wp-block-query-pagination .wp-block-query-pagination-previous-arrow{margin:0px;}

.rp4wp-related-posts{margin-top:50px;}
.rp4wp-related-posts ul >li p{margin:0px;}
.rp4wp-related-posts ul >li{margin-bottom:10px;}
.rp4wp-related-posts .rp4wp-related-post-content > a{font-weight: bold; font-size: 1.1em; margin-bottom: 5px; display: block;}

.entry-content.wp-block-post-content.has-global-padding{padding:0px;}
:root :where(.wp-block-list){margin-top:0px;}
h1, h2, h3, h4, h5, h6{margin-top:10px;}
.wp-block-search__button{font-size: 1em; line-height: 1em;}
.header-logo.wp-block-site-logo{align-items: center; display: flex;}
.header-main-menu .wp-block-navigation .current-menu-item > a{font-weight:800;}

:root :where(.wp-block-navigation){font-weight:normal;}
.wp-block-navigation a:hover,.wp-block-navigation a:hover span{}

:root :where(.wp-element-button, .wp-block-button__link),.wc-block-components-button:not(.is-link){border-radius:99px;}
:root :where(.wp-element-button, .wp-block-button__link):hover,.wc-block-components-button:not(.is-link):hover{background-color:#233d2d!important;color:white!important;}

.wp-block-cb-carousel-v2 .cb-button-prev, .wp-block-cb-carousel-v2.cb-rtl .cb-button-next{left:10px;}
.wp-block-cb-carousel-v2 .cb-button-next, .wp-block-cb-carousel-v2.cb-rtl .cb-button-prev{right:10px;}

body.home .breadcrumb-container{display:none;}

.wp-block-uagb-post-grid a img{border-radius:7px;}
.gallery{margin-bottom:1.3em;display:flex;flex-flow: row wrap;}
.gallery .gallery-item{padding: 5px; margin: 0px; box-sizing: border-box;}
.gallery .gallery-item img{width:100%;height:auto!important;}
.gallery.gallery-columns-1 .gallery-item{ 
    flex-basis: 100%;
    max-width: 100%;
}
.gallery.gallery-columns-2 .gallery-item{ 
    flex-basis: 50%;
    max-width: 50%;
}
.gallery.gallery-columns-3 .gallery-item{ 
    flex-basis: 33.3333%;
    max-width: 33.3333%;
}
.gallery.gallery-columns-4 .gallery-item{ 
    flex-basis: 25%;
    max-width: 25%;
}
.gallery.gallery-columns-5 .gallery-item{ 
    flex-basis: 20%;
    max-width: 20%;
}
.gallery.gallery-columns-6 .gallery-item{ 
    flex-basis: 16.6667%;
    max-width: 16.6667%;
}

.carousel-light.wp-block-cb-carousel-v2 .cb-button-next, .carousel-light.wp-block-cb-carousel-v2 .cb-button-prev{color:white;}
.wp-block-cb-carousel-v2 .cb-button-next, .wp-block-cb-carousel-v2 .cb-button-prev{color:black;width: 40px; height: 40px; background-color: #ffffffd9; border-radius: 99px;}
.wp-block-cb-carousel-v2 .cb-button-next:hover, .wp-block-cb-carousel-v2 .cb-button-prev:hover{background-color:var(--wp--preset--color--accent);color:white;}
/*.wp-block-cb-carousel-v2 .cb-button-prev,.wp-block-cb-carousel-v2 .cb-button-next,.uagb-slick-carousel button.slick-arrow{width:40px;height:40px;display:block;opacity:.5;background-size:cover;background-position: center;}
.wp-block-cb-carousel-v2 .cb-button-prev,.uagb-slick-carousel button.slick-arrow.slick-prev{background-image:url('inc/imgs/arrow-left.png');}
.wp-block-cb-carousel-v2 .cb-button-next,.uagb-slick-carousel button.slick-arrow.slick-next{background-image:url('inc/imgs/arrow-right.png');}
.wp-block-cb-carousel-v2 .cb-button-prev:hover,.wp-block-cb-carousel-v2 .cb-button-next:hover,.uagb-slick-carousel button.slick-arrow:hover{opacity:1;}
.wp-block-cb-carousel-v2 .cb-button-prev:after,.wp-block-cb-carousel-v2 .cb-button-next:after{display:none;}

.uagb-slick-carousel button.slick-arrow svg{display:none;}
.uagb-slick-carousel button.slick-arrow.slick-prev{left:0px;}
.uagb-slick-carousel button.slick-arrow.slick-next{right:0px;}*/


.hover-zoom.wp-block-image{overflow:hidden;}
.hover-zoom.wp-block-image img{transition: all 0.3s ease-in-out;transform: scale(1);}
.hover-zoom.wp-block-image:hover img{transform: scale(1.1);}

header.wp-block-template-part{}
#header-search-container{position:fixed;background-color:white;transition: top 0.3s ease-in-out;top:-200px;left:0px;width:100%;}
#header-search-container.active{}

.value-box-item:after{content: ""; position: absolute; top: -1px; right: -1px; width: 17px; height: 17px; border-top: 2px solid rgba(201, 28, 36, .62); border-right: 2px solid rgba(201, 28, 36, .62); pointer-events: none;}

html {
    scroll-behavior: smooth !important;
}
/* Fix bị che tiêu đề nếu có Sticky Header */
[id] {
    scroll-margin-top: 90px; /* Bù trừ chiều cao Header của bạn */
}

.contact-page-form .wpcf7-submit{width:100%;}

.wc-block-components-product-sale-badge{background-color:var(--wp--preset--color--accent);color:white;border-radius:99px;border-width:0px;font-size:0.9em;padding:4px 10px 0px;}
ul.wp-block-woocommerce-product-template{}
ul.wp-block-woocommerce-product-template > li.wc-block-product{overflow:hidden;background-color: white; border: 1px solid #e8e8eb; border-radius: 20px;transition: all 0.3s ease-in-out;}
ul.wp-block-woocommerce-product-template > li.wc-block-product:hover{transform: translateY(-5px);box-shadow: 0 10px 22px rgba(23, 23, 26, .055) !important;border-color: var(--wp--preset--color--accent);}
ul.wp-block-woocommerce-product-template > li.wc-block-product:hover .wc-block-components-product-image img{transform: scale(1.05);}
ul.wp-block-woocommerce-product-template > li.wc-block-product .wc-block-components-product-image{-webkit-border-top-left-radius: 20px; -webkit-border-top-right-radius: 20px; -moz-border-radius-topleft: 20px; -moz-border-radius-topright: 20px; border-top-left-radius: 20px; border-top-right-radius: 20px;padding:0px;margin:0px;background: #fff; border-bottom: 1px solid #ededf0;}
ul.wp-block-woocommerce-product-template > li.wc-block-product .wc-block-components-product-image img{transition: all 0.3s ease-in-out;}
ul.wp-block-woocommerce-product-template > li.wc-block-product .product-info{padding:20px 15px;}
ul.wp-block-woocommerce-product-template > li.wc-block-product .wp-block-button.wc-block-components-product-button{gap:0px;}
ul.wp-block-woocommerce-product-template > li.wc-block-product .wp-block-button.wc-block-components-product-button .wp-block-button__link{margin-bottom:0px!important;color:#233d2d;background-color:#ede8de;}
ul.wp-block-woocommerce-product-template > li.wc-block-product .wp-block-button.wc-block-components-product-button a.added_to_cart{padding:0px;}
.woocommerce.wc-block-store-notices.alignwide{max-width:100%;}
.woocommerce .wp-block-woocommerce-product-image-gallery{max-width:100%;}
.wc-block-product-gallery-thumbnails__scrollable .wc-block-product-gallery-thumbnails__thumbnail{}
.wc-block-product-gallery-thumbnails__scrollable .wc-block-product-gallery-thumbnails__thumbnail img{border-radius: 10px;}
:where(.wc-block-product-gallery-thumbnails--active-outline .wc-block-product-gallery-thumbnails__thumbnail__image--is-active){border-color:var(--wp--preset--color--accent);}

.wc-block-product-filter-chips__item{min-height: 40px; padding: 5px 15px; font-weight: bold; text-transform: uppercase;}
.wc-block-product-filter-chips__item[aria-checked=true]{background-color:var(--wp--preset--color--accent);}

.wp-block-add-to-cart-with-options .wc-block-components-product-stock-indicator{margin:1em 0px!important;}
.wp-block-add-to-cart-with-options .wp-block-group{gap:10px;}

section.products{max-width:100%!important;margin:0px 0px 30px!important;}
section.products > h2{margin:0px 0px 30px!important;}

.woocommerce .products ul, .woocommerce ul.products{}
.woocommerce .products ul > li, .woocommerce ul.products > li{}
fieldset{margin-bottom:1em;}
.wc-block-components-button{min-height:40px;font-size:0.9em;border-radius: 0px;box-sizing: border-box;}
.woocommerce-address-fields .woocommerce-address-fields__field-wrapper{margin-bottom:1em;}
.woocommerce form .form-row{margin-bottom:10px;}
.woocommerce form .form-row label{line-height:1.2em;}

header .wp-block-search .wp-block-search__button{position: absolute; top: 0px; right: 0px;margin:0px;padding: 0px; width: 44px; height: 44px;border:1px solid #e4dfd5;background-color:transparent;color:#1e221e;}
header .wp-block-search .wp-block-search__button:hover{border-color:var(--wp--preset--color--accent);color:var(--wp--preset--color--accent);}
header .wp-block-search .wp-block-search__input{padding-right:54px;}

.newsletter-form{position:relative;}
.newsletter-form .wpcf7-submit{position:absolute;top:0px;right:0px;margin:0px;}

.box-product-hover.wp-block-uagb-container{transition: all 300ms;overflow:hidden; border-radius:20px;}
.box-product-hover.wp-block-uagb-container:hover{transform: translateY(-5px); box-shadow: 0 10px 22px rgba(23, 23, 26, .055) !important;}
.box-product-hover.wp-block-uagb-container .wp-block-post-featured-image img{}


@media only screen and (max-width:976px) {
  
    .medium-text-center .wp-block-paragraph,.medium-text-center{text-align:center!important;margin-left:auto;margin-right:auto;}
    .medium-text-justify .wp-block-paragraph,.medium-text-justify.wp-block-paragraph{text-align:justify!important;margin-left:auto;margin-right:auto;}
    .medium-text-center.wp-block-navigation,.medium-text-center .wp-block-navigation{justify-content: center;}
}

@media only screen and (max-width:767px) {
    .gallery.gallery-columns-4 .gallery-item,.gallery.gallery-columns-5 .gallery-item,.gallery.gallery-columns-6 .gallery-item{
        flex-basis: 33.3333%;
        max-width: 33.3333%;
    }
    /*2 columns*/
    .wc-block-product-template__responsive.columns-3,.wc-block-product-template__responsive.columns-4{grid-template-columns: repeat(auto-fill,minmax(max(150px,calc(50% - .83333em)),1fr));}
}
@media only screen and (max-width:480px) {
    .gallery.gallery-columns-3 .gallery-item,.gallery.gallery-columns-4 .gallery-item,.gallery.gallery-columns-5 .gallery-item,.gallery.gallery-columns-6 .gallery-item{
        flex-basis: 50%;
        max-width: 50%;
    }
    .wc-block-product-template__responsive.columns-3,.wc-block-product-template__responsive.columns-4{grid-template-columns: 100%;}
}

@media (min-width: 1025px){body .uag-hide-desktop.uagb-google-map__wrap,body .uag-hide-desktop{display:none !important}}@media (min-width: 768px) and (max-width: 1024px){body .uag-hide-tab.uagb-google-map__wrap,body .uag-hide-tab{display:none !important}}@media (max-width: 767px){body .uag-hide-mob.uagb-google-map__wrap,body .uag-hide-mob{display:none !important}}