/* 
Theme Name: Hello Elementor Child
Theme URI: https://github.com/elementor/hello-theme-child/
Description: Hello Elementor Child is a child theme of Hello Elementor, created by Elementor team
Author: Elementor Team
Author URI: https://elementor.com/
Template: hello-elementor
Version: 2.0.0
Text Domain: hello-elementor-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/

/* Add your custom styles here */

/* Hide ONLY the brands filter initially - more specific targeting */
.jet-checkboxes-list[data-query-var="product_brand"] {
    display: none !important;
}

/* Target only the brands filter widget container */
.elementor-widget-jet-smart-filters-checkboxes:has(.jet-checkboxes-list[data-query-var="product_brand"]) {
    display: none !important;
}

/* Show loading state for brands filter only */
.jet-checkboxes-list[data-query-var="product_brand"].loading-brands {
    display: block !important;
    min-height: 100px;
    position: relative;
    background: #f9f9f9;
    border-radius: 4px;
    border: 1px solid #e0e0e0;
}

/* Show the parent container when brands are loading */
.elementor-widget-jet-smart-filters-checkboxes:has(.jet-checkboxes-list[data-query-var="product_brand"].loading-brands) {
    display: block !important;
}

.jet-checkboxes-list[data-query-var="product_brand"].loading-brands .jet-list-tree {
    display: none;
}

.jet-checkboxes-list[data-query-var="product_brand"].loading-brands::before {
    content: 'Loading available brands...';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 14px;
    color: #666;
    background: white;
    padding: 15px 25px;
    border-radius: 4px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
    animation: pulse 1.5s infinite;
}

@keyframes pulse {
    0%, 100% { opacity: 0.7; }
    50% { opacity: 1; }
}

/* When brands are ready to show - show parent container */
.elementor-widget-jet-smart-filters-checkboxes:has(.jet-checkboxes-list[data-query-var="product_brand"].brands-ready) {
    display: block !important;
    animation: fadeIn 0.5s ease-in;
}

/* Show brands filter when ready */
.jet-checkboxes-list[data-query-var="product_brand"].brands-ready {
    display: block !important;
    animation: fadeIn 0.5s ease-in;
}

.jet-checkboxes-list[data-query-var="product_brand"].brands-ready .jet-list-tree {
    display: block;
}

@keyframes fadeIn {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
}

/* Disabled brand items */
.jet-checkboxes-list__row.disabled,
.jet-filter-row.disabled { 
    display: none !important; 
}

/* Smooth transitions */
.jet-checkboxes-list__row,
.jet-filter-row {
    transition: all 0.3s ease;
}

/* When updating categories */
.jet-checkboxes-list[data-query-var="product_brand"].updating {
    opacity: 0.6;
    pointer-events: none;
}

.woocommerce-message {
    border-top-color: #000 !important; /* Changes the left border to black */
}

.woocommerce-message::before {
    color: #515151 !important; /* Changes the icon color to black */
}
/* Keep only the top border and make it black */
.woocommerce-message {
    border: none !important; /* Remove all borders first */
    border-top: 2px solid #000 !important; /* Add only top border in black */
    box-shadow: none !important; /* Remove any shadow that might create border-like appearance */
}

/* Change the icon color to black */
.woocommerce-message::before {
    color: #000 !important;
}

/* Remove all borders from WooCommerce messages */
.woocommerce-message,
.e-woocommerce-notices-wrapper,
.woocommerce-notices-wrapper {
    border: none !important;
    box-shadow: none !important;
}

/* Change the icon color to black */
.woocommerce-message::before {
    color: #000 !important;
}

/* More aggressive border removal */
.woocommerce-message,
.e-woocommerce-notices-wrapper,
.woocommerce-notices-wrapper,
.woocommerce-message * {
    border: 0 !important;
    box-shadow: none !important;
    outline: none !important;
}

