/*
 Theme Name:   Toddly Child
 Theme URI:    http://vecurosoft.com/products/wordpress/toddly/
 Description:  This is a child theme for Toddly WordPress Theme
 Author:       Vecurosoft
 Author URI:   http://vecurosoft.com/
 Template:     toddly
 Version:      1.0
 License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html
 Tags:         two-columns, three-columns, left-sidebar, right-sidebar, flexible-header, custom-background, custom-colors, custom-header, custom-menu, theme-options, editor-style, featured-images, microformats, post-formats,  sticky-post, threaded-comments, translation-ready
 Text Domain:  toddly-child
*/

/*  [ Add your custom css below ]
- - - - - - - - - - - - - - - - - - - - */

/* Fix GTranslate breaking fonts in English/Other languages */
/* GTranslate often wraps text in <font> tags which may reset styles */
/*font {*/
/*    background-color: transparent !important;*/
/*    box-shadow: none !important;*/
/*    font-family: inherit !important;*/
/*    color: inherit !important;*/
/*}*/

/* Ensure translated text inherits the custom font */
/*.skiptranslate,*/
/*.notranslate {*/
/*    background-color: transparent !important;*/
/*}*/
/* =========================================
   PRODUCT SLIDER FIXES
   ========================================= */

/* 1. Override the rigid Grid Layout when Swiper is active */
.elementor-widget-container .woocommerce.columns-4>.row.swiper,
.related.products ul.products.swiper,
.related.products .products.swiper,
.up-sells ul.products.swiper,
.up-sells .products.swiper {
    display: block !important;
    /* Swiper container must be block, not grid */
    padding: 0 40px !important;
    /* Make room for arrows */
}

.elementor-widget-container .woocommerce.columns-4>.row.swiper .swiper-wrapper,
.related.products ul.products.swiper .swiper-wrapper,
.related.products .products.swiper .swiper-wrapper,
.up-sells ul.products.swiper .swiper-wrapper,
.up-sells .products.swiper .swiper-wrapper {
    display: flex !important;
    /* Restore flex behavior for slides */
    gap: 0 !important;
    /* Swiper handles gap via spaceBetween */
}

.elementor-widget-container .woocommerce.columns-4>.row.swiper .swiper-slide,
.related.products ul.products.swiper .swiper-slide,
.related.products .products.swiper .swiper-slide,
.up-sells ul.products.swiper .swiper-slide,
.up-sells .products.swiper .swiper-slide {
    width: auto;
    /* Let Swiper calculate width */
    margin: 0;
    /* Let Swiper handle margin */
    flex-shrink: 0 !important;
    /* PREVENT SQUASHING */
    height: auto !important;
    box-sizing: border-box !important;
}

/* 2. Fix Card styles to be consistent in slider */
.elementor-widget-container .woocommerce.columns-4>.row.swiper .yumy-card,
.related.products .swiper-slide,
.up-sells .swiper-slide {
    height: 100%;
    /* Ensure equal height if needed */
}

/* 3. Style Navigation Arrows */
.swiper-button-next,
.swiper-button-prev {
    width: 44px !important;
    height: 44px !important;
    background-color: #fff;
    border-radius: 50%;
    color: #402566 !important;
    /* Brand Purple */
    box-shadow: 0 4px 12px rgba(64, 37, 102, 0.15);
    transition: all 0.3s ease;
}

.swiper-button-next::after,
.swiper-button-prev::after {
    font-size: 18px !important;
    font-weight: bold;
}

.swiper-button-next:hover,
.swiper-button-prev:hover {
    background-color: #ff0f7b;
    /* Brand Pink */
    color: #fff !important;
    box-shadow: 0 6px 16px rgba(255, 15, 123, 0.3);
}

/* Adjust Positions */
.swiper-button-prev {
    left: 0 !important;
}

.swiper-button-next {
    right: 0 !important;
}

/* =========================================
   3-LEVEL MENU FIX (REFINE)
   ========================================= */

/* Ensure containers don't clip flyout menus */
.main-menu, 
.main-menu ul, 
.main-menu li {
    overflow: visible !important;
}

/* Show nested menu on hover of its parent LI */
.main-menu ul li:hover > ul.sub-menu {
    visibility: visible !important;
    opacity: 1 !important;
    margin-top: 0 !important;
    z-index: 99 !important;
    display: grid !important; /* Theme uses grid for sub-menus */
}

/* Position and alignment for nested flyouts (Level 3+) */
.main-menu ul.sub-menu li {
    position: relative;
}

.main-menu ul.sub-menu li > ul.sub-menu {
    left: 100% !important;
    top: 0 !important;
    margin-top: -25px !important; /* Align with parent padding */
    margin-left: 0px !important;   /* No gap to avoid losing hover */
    box-shadow: 10px 10px 60px 0px rgba(0, 0, 0, 0.09) !important;
}

