/* subw_mobile_menu_v5.css — STRICTLY SCOPED, footer-safe */
@media (max-width: 767px){
  body.subw-open #menu-icon.opened::before{
    background: transparent !important;
    opacity: 0 !important;
    pointer-events: none !important;
    content: "" !important;
  }
  #subw-mobile-menu{
    display: none;
    position: fixed;
    top: 60px;
    left: 0; right: 0; bottom: 0;
    z-index: 2147483647;
    background: #fff;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    box-shadow: 0 10px 24px rgba(0,0,0,0.12);
  }
  #subw-mobile-menu ul{ list-style: none; margin: 0; padding: 0; }
  #subw-mobile-menu li{ margin: 0; padding: 0; }
  #subw-mobile-menu a{
    display: block;
    padding: 12px 16px;
    color: #222;
    text-decoration: none;
    border-bottom: 1px solid #eee;
  }
  #menu-icon{ position: relative; z-index: 2147483648; }
}
/* Mobile: Button & Kategorien-Header grün wie im Querformat */
@media (max-width: 767px) {
  /* Hamburger-Button einfärben */
  #menu-icon {
    background: #57b30c !important;
    color: #fff !important;
    border: 1px solid #57b30c !important;
    border-radius: 6px;
    padding: 8px 12px;        /* optional: bessere Antippfläche */
    display: inline-flex;
    align-items: center;
    gap: 8px;
  }
  /* Falls Icon ein <i>, <span> oder SVG nutzt */
  #menu-icon i,
  #menu-icon span { color: #fff !important; }
  #menu-icon svg path { fill: #fff !important; }

  /* Gleiche Farbe für den Zustand „offen“ */
  body.subw-open #menu-icon {
    background: #57b30c !important;
    color: #fff !important;
    border-color: #57b30c !important;
  }

  /* Kategorien-Titelzeile im Panel grün */
  .block-categories-custom h3.block-categories-title {
    background: #57b30c !important;
    border-color: #57b30c !important;
    color: #fff !important;
  }
}