.elementor-widget-woocommerce-checkout-page .woocommerce-info {
    background-color: transparent;
    border-top-color: transparent;
    padding: 13px 00px 00px 50px;
}

/* Filter styling */
.yith-wcan-filters .yith-wcan-filter .filter-title {
    color: var(--yith-wcan-filters_colors_titles, #434343);
    font-size: 18px;
    font-weight: 800;
}
.yith-wcan-filters .yith-wcan-filter .filter-items .filter-item > a, .yith-wcan-filters .yith-wcan-filter .filter-items .filter-item > label > a {
    color: var(--yith-wcan-anchors_style_text, #434343);
    text-decoration: none;
    font-size: 14px;
    font-weight: 400;
}
.elementor-menu-cart__product .elementor-menu-cart__product-image {
    display: none !important;
}
.elementor-menu-cart__product {
    grid-template-columns: 1fr auto auto !important;
}

.woosb-alert {
    color: #000000 !important;
}

/* First, target ALL rows with maximum specificity to override any theme styling */
body .woocommerce-grouped-product-list-item,
body tr.woocommerce-grouped-product-list-item,
body table.woocommerce-grouped-product-list tr,
body table.group_table tr,
body .group_table tbody tr,
body .woocommerce table.group_table tr {
    background-color: white !important;
}

/* Explicitly target odd rows which are commonly styled differently */
body .woocommerce-grouped-product-list-item:nth-child(odd),
body tr.woocommerce-grouped-product-list-item:nth-child(odd),
body table.group_table tr:nth-child(odd),
body .woocommerce table.group_table tr:nth-child(odd) {
    background-color: white !important;
}

/* Explicitly target even rows for consistency */
body .woocommerce-grouped-product-list-item:nth-child(even),
body tr.woocommerce-grouped-product-list-item:nth-child(even),
body table.group_table tr:nth-child(even),
body .woocommerce table.group_table tr:nth-child(even) {
    background-color: white !important;
}

/* Style for quantity inputs with 2px solid black border */
.woocommerce-grouped-product-list-item .quantity input {
    background-color: white !important;
    border: 2px solid black !important;
    color: black !important;
    padding: 8px !important;
}

/* Make quantity arrows always visible */
.woocommerce-grouped-product-list-item .quantity input[type=number]::-webkit-inner-spin-button,
.woocommerce-grouped-product-list-item .quantity input[type=number]::-webkit-outer-spin-button {
    opacity: 1 !important;
    visibility: visible !important;
}

/* Fix vertical alignment of product titles with quantity fields */
.woocommerce-grouped-product-list-item__label {
    vertical-align: middle !important;
}

.woocommerce-grouped-product-list-item__quantity {
    vertical-align: middle !important;
}

/* Make product rows clickable */
.woocommerce-grouped-product-list-item__label a,
.woocommerce-grouped-product-list-item__label label {
    cursor: pointer !important;
    pointer-events: auto !important;
}

/* Fix a common issue where WooCommerce themes disable pointer events */
.woocommerce-grouped-product-list-item {
    pointer-events: auto !important;
}

/* Remove any hover effects that might be changing background color */
.woocommerce-grouped-product-list-item:hover,
.woocommerce table.group_table tr:hover {
    background-color: white !important;
}

/* Force the table to use standard box model */
.woocommerce table.group_table {
    border-collapse: separate !important;
    border-spacing: 0 !important;
}

/* Grouped product css */

.woocommerce table.group_table, .woocommerce table.group_table tr, .woocommerce table.group_table td {
    border-collapse: separate !important;
    border: none !important;
    border-spacing: 0 8px !important;
    background: #ffffff !important;
}

/* Set all text in grouped product tables to black */
.woocommerce-grouped-product-list tr.woocommerce-grouped-product-list-item td,
.woocommerce-grouped-product-list tr.woocommerce-grouped-product-list-item td a,
.woocommerce-grouped-product-list tr.woocommerce-grouped-product-list-item td label,
.woocommerce-grouped-product-list tr.woocommerce-grouped-product-list-item td span {
    color: #000 !important;
}

/* Ensure product names/links are also black */
.woocommerce-grouped-product-list-item__label a {
    color: #000 !important;
}

/* Ensure price text is black */
.woocommerce-grouped-product-list-item__price {
    color: #000 !important;
}

/* Target all navigation links within the mega menu */
.jet-mega-menu-mega-container__inner .elementor-nav-menu--main .elementor-nav-menu a {
    color: #ffffff !important;
}

/* Target specifically the item links in each section */
.elementor-element-de9e4b2 .elementor-nav-menu a,
.elementor-element-d01b32a .elementor-nav-menu a,
.elementor-element-d322129 .elementor-nav-menu a,
.elementor-element-a1b4922 .elementor-nav-menu a {
    color: #ffffff !important;
}

/* Target all anchor elements in the mega menu container */
.elementor-4380 a {
    color: #ffffff !important;
}

/* Target the menu items on product pages specifically */
.single-product .elementor-element-5f7a006 .jet-mega-menu-list .jet-mega-menu-item__inner,
.single-product .elementor-element-5f7a006 .jet-mega-menu-item__link,
.single-product .elementor-element-5f7a006 .jet-mega-menu-item__label img,
.single-product .elementor-element-b4bf7c0 .jet-mega-menu-item__label,
.single-product .elementor-element-b4bf7c0 .jet-mega-menu--location-elementor .jet-mega-menu-item__link {
    color: #ffffff !important; /* Force white color */
}

/* Target mobile menu toggle on product pages */
.single-product .jet-mega-menu-toggle-icon svg path {
    stroke: #ffffff !important; /* Make the hamburger menu icon white */
}

/* Target the mega menu when opened on product pages */
.single-product .elementor-4380 a,
.single-product .elementor-4380 .elementor-element .elementor-nav-menu a {
    color: #ffffff !important;
}

/* Target the menu cart icon on product pages */
.single-product .elementor-element-651823e .elementor-menu-cart__toggle-icon svg path {
    stroke: #ffffff !important; /* Make the cart icon white */
}

/* Ensure all header text is white on product pages */
.single-product .elementor-element-5f7a006 * {
    color: #ffffff !important; 
}

/* Fix phone and email items in the header */
.single-product .elementor-icon-list-text {
    color: #ffffff !important;
}

/* Force categories to appear after title in JetWooBuilder product listings */
.jet-woo-builder-product .jet-woo-products__inner-box {
    display: flex !important;
    flex-direction: column !important;
}

.jet-woo-builder-product .jet-woo-product-thumbnail {
    order: 1 !important;
}

.jet-woo-builder-product .jet-woo-product-title {
    order: 2 !important;
    margin-bottom: 5px !important;
}

.jet-woo-builder-product .jet-woo-product-categories {
    order: 3 !important;
    margin-top: 0 !important;
}

.jet-woo-builder-product .jet-woo-products-cqw-wrapper {
    order: 4 !important;
}

/* Ensure category text styling is appropriate */
.jet-woo-product-categories ul li {
    font-size: 1em !important;
    opacity: 0.8 !important;
}

/* Dependent Filters Styling */

/* Loading state for brand filter */
.jet-smart-filters-taxonomy.loading {
    opacity: 0.7;
    pointer-events: none;
    position: relative;
}

.jet-smart-filters-taxonomy.loading::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(255, 255, 255, 0.8);
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Disabled/hidden brand items */
.jet-smart-filters-taxonomy__item.disabled,
.jet-smart-filters-term.disabled {
    opacity: 0.4;
    transition: opacity 0.3s ease;
}

/* Hide disabled items completely (optional) */
.jet-smart-filters-taxonomy__item.disabled {
    display: none;
}

/* Smooth transitions for show/hide */
.jet-smart-filters-taxonomy__item,
.jet-smart-filters-term {
    transition: all 0.3s ease;
}

/* Style for filter sections */
.dependent-filters-section {
    margin-bottom: 30px;
}

.dependent-filters-section h3 {
    margin-bottom: 15px;
    font-weight: 600;
    color: #333;
}

/* Better spacing between checkboxes */
.jet-smart-filters-taxonomy__item {
    margin-bottom: 8px;
}

.jet-smart-filters-taxonomy__item label {
    display: flex;
    align-items: center;
    cursor: pointer;
    padding: 5px 0;
}

.jet-smart-filters-taxonomy__item input[type="checkbox"] {
    margin-right: 8px;
}

/* Fix cart dropdown footer buttons visibility */
.elementor-menu-cart__footer-buttons {
    display: flex !important;
    gap: 10px !important;
    margin-top: 15px !important;
    padding: 10px 0 !important;
}

.elementor-menu-cart__footer-buttons .elementor-button {
    flex: 1 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 12px 16px !important;
    min-height: 44px !important;
    text-decoration: none !important;
    border-radius: 4px !important;
    font-weight: 500 !important;
    transition: all 0.3s ease !important;
}

/* Both buttons with same whitish styling */
.elementor-menu-cart__footer-buttons .elementor-button--view-cart,
.elementor-menu-cart__footer-buttons .elementor-button--checkout {
    background-color: #f8f9fa !important;
    color: #333333 !important;
    border: 1px solid #dee2e6 !important;
}

.elementor-menu-cart__footer-buttons .elementor-button--view-cart:hover,
.elementor-menu-cart__footer-buttons .elementor-button--checkout:hover {
    background-color: #e9ecef !important;
    color: #000000 !important;
    border-color: #ced4da !important;
}

/* Ensure button text is visible */
.elementor-menu-cart__footer-buttons .elementor-button-text {
    display: block !important;
    font-size: 14px !important;
    line-height: 1.4 !important;
    color: inherit !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* Override any conflicting styles */
.elementor-menu-cart__footer-buttons .elementor-button * {
    color: inherit !important;
}

/* Mobile responsive adjustments */
@media (max-width: 768px) {
    .elementor-menu-cart__footer-buttons {
        flex-direction: column !important;
    }
    
    .elementor-menu-cart__footer-buttons .elementor-button {
        width: 100% !important;
        margin-bottom: 8px !important;
    }
}

/* Force cart dropdown to show quantity with persistent styling */
.elementor-menu-cart__product-price {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* Fix cart dropdown items alignment */
.elementor-menu-cart__products {
    display: flex !important;
    flex-direction: column !important;
    padding: 0 !important;
    margin: 0 !important;
    list-style: none !important;
}

.elementor-menu-cart__product {
    display: flex !important;
    align-items: flex-start !important;
    padding: 15px 0 !important;
    margin: 0 !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
    gap: 12px !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

.elementor-menu-cart__product:last-child {
    border-bottom: none !important;
}

/* Product image container */
.elementor-menu-cart__product-image {
    flex-shrink: 0 !important;
    width: 60px !important;
    height: 60px !important;
    margin: 0 !important;
    overflow: hidden !important;
    border-radius: 4px !important;
}

.elementor-menu-cart__product-image img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}

/* Product content area */
.elementor-menu-cart__product-name {
    flex: 1 !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1.3 !important;
}

.elementor-menu-cart__product-name a {
    color: #ffffff !important;
    text-decoration: none !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    display: block !important;
    margin-bottom: 5px !important;
}

/* Quantity display */
.elementor-menu-cart__product-price {
    flex-shrink: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    text-align: right !important;
}

/* Remove button */
.elementor-menu-cart__product-remove {
    flex-shrink: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    width: 20px !important;
    height: 20px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

/* Reset any inherited list styles */
.elementor-menu-cart__products * {
    box-sizing: border-box !important;
}

/* Ensure proper spacing in cart container */
.elementor-menu-cart__main {
    padding: 20px !important;
}

/* Fix container width issues */
.elementor-menu-cart__container {
    width: 350px !important;
    max-width: 90vw !important;
}

/* Mobile responsive adjustments */
@media (max-width: 768px) {
    .elementor-menu-cart__container {
        width: 100% !important;
        max-width: 100vw !important;
    }
    
    .elementor-menu-cart__product {
        padding: 12px 0 !important;
        gap: 10px !important;
    }
    
    .elementor-menu-cart__product-image {
        width: 50px !important;
        height: 50px !important;
    }
}

/* Fix cart button hover layout shift */

/* Method 1: Add transparent border by default to prevent shift */
.elementor-menu-cart__toggle_button,
.elementor-menu-cart__toggle {
    border: 1px solid transparent !important;
    box-sizing: border-box !important;
    transition: all 0.3s ease !important;
}

/* Ensure hover state uses same border width */
.elementor-menu-cart__toggle_button:hover,
.elementor-menu-cart__toggle:hover {
    border: 1px solid transparent !important; /* Keep same border width */
    transform: none !important; /* Prevent any transform shifts */
}

/* Remove any outline that might be added on hover/focus */
.elementor-menu-cart__toggle_button:hover,
.elementor-menu-cart__toggle_button:focus,
.elementor-menu-cart__toggle:hover,
.elementor-menu-cart__toggle:focus {
    outline: none !important;
    box-shadow: none !important;
}

/* If there's a specific hover border color, override it */
.elementor-menu-cart__toggle_button:hover {
    border-color: transparent !important;
}

/* Alternative approach: Fix dimensions */
.elementor-menu-cart__toggle_wrapper {
    position: relative !important;
}

.elementor-menu-cart__toggle_button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: fit-content !important;
    white-space: nowrap !important;
}

/* Prevent layout shift in the entire cart widget */
.elementor-widget-woocommerce-menu-cart {
    position: relative !important;
}

/* If the issue is with the cart icon SVG */
.elementor-menu-cart__toggle_button svg,
.elementor-button-icon svg {
    transition: none !important;
    transform: none !important;
}

.elementor-menu-cart__toggle_button:hover svg,
.elementor-button-icon:hover svg {
    transform: none !important;
}

/* Ensure consistent padding/margin */
.elementor-menu-cart__toggle_button {
    margin: 0 !important;
    padding: 8px 12px !important; /* Consistent padding */
}

.elementor-menu-cart__toggle_button:hover {
    margin: 0 !important;
    padding: 8px 12px !important; /* Same padding on hover */
}

/* Fix mobile menu text colors - make all text white */

/* The breadcrumb "Products" title that appears dark */
.jet-mobile-menu__breadcrumb .breadcrumb-label {
    color: #ffffff !important;
    font-weight: 600 !important;
}

/* Menu item labels (Cameras, Lenses, etc.) */
.jet-menu-label {
    color: #ffffff !important;
}

/* Menu item links */
.mobile-link,
.mobile-sub-level-link {
    color: #ffffff !important;
    text-decoration: none !important;
}

/* Menu item wrappers */
.jet-menu-item-wrapper {
    color: #ffffff !important;
}

/* Menu name containers */
.jet-menu-name {
    color: #ffffff !important;
}

/* All menu items */
.jet-mobile-menu__item {
    color: #ffffff !important;
}

/* Hover states */
.mobile-link:hover,
.mobile-sub-level-link:hover,
.jet-menu-label:hover {
    color: #cccccc !important;
}

/* Back button and controls */
.jet-mobile-menu__back,
.jet-mobile-menu__controls {
    color: #ffffff !important;
}

/* Back button icon */
.jet-mobile-menu__back svg path {
    fill: #ffffff !important;
}

/* Override any inherited dark colors */
.jet-mobile-menu__container * {
    color: inherit !important;
}

/* Make sure the breadcrumb area has white text */
.jet-mobile-menu__breadcrumbs,
.jet-mobile-menu__breadcrumb {
    color: #ffffff !important;
}
