/*
Theme Name:     TT5 Hausarzt-Team
Theme URI:      https://hausarzt-team.eu/
Description:    Modern-minimales Child-Theme für Twenty Twenty-Five mit Salbeigrün-Palette.
Author:         Digitaysator (Thomas Gärtner)
Template:       twentytwentyfive
Version:        1.0.0
Text Domain:    tt5-hausarzt-team
*/

/*************************************************************
 * TT5 Hausarzt-Team — Responsive: nur Burger <1280, Seitentitel nur <1280
 *************************************************************/

/* DESKTOP: >= 960px
   - Desktop-Menü sichtbar
   - Burger aus
   - Seitentitel aus
*/
@media (min-width: 960px) {

  /* Desktop-Menü anzeigen */
  .main-nav .wp-block-navigation__container{
    display: flex !important;
  }

  /* Burger-Buttons ausblenden */
  .main-nav .wp-block-navigation__responsive-container-open,
  .main-nav .wp-block-navigation__responsive-container-close{
    display: none !important;
  }

  /* Navigation normal (nicht als Overlay) */
  .main-nav .wp-block-navigation__responsive-container{
    display: block;
    position: static;
    visibility: visible;
    opacity: 1;
    pointer-events: auto;
  }

  /* Seitentitel auf Desktop ausblenden */
  body.page .wp-block-post-title{
    display: none !important;
  }
}

/* TABLET + SMARTPHONE: <1280px
   - im Header nur Burger-Icon
   - Menü-Items nur im geöffneten Overlay sichtbar
*/
@media (max-width: 959px){

  .main-nav{
    display: flex;
    justify-content: center;
  }

  /* Nur Burger-Button sichtbar */
  .main-nav .wp-block-navigation__responsive-container-open{
    display: flex !important;
    justify-content: center;
    align-items: center;
	/* Klickfläche vergrößern für Tablet */
	padding: 12px 16px;
  }
  
  .main-nav .wp-block-navigation__responsive-container-open svg{
    width: 40px;
    height: 40px;
  }

  /* Alle Menülisten standardmäßig ausblenden (Desktop + Overlay) */
  .main-nav .wp-block-navigation__container{
    display: none !important;
  }

  /* Erst wenn das Overlay geöffnet ist: Menü-Items anzeigen */
  .main-nav .wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation__container{
    display: flex !important;
    flex-direction: column;
    gap: 12px;
  }

  /* Close-Button nur sinnvoll wenn offen (optional) */
  .main-nav .wp-block-navigation__responsive-container:not(.is-menu-open)
  .wp-block-navigation__responsive-container-close{
    display: none !important;
  }
}

/*************************************************************
 * Menü-Items: Hover & aktuelles Item hervorheben
 *************************************************************/

/* Basis: Link als "Block", damit Hintergrund sichtbar wird */
.main-nav .wp-block-navigation-item__content{
  display: block;
  padding: 10px 14px;
  text-decoration: none;
  transition: background-color .15s ease-in-out;
}

/* Hover: Hintergrund dunkler (nur wenn anklickbar / sichtbar) */
.main-nav .wp-block-navigation-item__content:hover,
.main-nav .wp-block-navigation-item__content:focus{
  background-color: rgba(0,0,0,0.12);
}

/* Aktueller Menüpunkt (aktuelle Seite) */
.main-nav .current-menu-item > .wp-block-navigation-item__content,
.main-nav .current_page_item > .wp-block-navigation-item__content{
  background-color: rgba(0,0,0,0.18);
  font-weight: 600;                /* optional */
}

/* Eltern-/Ancestor-Highlight (wenn du in Unterseiten bist) */
.main-nav .current-menu-ancestor > .wp-block-navigation-item__content,
.main-nav .current_page_ancestor > .wp-block-navigation-item__content{
  background-color: rgba(0,0,0,0.14);
  font-weight: 600;                /* optional */
}

/* Optional: Hover auf aktuellem Item noch etwas dunkler */
.main-nav .current-menu-item > .wp-block-navigation-item__content:hover,
.main-nav .current_page_item > .wp-block-navigation-item__content:hover{
  background-color: rgba(0,0,0,0.24);
}

/* ==========================================
   Mobile Overlay: Standard-TT5 Styling entfernen
   ========================================== */
@media (max-width: 959px){

  /* Rundes TT5-Highlight entfernen */
  .main-nav .wp-block-navigation__responsive-container 
  .current-menu-item > .wp-block-navigation-item__content,
  
  .main-nav .wp-block-navigation__responsive-container 
  .current_page_item > .wp-block-navigation-item__content,
  
  .main-nav .wp-block-navigation__responsive-container 
  .current-menu-ancestor > .wp-block-navigation-item__content{
    
    border-radius: 0 !important;
    box-shadow: none !important;
	
    background-color: rgba(0,0,0,0.18);
    font-weight: 600;

  }

  .main-nav .wp-block-navigation__responsive-container
  .wp-block-navigation-item{
    outline: none !important;
    box-shadow: none !important;
    border: 0 !important;


  /* alle Nav-Links im Overlay: keinen Rahmen / Shadow / Outline */
  .main-nav .wp-block-navigation__responsive-container
  .wp-block-navigation-item__content{
    outline: none !important;
    box-shadow: none !important;
    border: 0 !important;
  }

  /* auch bei Fokus-Zuständen (Ring kommt meist von :focus-visible) */
  .main-nav .wp-block-navigation__responsive-container
  .wp-block-navigation-item__content:focus,
  .main-nav .wp-block-navigation__responsive-container
  .wp-block-navigation-item__content:focus-visible{
    outline: none !important;
    box-shadow: none !important;
    border: 0 !important;
  }

  /* optional: statt Ring eine dezente Fokus-Markierung über Hintergrund */
  .main-nav .wp-block-navigation__responsive-container
  .wp-block-navigation-item__content:focus-visible{
    background-color: rgba(0,0,0,0.12);
  }
}

  /* Footer mit Zollernalb-Silhoutte */

.footer-bg {
    position: relative;
}

.footer-bg::after {
    content: "";
    position: absolute;
    right: 0;
    bottom: 0;

    width: clamp(250px, 30vw, 500px);
    height: 120px;

    background-repeat: no-repeat;
    background-size: contain;

    pointer-events: none;
}