/* Fix for missing image - hide broken image */
img[src*="jólogó_1@3x.png"]:not([src*="http"]) {
    display: none;
}

/* Override Elementor's global color primary which is set to light gray #E6E6E6 */
.elementor-kit-6 {
    --e-global-color-primary: #ffffff !important; /* White for better readability */
    --e-global-color-secondary: #f0f0f0 !important; /* Light gray */
    --e-global-color-text: #ffffff !important; /* White for text */
    --e-global-color-accent: #4da6ff !important; /* Light blue for accents */
}

/* Fix for font readability - improve contrast */
body {
    color: #ffffff !important; /* White text color */
}

/* Fix text contrast for paragraphs and general text */
p, span, div {
    color: #ffffff !important;
}

/* Fix for specific light gray text */
.elementor-widget-text-editor {
    color: #ffffff !important;
}

/* Fix for links to ensure they're visible */
a {
    color: #4da6ff !important; /* Light blue color for links */
}

a:hover {
    color: #80c0ff !important; /* Lighter blue on hover */
}

/* Fix for headings */
h1, h2, h3, h4, h5, h6 {
    color: #ffffff !important; /* White for headings */
}

/* Fix menu items */
.jet-nav-link-text {
    color: #ffffff !important;
}

/* Fix for elements with inline styles */
[style*="color: #54595F"] {
    color: #ffffff !important;
}

/* Fix for footer text */
.elementor-element-e49106e p {
    color: #ffffff !important;
}

/* Ensure white text on dark backgrounds remains white */
.elementor-social-icon i,
.wp-block-button__link,
[style*="background-color: black"] {
    color: #ffffff !important;
}

/* Fix for the specific reference link that has light color */
a[href*="portfolio"] h3 {
    color: #ffffff !important;
    background-image: none !important; /* Remove gradient that might affect readability */
}

/* Additional contrast fixes for any remaining light text */
.elementor-widget-container {
    color: #ffffff;
}

/* Ensure proper contrast for navigation */
.menu-item-link {
    color: #ffffff !important;
}

/* Fix for any text that might be too light */
*[style*="color: #ffffffe6"] {
    color: #ffffff !important;
}

/* Fix for elements using var(--e-global-color-primary) */
[style*="color: var( --e-global-color-primary )"],
.elementor-heading-title,
.jet-toggle__label-text,
.jet-nav-link-text,
.elementor-icon-list-text {
    color: #ffffff !important;
}

/* Fix product titles and prices in WooCommerce */
.woocommerce-loop-product__title,
.woocommerce-Price-amount,
.price {
    color: #333333 !important; /* Changed to dark gray for visibility on white background */
}

/* Fix accordion and toggle text */
.jet-toggle__control .jet-toggle__label-text,
.jet-accordion__inner .jet-toggle__label-text {
    color: #ffffff !important;
}

/* Fix submenu background transparency */
.jet-nav__sub {
    background-color: #2c2c2c !important; /* Solid dark gray background */
    opacity: 1 !important;
}

/* Ensure submenu items have proper background on hover */
.jet-nav__sub .menu-item:hover > .menu-item-link-sub {
    background-color: #444444 !important; /* Slightly lighter gray on hover */
    opacity: 1 !important;
}

/* Make sure dropdown arrows are visible */
.jet-nav-arrow {
    color: #ffffff !important;
}

/* ========================================
   CUSTOM MOBILE MENU - COMPLETELY INDEPENDENT
   These classes can be used to create a new mobile menu
   without affecting any existing styles on the site
   ======================================== */

/* Custom Mobile Menu Burger Button */
.custom-mobile-burger {
    display: none;
    position: fixed !important;
    top: 20px !important;
    right: 20px !important;
    width: 50px !important;
    height: 50px !important;
    background-color: #333333 !important; /* Dark gray background */
    border-radius: 8px !important;
    cursor: pointer !important;
    z-index: 999999 !important; /* Maximum z-index */
    align-items: center !important;
    justify-content: center !important;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.3) !important;
    transition: all 0.3s ease !important;
}

.custom-mobile-burger:hover {
    background-color: #555555;
    transform: scale(1.05);
}

/* Burger Icon Lines */
.custom-mobile-burger-icon {
    width: 25px;
    height: 2px;
    background-color: #ffffff;
    position: relative;
    transition: all 0.3s ease;
}

.custom-mobile-burger-icon::before,
.custom-mobile-burger-icon::after {
    content: '';
    position: absolute;
    width: 25px;
    height: 2px;
    background-color: #ffffff;
    transition: all 0.3s ease;
}

