/* Menu Font Size Fix - Prevent overlap with logo */

/* Reduce main menu font size between 1300px and 1000px */
@media only screen and (max-width: 1300px) and (min-width: 1001px) {
  /* Target the main menu navigation */
  nav.main_menu > ul > li > a {
    font-size: 14px !important;
    padding: 0 12px !important;
    color: #ffffff !important;
  }
  
  /* Main menu hover state */
  nav.main_menu > ul > li > a:hover {
    color: #faa41a !important;
  }
  
  /* Reduce font size for submenu items as well */
  nav.main_menu > ul > li ul li a {
    font-size: 13px !important;
    padding: 8px 12px !important;
    color: #ffffff !important;
  }
  
  /* Dropdown menu hover state */
  nav.main_menu > ul > li ul li a:hover {
    color: #faa41a !important;
  }
  
  /* Adjust spacing for menu items */
  nav.main_menu > ul > li {
    margin: 0 2px !important;
  }
  
  /* Ensure proper spacing for the logo area */
  .header_inner_left {
    margin-right: 10px !important;
  }
  
  /* Adjust container spacing if needed */
  .header_inner_right {
    margin-left: 10px !important;
  }
}

/* Further reduce font size for smaller screens in this range */
@media only screen and (max-width: 1200px) and (min-width: 1001px) {
  nav.main_menu > ul > li > a {
    font-size: 13px !important;
    padding: 0 10px !important;
    color: #ffffff !important;
  }
  
  /* Main menu hover state */
  nav.main_menu > ul > li > a:hover {
    color: #faa41a !important;
  }
  
  nav.main_menu > ul > li ul li a {
    font-size: 12px !important;
    padding: 6px 10px !important;
    color: #ffffff !important;
  }
  
  /* Dropdown menu hover state */
  nav.main_menu > ul > li ul li a:hover {
    color: #faa41a !important;
  }
  
  nav.main_menu > ul > li {
    margin: 0 1px !important;
  }
}

/* Even smaller font size for the critical overlap range */
@media only screen and (max-width: 1100px) and (min-width: 1001px) {
  nav.main_menu > ul > li > a {
    font-size: 12px !important;
    padding: 0 8px !important;
    color: #ffffff !important;
  }
  
  /* Main menu hover state */
  nav.main_menu > ul > li > a:hover {
    color: #faa41a !important;
  }
  
  nav.main_menu > ul > li ul li a {
    font-size: 11px !important;
    padding: 5px 8px !important;
    color: #ffffff !important;
  }
  
  /* Dropdown menu hover state */
  nav.main_menu > ul > li ul li a:hover {
    color: #faa41a !important;
  }
  
  nav.main_menu > ul > li {
    margin: 0 !important;
  }
}

/* Ensure mobile menu remains at original breakpoint */
@media only screen and (max-width: 1000px) {
  /* Keep original mobile menu behavior */
  .main_menu {
    display: none !important;
  }
  
  nav.mobile_menu {
    display: block;
  }
  
  .mobile_menu_button {
    display: table;
    cursor: pointer;
    position: relative;
    z-index: 100;
  }
  
  /* Fix mobile menu hamburger icon visibility */
  .mobile_menu_button span {
    color: #777 !important;
    opacity: 1 !important;
    visibility: visible !important;
    transition: color 0.3s ease !important;
    display: table-cell !important;
    vertical-align: middle;
    text-align: center;
    width: 19px;
    height: 17px;
    font-size: 14px;
  }
  
  /* Mobile menu button hover state */
  .mobile_menu_button span:hover {
    color: #000 !important;
  }
  
  /* Dark theme variant */
  .dark .mobile_menu_button span {
    color: #000 !important;
  }
  
  .dark .mobile_menu_button span:hover {
    color: #777 !important;
  }
  
  /* Light theme variant */
  .light .mobile_menu_button span {
    color: #777 !important;
  }
  
  .light .mobile_menu_button span:hover {
    color: #000 !important;
  }
  
  /* Fixed top header variant */
  .fixed_top_header .mobile_menu_button span {
    color: #777 !important;
  }
  
  .fixed_top_header .mobile_menu_button span:hover {
    color: #000 !important;
  }
}
