/*

Theme Name: ABC Mega Menu Theme

Author: ChatGPT

Version: 1.0

*/



.top-header {

  background: #111;

  color: #fff;

  padding: 0 20px;

  font-size: 14px;

  display: flex;

  justify-content: space-between;

}

.top-header a {

  color: #fff;

  text-decoration: none;

}



.top-bar {

  display: none;

  justify-content: space-between;

}



#menu-top-header {

  display: flex;

  margin-bottom: 0;

}

#menu-top-header li {

  list-style: none;

  margin-right: 8px;

}



#menu-top-header {

  padding-left: 0 !important;

}



#menu-top-header li :hover {

  color: #9c1b31;

}



.left-top span :hover {

  color: #9c1b31;

}



.left-top span {

  margin-right: 10px;

}



.left-top {

  display: flex;

}

.contact-button {

  display: flex;

  flex-direction: column;

  background-color: #fff;

  text-align: center;

  padding: 3px 10px;

  border: 2px solid #9c1b31;

}

.contact-button a {

  font-weight: 700;

  color: #9c1b31;

}



.left-top .contact-button a:hover {

  font-weight: 700;

  color: #000;

}



.red-button {

  display: flex;

  flex-direction: column;

  background-color: #9c1b31;

  color: #fff;

  justify-content: center;

  font-weight: 700;

  padding: 0 10px;

}



.top-bar {

  display: none;

  justify-content: space-between;

}

.desktop-header {

  display: none !important;

}



.site-header {

  background: #fff;

  padding: 12px 20px 12px;

  /* border-bottom: 1px solid #ddd; */

}



.top_head .site-branding img {

  width: 160px;

}

@media only screen and (min-width: 1200px) {

  .header-container {

    display: contents;

  }



  .top_head {

    display: flex;

    justify-content: space-between;

  }

  .top_head .site-branding img {

    width: 160px;

  }



  /* === MAIN NAVIGATION HEADER === */

  #menu-main-navigation-desktop {

    display: flex;

    justify-content: center;

    background: #fff;

    position: relative;

    z-index: 1000;

    padding: 0;

    font-family: "Google Sans", sans-serif;

    font-weight: 600;

    margin-bottom: 0;

    padding-bottom: 0;

  }



  #menu-main-navigation-desktop ul {

    display: flex;

    list-style: none;

    margin: 0;

    padding: 0;

  }



  #menu-main-navigation-desktop li {

    position: relative;

    margin: 0 0px 0 10px;

    list-style: none;

  }

  #menu-main-navigation-desktop li > a {

    position: relative;

    display: inline-flex;

    padding: 15px 5px 15px;

    font-size: 16px;

    color: #000;

    text-decoration: none;

    font-weight: 500;

    transition: color 0.3s ease;

    align-items: center;

  }



  #menu-main-navigation-desktop li > a::after {

    content: "";

    display: block;

    position: absolute;

    left: 0;

    bottom: 0;

    height: 2px;

    width: 0;

    background-color: #9c1b31;

    transition: width 0.3s ease;

  }



  #menu-main-navigation-desktop li:hover > a {

    color: #9c1b31;

  }



  #menu-main-navigation-desktop li:hover > a::after {

    width: 100%;

  }



  /* Add Dropdown Arrow */

  /* #menu-main-navigation li.menu-item-has-children > a::after {

    content: ' ▼';

    font-size: 10px;

    margin-left: 5px;

    color: #9c1b31;

} */



  .dropdown-icon {

    font-size: 10px;

    margin-left: 6px;

    color: #000;

    transition: transform 0.25s ease;

  }



  .menu-item-wrapper {

    position: relative;

  }



  /* === DROPDOWN === */

  .mega-submenus-wrapper {

    position: absolute;

    top: 80px;

    left: 0;

    width: 100vw;

    background: #f9f9f9;

    opacity: 0;

    visibility: hidden;

    z-index: 999;

    padding: 40px 60px;

    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05);

    transition: opacity 0.6s ease, visibility 0.5s ease;

    pointer-events: none; /* Prevents interaction when hidden */

  }



  .menu-item-wrapper:hover .mega-submenus-wrapper {

    opacity: 1;

    visibility: visible;

    pointer-events: auto;

  }



  .mega-submenu-container {

    /* display: none; */

  }



  .mega-submenu {

    display: flex;

    flex-wrap: wrap;

    gap: 30px;

    list-style: none;

    margin: 0;

    padding: 0;

  }



  .sub-menu-item {

    flex: 1 0 200px;

  }



  .sub-menu-item a {

    display: block;

    text-align: center;

    color: #000;

    font-size: 16px;

    font-weight: 500;

    text-decoration: none;

    transition: all 0.3s ease;

  }



  .sub-menu-item a:hover {

    color: #9c1b31;

    text-decoration: underline;

  }



  /* Dropdown Show Logic */

  .menu-item:hover ~ .mega-submenus-wrapper,

  .mega-submenus-wrapper:hover {

    display: block;

  }



  /* Mega submenu wrapper */

  /* .mega-submenus-wrapper {

  position: relative;

  top: 100%;

  left: 0;

  width: 100vw;

  background: #f9f9f9;

  display: none;

  z-index: 999;

  padding: 40px 60px;

  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05);

} */



  .mega-submenu-container {

    display: block;

  }



  .mega-submenu {

    display: flex;

    flex-wrap: wrap;

    list-style: none;

    padding: 0;

    margin: 0;

    align-items: stretch;

  }



  .sub-menu-item {

    flex: 1 0 calc(20% - 10px);

    margin-bottom: 10px;

  }



  .sub-menu-item a {

    color: #333;

    text-decoration: none;

    font-weight: 400;

    max-height: 250px;

    height: 200%;

    overflow: hidden;

  }



  /* Show submenu on hover */

  .menu-item:hover

    ~ .mega-submenus-wrapper

    .mega-submenu-container[data-parent="PARENT_ID"] {

    display: block;

  }



  .mega-submenus-wrapper.show {

    opacity: 1;

    visibility: visible;

    pointer-events: auto;

  }



  /*  */



  .mega-submenu .sub-menu-item {

    display: flex;

    gap: 10px;

    flex-direction: column;

    align-items: flex-start;

  }



  .mega-submenu .sub-menu-item img {

    width: 100%;

    height: 100%;

    min-height: 200px;

    object-fit: cover;

    border-radius: 0;

  }



  .mega-submenu .sub-menu-item p {

    font-weight: 600;

  }



  .desktop-header {

    display: flex !important;

    border-bottom: none;

    align-items: center;

  }



  .mobile-header {

    display: none;

  }

}



.mt-4 {

  margin-top: 0 !important;

}



.no-left-margin {

  margin-left: 0 !important;

}



.hide-menu {

  display: none !important;

}



.location-header {

  padding-right: 25px;

  font-weight: 600;

  color: #9c1b31;

}



.location-header a {

  color: #9c1b31 !important;

}



.location-header .dropdown-icon {

  color: #9c1b31 !important;

}



.contact a {

  color: #fff !important;

  background-color: #9c1b31 !important;

  text-transform: uppercase;

  padding: 15px !important;

  font-size: 14px !important;

  border-radius: 5px;

}


.contact-form-service .wpcf7-spinner {
  background-color:#9b1c31 ;
}


.menu-item.open .mobile-menu-link {

  color: #9c1b31;

}



.mobile-menu-item.open > .mobile-menu-link .dropdown-icon {

  transform: rotate(180deg);

}