.custom-mobile-burger-icon::before {
    top: -8px;
}

.custom-mobile-burger-icon::after {
    top: 8px;
}

/* Burger Animation when Menu is Open */
.custom-mobile-menu-open .custom-mobile-burger-icon {
    background-color: transparent;
}

.custom-mobile-menu-open .custom-mobile-burger-icon::before {
    top: 0;
    transform: rotate(45deg);
}

.custom-mobile-menu-open .custom-mobile-burger-icon::after {
    top: 0;
    transform: rotate(-45deg);
}

/* Custom Mobile Menu Container */
.custom-mobile-menu {
    display: none;
    position: fixed;
    top: 0;
    left: -100%;
    width: 80%;
    max-width: 350px;
    height: 100vh;
    background-color: #2c2c2c;
    z-index: 99999;
    transition: left 0.3s ease;
    overflow-y: auto;
    box-shadow: 2px 0 20px rgba(0, 0, 0, 0.5);
}

.custom-mobile-menu-open .custom-mobile-menu {
    left: 0;
}

/* Custom Mobile Menu Header */
.custom-mobile-menu-header {
    padding: 20px;
    background-color: #1f1f1f;
    border-bottom: 1px solid #444444;
}

.custom-mobile-menu-logo {
    color: #ffffff;
    font-size: 24px;
    font-weight: bold;
    text-decoration: none;
}

/* Custom Mobile Menu Navigation */
.custom-mobile-nav {
    padding: 20px 0;
}

.custom-mobile-nav-list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.custom-mobile-nav-item {
    border-bottom: 1px solid #3a3a3a;
}

.custom-mobile-nav-link {
    display: block;
    padding: 15px 20px;
    color: #ffffff;
    text-decoration: none;
    font-size: 16px;
    transition: all 0.3s ease;
    position: relative;
}

.custom-mobile-nav-link:hover {
    background-color: #3a3a3a;
    padding-left: 30px;
    color: #4da6ff;
}

/* Custom Mobile Submenu */
.custom-mobile-nav-item-has-children > .custom-mobile-nav-link::after {
    content: '▼';
    position: absolute;
    right: 20px;
    top: 50%;
    transform: translateY(-50%);
    transition: transform 0.3s ease;
}

.custom-mobile-nav-item-has-children.active > .custom-mobile-nav-link::after {
    transform: translateY(-50%) rotate(180deg);
}

.custom-mobile-submenu {
    display: none;
    background-color: #1f1f1f;
    list-style: none;
    margin: 0;
    padding: 0;
}

.custom-mobile-nav-item-has-children.active > .custom-mobile-submenu {
    display: block;
}

.custom-mobile-submenu .custom-mobile-nav-link {
    padding-left: 40px;
    font-size: 14px;
}

.custom-mobile-submenu .custom-mobile-nav-link:hover {
    padding-left: 50px;
}

/* Custom Mobile Menu Overlay */
.custom-mobile-overlay {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 99998;
}

.custom-mobile-menu-open .custom-mobile-overlay {
    display: block;
}

/* Show Custom Mobile Menu Elements on Mobile Only */
@media (max-width: 1024px) {
    .custom-mobile-burger {
        display: flex !important;
        visibility: visible !important;
        opacity: 1 !important;
    }
    
    .custom-mobile-menu {
        display: block !important;
    }
    
    /* Hide the old JetNav mobile menu trigger */
    .jet-nav__mobile-trigger,
    .jet-nav__mobile-trigger-open,
    .jet-nav__mobile-trigger-close,
    .jet-blocks-icon {
        display: none !important;
    }
    
    /* Also hide the old mobile menu container */
    .jet-nav__mobile-container,
    .jet-mobile-menu {
        display: none !important;
    }
}

/* Remove the force visibility - let media query handle it */

/* Hide all "Kosárba teszem" (Add to cart) buttons completely */
.add_to_cart_button,
.product_type_simple.add_to_cart_button,
.ajax_add_to_cart,
a[aria-label*="kosárba"],
a[aria-label*="Kosárba"],
.button.product_type_simple,
.woocommerce a.button.add_to_cart_button,
.woocommerce button.button.alt,
.woocommerce input.button.alt,
.woocommerce #respond input#submit.alt,
.woocommerce a.button.alt,
.woocommerce .cart .button,
.woocommerce .cart input.button,
.single_add_to_cart_button {
    display: none !important;
    visibility: hidden !important;
}