/* Fix for transition lag */
.main-menu ul.sub-menu {
    transition: margin-top 0.3s ease, visibility 0.3s ease, opacity 0.3s ease !important;
}

/* Ensure arrows are visible for sub-items with children, but don't double up */
.main-menu ul.sub-menu li.menu-item-has-children > a:after {
    display: block !important;
    content: "" !important; /* Restore empty content so the theme can use it for the hover background */
}

/* Ensure the theme's default arrow (::before) is the only one shown */
.main-menu ul.sub-menu li a::before {
    content: "\f105" !important;
    font-family: var(--vs-icon-font) !important;
}
/* Ensure arrows are visible for sub-items with children */
.main-menu ul.sub-menu li.menu-item-has-children > a:after {
    display: block !important;
    content: "\f105" !important;
    font-family: var(--vs-icon-font) !important;
    float: right;
}

/* =========================================
   SIDEBAR & WIDGET FIXES (LIVE SITE)
   ========================================= */

/* 1. Fix Search Widget Overlap */
.wp-block-search {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: stretch !important;
}

.wp-block-search__input {
    flex: 1 !important;
    height: 65px !important;
    border-radius: 12px 0 0 12px !important;
    border: 1.5px solid rgba(var(--vs-title-color-rgb), 0.1) !important;
    padding-left: 24px !important;
    min-width: 150px !important;
}

.wp-block-search__button {
    height: 65px !important;
    border-radius: 0 12px 12px 0 !important;
    margin-left: -1px !important;
    background-color: var(--vs-theme-color2) !important;
    color: white !important;
    border: none !important;
    padding: 0 25px !important;
    white-space: nowrap !important;
}

/* 2. Fix Product Category Sidebar - KILL FLY-OUTS */
/* Ensure sub-menus are part of the vertical flow */
.widget_product_categories ul.children,
.shop-sidebar .widget ul.wc-block-product-categories-list ul {
    position: static !important;
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    padding: 10px 0 10px 25px !important; /* Indent sub-categories */
    margin: 0 !important;
    border: none !important;
    box-shadow: none !important;
    width: 100% !important;
    background: transparent !important;
    overflow: visible !important;
}

/* Align name, plus sign, and count on ONE row */
.widget_product_categories li.cat-item,
.shop-sidebar .widget ul li {
    display: block !important;
    width: 100% !important;
    list-style: none !important;
}

.widget_product_categories li.cat-item > a,
.shop-sidebar .widget ul li a {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    white-space: nowrap !important; /* Prevents text wrapping */
    width: 100% !important;
    padding: 12px 20px !important;
    border-bottom: 1.5px solid rgba(var(--vs-title-color-rgb), 0.1) !important;
    text-decoration: none !important;
    gap: 10px !important;
}

/* Fix count alignment (push to the right) */
.widget_product_categories .count,
.wc-block-product-categories-list-item__count {
    margin-left: auto !important;
    font-weight: 700 !important;
    opacity: 0.7 !important;
    font-size: 14px !important;
}

/* Remove border from last item */
.widget_product_categories li.cat-item:last-child > a,
.shop-sidebar .widget ul li:last-child > a {
    border-bottom: none !important;
}
.widget .wp-block-heading, .widget h2, .widget .wp-block-search__label{
	display:none;
}

/* 1. Sửa lỗi Fly-out - Buộc danh mục con hiển thị bên dưới */
.widget_product_categories ul.children,
.widget_product_categories ul li:hover > ul.children,
.shop-sidebar .widget ul.wc-block-product-categories-list ul {
    position: static !important;
    left: 0 !important;
    top: 0 !important;
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    padding: 10px 0 10px 25px !important;
    margin: 0 !important;
    border: none !important;
    box-shadow: none !important;
    width: 100% !important;
    background: transparent !important;
    transform: none !important;
}

/* 2. Căn chỉnh hàng ngang: Tên - Dấu cộng - Số lượng */
.widget_product_categories li.cat-item > a,
.shop-sidebar .widget ul li a {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    white-space: nowrap !important;
    width: 100% !important;
    padding: 12px 20px !important;
    border-bottom: 1.5px solid rgba(var(--vs-title-color-rgb), 0.1) !important;
    gap: 10px !important;
}

/* 3. Đẩy số lượng sản phẩm về sát lề phải */
.widget_product_categories .count,
.wc-block-product-categories-list-item__count {
    margin-left: auto !important;
    font-weight: 700 !important;
    font-size: 14px !important;
}


/* If the user's theme uses "Bingo VIP" and it breaks in English, 
   it's likely because the font is not loaded for the English character set 
   (unlikely) OR GTranslate DOM manipulation breaks the cascade. 
   Forcing inherit on 'font' tags usually repairs this. */