/*
 Theme Name:   My Listing Child
 Theme URI:    http://mylisting.27collective.net/my-city/
 Description:  MyListing Child Theme
 Author:       27collective
 Author URI:   https://27collective.net/
 Template:     my-listing
 Version:      1.1
 License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html
 Tags:         one-column, two-columns, three-columns, left-sidebar, right-sidebar, grid-layout, custom-menu, custom-logo, featured-images, footer-widgets, full-width-template, sticky-post, theme-options, threaded-comments, translation-ready
 Text Domain:  my-listing-child
*/

/* General Menu and Layout Overrides */
body .header .header-container .header-top .logo a img {
  /*max-height: 35px !important;*/
  max-height: 50px !important;
}
nav {
  display: flex;
  position: relative;
  gap: 16px;
  z-index: 100; /* Ensure nav is above other content if any */
}

nav > *:nth-last-child(-n+2) {
  display: none;
}

.menu-item {
  position: relative;
  display: flex;
  align-items: center;
  padding-bottom: 15px; 
}

.menu-text a {
  /*color: #b2b1b2;*/
  color: white;
  text-decoration: none;
  font-weight: 500;
  margin-top: 16px;
  display: block;
  transition: color 0.3s ease;
  /* Removed: transform and transition related to upward animation */
}

.menu-text a:hover {
  color: #ffffff;
}

.sub-menu {
  font-family: "Roboto", sans-serif;
  display: none; /* Hidden by default */
  position: absolute;
  top: 100%; /* Position exactly at the bottom of the .menu-item */
  left: 50%;
  transform: translateX(-50%);
  background-color: white;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.25);
  z-index: 90; /* Lower than nav, but higher than other page content */
  border-radius: 8px;
  padding: 15px;
  opacity: 0; /* Start with 0 opacity for fade-in effect */
  transition: opacity 0.3s ease, top 0.3s ease;
  pointer-events: none; /* Prevents interaction when hidden */
  box-sizing: border-box;
  padding-top: 25px; /* Pushes content down, so the visible dropdown is "a little down" */
  margin-top: -15px; /* Pulls the dropdown up to overlap the menu-item's extended padding */

  /* NEW/MODIFIED: Make all sub-menus 2 columns by default */
  display: grid; /* Use grid for column layout */
  grid-template-columns: 1fr 1fr; /* Two equal columns */
  gap: 15px; /* Space between grid items */
  min-width: 580px; /* Adjusted minimum width for two columns */
  padding: 20px; /* Adjust general padding for the grid layout */
  padding-top: 30px; /* Adjust padding-top for the entire sub-menu to account for margin-top */
}

/* Original .sub-menu.double is now redundant as all .sub-menu will be 2 columns */
/* .sub-menu.double {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 15px;
    min-width: 580px;
    padding: 20px;
    padding-top: 30px;
} */

/* Show the dropdown menu on hover */
.menu-item:hover .sub-menu {
  display: grid; /* Keep display: grid on hover */
  opacity: 1;
  top: 100%; /* Keep it at 100% (bottom of menu-item) on hover */
  pointer-events: all;
}

/* Icon Box Styling */
.icon-box {
  display: flex;
  align-items: flex-start;
  padding: 10px;
  border-radius: 5px;
  transition: background-color 0.2s ease;
  cursor: pointer;
}

.icon-box:hover {
  background-color: #f0f0f0;
}

.icon {
  font-size: 1.5em;
  margin-right: 15px;
  color: #333;
  transition: color 0.2s ease;
}

.icon-box.gb .icon i {
  background: linear-gradient(45deg, #0c86ef, #0cef9b);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.icon-box.gb.a .icon i {
  background-image: linear-gradient(45deg, #2ca7ff 35%, #31d078 75%);
}
.icon-box.gb.b .icon i {
  background-image: linear-gradient(45deg, #f32b2b 35%, #efbe0c 75%);
}
.icon-box.gb.c .icon i {
  background-image: linear-gradient(45deg, #7176ff 35%, #b26cea 75%);
}

.text {
  flex-grow: 1;
}

.title {
  font-weight: normal;
  font-family: "Roboto" !important;
  color: black;
  margin-bottom: 5px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.title i {
  font-size: 0.8em;
  color: #9ea9af;
  margin-left: 10px;
  opacity: 0;
  transition: opacity 0.2s ease;
}

.icon-box:hover .title i {
  opacity: 1;
}

.sub-text {
  font-size: 0.9em;
  color: #333333;
  font-family: "Roboto" !important;
}
.instant-results{
    top: 80px !important;
    left: 0px !important;
}


/*
.header .header-container .header-top .logo{
    display: flex;
    align-items: initial !important;
}
*/
/* Hide sub-menus on mobile */

@media (max-width: 1200px) {
  nav {
    display: flex;
    position: relative;
    z-index: 100;
    flex-direction: column;
    align-items: center;
    padding: 0;
    gap: 8px;
    margin-bottom: 12px;
  }

  nav > *:nth-last-child(-n+2) {
  display: block !important;
  }

  .menu-text a {
    color: #333 !important;
  }
  .menu-text a:hover {
    color: black !important;
  }
  .sub-menu {
    display: none !important;
  }
  
.header .header-container .header-top .logo{
    margin-left: 10px;
}
  .mobile-menu {
    margin-right: 0px !important;
    margin-top: 10px;
  }
  .header-right {
    min-height: 50px;
  }
}