/* Example HTML Structure for Custom Mobile Menu:
   
   <div class="custom-mobile-burger">
       <div class="custom-mobile-burger-icon"></div>
   </div>
   
   <div class="custom-mobile-overlay"></div>
   
   <nav class="custom-mobile-menu">
       <div class="custom-mobile-menu-header">
           <a href="/" class="custom-mobile-menu-logo">HANGSZERBÉRLÉS</a>
       </div>
       <div class="custom-mobile-nav">
           <ul class="custom-mobile-nav-list">
               <li class="custom-mobile-nav-item">
                   <a href="/" class="custom-mobile-nav-link">Főoldal</a>
               </li>
               <li class="custom-mobile-nav-item custom-mobile-nav-item-has-children">
                   <a href="#" class="custom-mobile-nav-link">Gitár</a>
                   <ul class="custom-mobile-submenu">
                       <li class="custom-mobile-nav-item">
                           <a href="/gitar-fejek" class="custom-mobile-nav-link">Gitárfejek</a>
                       </li>
                       <li class="custom-mobile-nav-item">
                           <a href="/gitar-ladak" class="custom-mobile-nav-link">Gitárládák</a>
                       </li>
                   </ul>
               </li>
               <li class="custom-mobile-nav-item">
                   <a href="/bass" class="custom-mobile-nav-link">Bass</a>
               </li>
               <li class="custom-mobile-nav-item">
                   <a href="/dob" class="custom-mobile-nav-link">Dob</a>
               </li>
               <li class="custom-mobile-nav-item">
                   <a href="/mikrofon" class="custom-mobile-nav-link">Mikrofon</a>
               </li>
               <li class="custom-mobile-nav-item">
                   <a href="/kapcsolat" class="custom-mobile-nav-link">Kapcsolat</a>
               </li>
           </ul>
       </div>
   </nav>
   
   JavaScript needed (add to site):
   
   <script>
   document.addEventListener('DOMContentLoaded', function() {
       const burger = document.querySelector('.custom-mobile-burger');
       const overlay = document.querySelector('.custom-mobile-overlay');
       const body = document.body;
       
       if (burger) {
           burger.addEventListener('click', function() {
               body.classList.toggle('custom-mobile-menu-open');
           });
       }
       
       if (overlay) {
           overlay.addEventListener('click', function() {
               body.classList.remove('custom-mobile-menu-open');
           });
       }
       
       // Handle submenu toggles
       const subMenuParents = document.querySelectorAll('.custom-mobile-nav-item-has-children > .custom-mobile-nav-link');
       subMenuParents.forEach(function(parent) {
           parent.addEventListener('click', function(e) {
               e.preventDefault();
               this.parentElement.classList.toggle('active');
           });
       });
   });
   </script>
*/

/* Fix background images on pages - convert absolute URLs to relative */
/* Homepage */
body.elementor-page-104 {
    background-image: url("/wp-content/uploads/2022/05/fooldal2.png") !important;
    background-size: cover !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
    background-attachment: fixed !important;
}

/* Guitar page */
body.elementor-page-173 {
    background-image: url("/wp-content/uploads/2022/05/gitar1.png") !important;
    background-size: cover !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
    background-attachment: fixed !important;
}

/* Bass page */
body.elementor-page-175 {
    background-image: url("/wp-content/uploads/2022/05/bass2.png") !important;
    background-size: cover !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
    background-attachment: fixed !important;
}

/* Drums page */
body.elementor-page-177 {
    background-image: url("/wp-content/uploads/2022/05/dobb2.png") !important;
    background-size: cover !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
    background-attachment: fixed !important;
}

/* Microphone page */
body.elementor-page-179 {
    background-image: url("/wp-content/uploads/2022/05/mikrofon1.png") !important;
    background-size: cover !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
    background-attachment: fixed !important;
}

/* Classical page */
body.elementor-page-181 {
    background-image: url("/wp-content/uploads/2022/05/klasszikus2.png") !important;
    background-size: cover !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
    background-attachment: fixed !important;
}

/* Keyboard page (billentyus) */
body.elementor-page-767 {
    background-image: url("/wp-content/uploads/2022/05/billnetyuu2.png") !important;
    background-size: cover !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
    background-attachment: fixed !important;
}

/* Portfolio page */
body.elementor-page-1485 {
    background-image: url("/wp-content/uploads/2022/05/fules1.png") !important;
    background-size: cover !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
    background-attachment: fixed !important;
}