/*
Theme Name: Öko Bau-Zentrum
Theme URI: 
Author: Alexandra Walker
Author URI: 
Description: Theme für Öko Bau-Zentrum
Requires at least: 6.8
Tested up to: 6.8
Requires PHP: 5.7
Version: 
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: oeko-bau-zentrum
Tags: 
*/
.mega-menu {
  position: relative;
}
.wp-block-navigation .wp-block-navigation-item {
  color: white;
  font-size: 1rem;
}

/* Invisible hover buffer so the mouse never fully exits between
   the trigger link and the panel opening below it. */
.mega-menu > a,
.mega-menu > .wp-block-navigation-item__content {
  padding-bottom: 38px !important;
  margin-bottom: -38px !important;
}

.mega-menu > .wp-block-navigation__submenu-container {
  display: grid !important;
  grid-template-columns: repeat(5, 1fr);
  grid-auto-flow: row;      /* items fill left-to-right, top-to-bottom, in DOM order */
  grid-auto-rows: auto;
  align-items: start;
  gap: 2.5rem;

  position: fixed !important;
  top: 72px !important;     /* MUST match real header height */

  /* Full-bleed width without the 100vw scrollbar-width bug */
  left: 50% !important;
  right: auto !important;
  width: 100vw !important;
  max-width: 100vw !important;
  transform: translateX(-50%) !important; 

  padding: 2rem 4vw;
  z-index: 100;
  background-color: #4B7175 !important;
  box-sizing: border-box;
margin-top:-20px;
  max-height: calc(100vh - 72px) !important; /* 72px = header height */
  overflow-y: auto !important;
  overscroll-behavior: contain !important; /* stops scroll from bubbling to the page behind it */
margin-bottom:20px;
}

.mega-menu > .wp-block-navigation__submenu-container > li {
  min-width: 0;
  /* No nth-child rules here anymore.
     Visual order = DOM order = tab order.
     To change layout, reorder items in the block editor. */
}

.mega-menu > .wp-block-navigation__submenu-container > li.has-child {
  position: relative;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
}

.wp-block-navigation.items-justified-right .wp-block-navigation__container .has-child .wp-block-navigation__submenu-container,
.wp-block-navigation.items-justified-right .wp-block-page-list > .has-child .wp-block-navigation__submenu-container,
.wp-block-navigation.items-justified-space-between .wp-block-page-list > .has-child:last-child .wp-block-navigation__submenu-container,
.wp-block-navigation.items-justified-space-between > .wp-block-navigation__container > .has-child:last-child .wp-block-navigation__submenu-container {
  background-color: #4B7175 !important;
}

.mega-menu > .wp-block-navigation__submenu-container > li.has-child > .wp-block-navigation__submenu-container {
  position: static !important;
  opacity: 1 !important;
  visibility: visible !important;
  display: block !important;
  transform: none !important;
  box-shadow: none !important;
  border: none !important;
  padding: 0 !important;
  margin-top: 0.5rem !important;
  width: 100% !important;
  min-width: 0 !important;
  max-height: none !important;
  height: auto !important;
  overflow: visible !important;
  pointer-events: auto !important;
}

/* NOTE on accessibility: pointer-events:none stops clicks but a linked
   <a> is still keyboard-focusable and does nothing on Enter, which is
   confusing for keyboard/screen-reader users. Best fix happens in the
   editor: make these group headers plain text (e.g. a Heading block)
   rather than Navigation Link items, so there's no phantom focus stop.
   The CSS below is a fallback if you can't change the block type. */
.mega-menu > .wp-block-navigation__submenu-container > li.has-child > a {
  font-weight: 600;
  color: white;
  pointer-events: none;
}

.mega-menu > .wp-block-navigation__submenu-container > li.has-child > .wp-block-navigation-submenu__toggle {
  display: none;
}

.mega-menu .wp-block-navigation-item.wp-block-navigation-link {
  display: block;
  padding: 0.05rem 0;
}

.mega-menu .wp-block-navigation-item.wp-block-navigation-link > a {
  color: #efefef;
}

.mega-menu > .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
  flex-grow: 0 !important;
}
/* Sub-category headers (has-child group titles) — bigger */
.mega-menu > .wp-block-navigation__submenu-container > li.has-child > a {
  font-size: 1.15rem !important;
  font-weight: bold;
}

/* Items nested inside each sub-category — smaller/normal */
.mega-menu > .wp-block-navigation__submenu-container > li.has-child .wp-block-navigation__submenu-container .wp-block-navigation-item__content,
.mega-menu > .wp-block-navigation__submenu-container > li.has-child .wp-block-navigation__submenu-container a {
  font-size: 0.9rem !important;
  color:#d6e5e7 !important;
  font-weight: normal;
}

.normal-menu > .wp-block-navigation__submenu-container > li.has-child > a {
  font-weight: normal;
}
.normal-menu .wp-block-navigation-item .wp-block-navigation-link{
    font-weight: normal;
}

.wp-block-navigation .has-child .wp-block-navigation__submenu-container > .wp-block-navigation-item > .wp-block-navigation-item__content{
 font-weight: normal;
 line-height:1.3rem;
}

.phone{
  float:none;
  position: fixed;
  right: 1%;
  z-index: 1;
  bottom: 1%;
  width: fit-content
}
.phone:hover{
  cursor:pointer;
}
.gesichter{
  display:none !important;
  cursor:auto;
}

.zeile-fit-content > * {
    flex-grow: 0;
    flex-shrink: 0;
}

.zeile-fit-content {
    width: fit-content;
    max-width: 100%;
    margin-inline: auto; /* zentriert horizontal */
}

h1 a,
h2 a,
h3 a,
h4 a,
h5 a,
h6 a {
    text-decoration: none;
}

h1 a:hover,
h2 a:hover,
h3 a:hover,
h4 a:hover,
h5 a:hover,
h6 a:hover {
    text-decoration: underline;
}
.nounderline a{
  text-decoration: none;
}

.wp-block-navigation .has-child .wp-block-navigation__submenu-container > .wp-block-navigation-item > .wp-block-navigation-item__content{
  padding: .45em 1em !important;
}
.mega-menu > .wp-block-navigation__submenu-container > li.has-child .wp-block-navigation__submenu-container a:hover {
    color: white !important;
    font-style: italic;
    background-color:#3c5a5d !important;
}
.wp-block-navigation-item.has-child.open-on-hover-click
.wp-block-navigation-submenu
> .wp-block-navigation-item
> .wp-block-navigation-item__content:hover {
    color: white !important;
    font-style: italic;
    background-color: #3c5a5d !important;
}
.wp-block-navigation:not(.has-background) .wp-block-navigation__submenu-container{
  border: none;
}
figcaption{
  color:#98CE98 !important;
  text-align: center;
  font-size: 0.9rem;
  font-weight: bold;
}
.rot{
  color:red !important;
}