/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Aug 10 2026 | 20:32:22 */
/* ============================================================
   IT24 – Kadence Header V2
   Logo · Navigation · Produktsuche · Warenkorb
   ============================================================ */

/* ============================================================
   Header Grundstruktur
   ============================================================ */

.site-main-header-wrap {
  background: #ffffff;
  border-bottom: 1px solid #EDEEF2;
}

/* Hauptheader etwas ruhiger */
.site-main-header-wrap .site-header-row-container-inner {
  min-height: 92px !important;
}

/* Logo sauber skalieren */
.site-header img.custom-logo,
.custom-logo-link img {
  max-height: 72px;
  width: auto;
}

/* Header-Zeile vertikal ausrichten */
.site-header .site-header-row,
#masthead .site-header-row {
  align-items: center !important;
}

/* Header-Items nicht zu weit auseinander */
.site-header .site-header-item {
  margin-right: 8px !important;
}

.site-header .site-header-item:last-child {
  margin-right: 0 !important;
}

/* ============================================================
   Menüzeile / Navigation
   ============================================================ */

.site-bottom-header-wrap {
  background: #ffffff;
  border-bottom: none !important;
}

/* Gelbe Linie auf innere Headerbreite begrenzen */
.site-bottom-header-inner-wrap {
  border-bottom: 3px solid #F5C400;
}

/* Menüzeile kompakter */
.site-bottom-header-wrap .site-header-row-container-inner {
  min-height: 46px !important;
}

/* Navigation kompakter und hochwertiger */
.site-bottom-header-wrap .primary-menu-container > ul > li > a {
  font-family: var(--it24-font-headline, inherit);
  font-weight: 650;
  font-size: 0.95rem;
  color: #1C1E26;
  padding-left: 16px;
  padding-right: 16px;
  letter-spacing: -0.005em;
}

/* Menü linksbündig mit Logo */
.site-bottom-header-wrap .site-header-section-left,
.site-bottom-header-wrap .main-navigation,
.site-bottom-header-wrap .primary-menu-container,
.site-bottom-header-wrap .menu {
  justify-content: flex-start !important;
}

/* Hover Navigation */
.site-bottom-header-wrap .primary-menu-container > ul > li > a:hover,
.site-bottom-header-wrap .primary-menu-container > ul > li.current-menu-item > a,
.site-bottom-header-wrap .primary-menu-container > ul > li.current_page_item > a {
  color: #F5C400;
}

/* ============================================================
   Alte Kadence Overlay-Suche neutralisieren
   Wichtig: Die echte Suche kommt per Shortcode .it24-header-product-search
   ============================================================ */

.search-toggle-open,
.popup-drawer.search-popup-drawer,
.popup-drawer.search-drawer,
#search-drawer,
.search-drawer,
.kadence-search-drawer {
  display: none !important;
}

/* Alte Header-Suchcontainer nicht mehr als Box stylen */
.site-header .search-toggle-open-container,
.site-header .kadence-search-wrap,
.site-header .header-search-wrap {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* ============================================================
   IT24 Produktsuche im Header
   Shortcode: [it24_header_product_search]
   ============================================================ */

.site-header .it24-header-product-search,
#masthead .it24-header-product-search,
.it24-header-product-search {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  width: 390px !important;
  max-width: 390px !important;
  height: 38px !important;
  margin: 0 8px 0 0 !important;
  padding: 0 !important;
  border: 1.5px solid #F5C400 !important;
  border-radius: 7px !important;
  background: #ffffff !important;
  overflow: hidden !important;
  box-shadow: none !important;
  align-self: center !important;
}

/* Eingabefeld */
.site-header .it24-header-product-search input[type="search"],
#masthead .it24-header-product-search input[type="search"],
.it24-header-product-search input[type="search"],
.it24-header-product-search__field {
  display: block !important;
  width: 100% !important;
  height: 38px !important;
  min-height: 38px !important;
  max-height: 38px !important;
  margin: 0 !important;
  padding: 0 44px 0 13px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: #ffffff !important;
  color: #1C1E26 !important;
  font-size: 0.9rem !important;
  font-weight: 500 !important;
  line-height: 38px !important;
  outline: none !important;
  box-shadow: none !important;
  appearance: none !important;
}

/* Placeholder */
.it24-header-product-search input[type="search"]::placeholder,
.it24-header-product-search__field::placeholder {
  color: #5A6272 !important;
  opacity: 0.9 !important;
}

/* Fokus */
.site-header .it24-header-product-search:focus-within,
#masthead .it24-header-product-search:focus-within,
.it24-header-product-search:focus-within {
  border-color: #DDB000 !important;
  box-shadow: 0 0 0 2px rgba(245,196,0,0.16) !important;
}

.it24-header-product-search input[type="search"]:focus,
.it24-header-product-search__field:focus {
  border: 0 !important;
  outline: none !important;
  box-shadow: none !important;
}

/* Suchbutton rechts */
.site-header .it24-header-product-search button,
#masthead .it24-header-product-search button,
.it24-header-product-search button,
.it24-header-product-search__button {
  position: absolute !important;
  top: 0 !important;
  right: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 40px !important;
  height: 38px !important;
  min-height: 38px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-left: 1px solid #E2E5EA !important;
  border-radius: 0 !important;
  background: #ffffff !important;
  color: #1C1E26 !important;
  cursor: pointer !important;
  box-shadow: none !important;
  transform: none !important;
}

.it24-header-product-search button:hover,
.it24-header-product-search__button:hover {
  background: #FFF8CC !important;
  color: #1C1E26 !important;
}

/* Lupe */
.it24-header-product-search button svg,
.it24-header-product-search__button svg {
  display: block !important;
  width: 17px !important;
  height: 17px !important;
  fill: currentColor !important;
  stroke: none !important;
}

/* Kadence/Button Pseudo-Elemente neutralisieren */
.it24-header-product-search button::before,
.it24-header-product-search button::after {
  display: none !important;
  content: none !important;
}

/* Screenreader Label verstecken */
.it24-header-product-search .screen-reader-text,
.screen-reader-text {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0,0,0,0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/* ============================================================
   Warenkorb
   ============================================================ */

/* Warenkorb: gelbes Icon, kein Rahmen, kein Kasten */
.site-header .header-cart-button,
.site-header .cart-toggle-open-container,
.site-header .header-cart-wrap a {
  width: 38px !important;
  height: 38px !important;
  min-width: 38px !important;
  border: none !important;
  background: transparent !important;
  box-shadow: none !important;
  color: #F5C400 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 !important;
  line-height: 1 !important;
  transition: color 0.18s ease, transform 0.18s ease !important;
}

/* Warenkorb-Icon gelb */
.site-header .header-cart-button svg,
.site-header .cart-toggle-open-container svg,
.site-header .header-cart-wrap a svg {
  width: 24px !important;
  height: 24px !important;
  color: #F5C400 !important;
  fill: none !important;
  stroke: #F5C400 !important;
}

/* Hover Warenkorb */
.site-header .header-cart-button:hover,
.site-header .cart-toggle-open-container:hover,
.site-header .header-cart-wrap a:hover {
  color: #DDB000 !important;
  background: transparent !important;
  transform: translateY(-1px);
}

.site-header .header-cart-button:hover svg,
.site-header .cart-toggle-open-container:hover svg,
.site-header .header-cart-wrap a:hover svg {
  stroke: #DDB000 !important;
}

/* Warenkorb-Zähler */
.site-header .header-cart-total,
.site-header .cart-count,
.site-header .header-cart-button .count {
  background: #F5C400 !important;
  color: #1C1E26 !important;
  font-size: 0.68rem !important;
  font-weight: 850 !important;
  border-radius: 999px !important;
  min-width: 19px !important;
  height: 19px !important;
  line-height: 19px !important;
  padding: 0 5px !important;
}

/* ============================================================
   Header Breite / Ausrichtung
   ============================================================ */

/* Innere Headerbreite auf Shopbreite angleichen, falls Kadence zu breit zieht */
.site-main-header-inner-wrap,
.site-bottom-header-inner-wrap {
  max-width: 1240px;
  margin-left: auto;
  margin-right: auto;
}

/* ============================================================
   Mobile Header
   ============================================================ */

@media (max-width: 1024px) {
  .site-header .it24-header-product-search,
  #masthead .it24-header-product-search,
  .it24-header-product-search {
    width: 320px !important;
    max-width: 320px !important;
  }
}

@media (max-width: 767px) {
  .site-header img.custom-logo,
  .custom-logo-link img {
    max-height: 52px;
  }

  .site-main-header-wrap {
    border-bottom: 1px solid #EDEEF2;
  }

  .site-main-header-wrap .site-header-row-container-inner {
    min-height: 66px !important;
  }

  .site-bottom-header-wrap {
    display: none;
  }

  .site-header .it24-header-product-search,
  #masthead .it24-header-product-search,
  .it24-header-product-search {
    width: 220px !important;
    max-width: 220px !important;
    height: 36px !important;
  }

  .site-header .it24-header-product-search input[type="search"],
  #masthead .it24-header-product-search input[type="search"],
  .it24-header-product-search input[type="search"],
  .it24-header-product-search__field {
    height: 36px !important;
    min-height: 36px !important;
    max-height: 36px !important;
    line-height: 36px !important;
    font-size: 0.86rem !important;
    padding: 0 40px 0 11px !important;
  }

  .site-header .it24-header-product-search button,
  #masthead .it24-header-product-search button,
  .it24-header-product-search button,
  .it24-header-product-search__button {
    width: 38px !important;
    height: 36px !important;
    min-height: 36px !important;
  }

  .it24-header-product-search button svg,
  .it24-header-product-search__button svg {
    width: 16px !important;
    height: 16px !important;
  }

  .site-header .header-cart-button,
  .site-header .cart-toggle-open-container,
  .site-header .header-cart-wrap a {
    width: 36px !important;
    height: 36px !important;
    min-width: 36px !important;
  }
}

@media (max-width: 560px) {
  .site-header .it24-header-product-search,
  #masthead .it24-header-product-search,
  .it24-header-product-search {
    width: 190px !important;
    max-width: 190px !important;
    height: 34px !important;
  }

  .site-header .it24-header-product-search input[type="search"],
  #masthead .it24-header-product-search input[type="search"],
  .it24-header-product-search input[type="search"],
  .it24-header-product-search__field {
    height: 34px !important;
    min-height: 34px !important;
    max-height: 34px !important;
    line-height: 34px !important;
    font-size: 0.82rem !important;
    padding-right: 38px !important;
  }

  .site-header .it24-header-product-search button,
  #masthead .it24-header-product-search button,
  .it24-header-product-search button,
  .it24-header-product-search__button {
    width: 36px !important;
    height: 34px !important;
    min-height: 34px !important;
  }
}
/* ============================================================
   IT24 – Header Warenkorb passend zur Produktsuche
   eckig, gleiche Höhe, sauber in Linie
   ============================================================ */

/* Header-Aktionsbereich sauber ausrichten */
.site-header .site-header-section-right,
.site-header .site-header-item,
.site-header .header-cart-wrap,
.site-header .cart-toggle-open-container {
  display: flex !important;
  align-items: center !important;
}

/* Abstand Suche -> Warenkorb */
.site-header .it24-header-product-search {
  margin-right: 10px !important;
}

/* Warenkorb-Button wie Suchfeld, nicht rund */
.site-header .header-cart-button,
.site-header .cart-toggle-open-container,
.site-header .header-cart-wrap a {
  position: relative !important;
  width: 46px !important;
  height: 38px !important;
  min-width: 46px !important;
  min-height: 38px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 1.5px solid #F5C400 !important;
  border-radius: 7px !important;
  background: #ffffff !important;
  color: #F5C400 !important;
  box-shadow: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1 !important;
  transform: none !important;
}

/* Warenkorb-Icon */
.site-header .header-cart-button svg,
.site-header .cart-toggle-open-container svg,
.site-header .header-cart-wrap a svg {
  width: 22px !important;
  height: 22px !important;
  color: #F5C400 !important;
  fill: none !important;
  stroke: #F5C400 !important;
  stroke-width: 2 !important;
}

/* Hover passend zur Suche */
.site-header .header-cart-button:hover,
.site-header .cart-toggle-open-container:hover,
.site-header .header-cart-wrap a:hover {
  background: #FFF8CC !important;
  border-color: #DDB000 !important;
  color: #DDB000 !important;
  transform: none !important;
}

.site-header .header-cart-button:hover svg,
.site-header .cart-toggle-open-container:hover svg,
.site-header .header-cart-wrap a:hover svg {
  stroke: #DDB000 !important;
  color: #DDB000 !important;
}

/* Alle möglichen Kadence/WooCommerce Count-Elemente sichtbar machen */
.site-header .header-cart-button .count,
.site-header .header-cart-wrap .count,
.site-header .cart-count,
.site-header .header-cart-total,
.site-header .kadence-cart-count,
.site-header .kadence-header-cart-count {
  display: inline-flex !important;
  visibility: visible !important;
  opacity: 1 !important;
}

/* Zähler als Badge oben rechts */
.site-header .header-cart-button .count,
.site-header .header-cart-wrap .count,
.site-header .cart-count,
.site-header .kadence-cart-count,
.site-header .kadence-header-cart-count {
  position: absolute !important;
  top: -8px !important;
  right: -8px !important;
  min-width: 20px !important;
  height: 20px !important;
  padding: 0 6px !important;
  border: 2px solid #ffffff !important;
  border-radius: 999px !important;
  background: #F5C400 !important;
  color: #1C1E26 !important;
  font-size: 0.68rem !important;
  font-weight: 900 !important;
  line-height: 16px !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  box-shadow: 0 3px 8px rgba(28,30,38,0.14) !important;
  z-index: 3 !important;
}

/* Falls Kadence den Count als header-cart-total ausgibt */
.site-header .header-cart-total {
  position: absolute !important;
  top: -8px !important;
  right: -8px !important;
  min-width: 20px !important;
  height: 20px !important;
  padding: 0 6px !important;
  border: 2px solid #ffffff !important;
  border-radius: 999px !important;
  background: #F5C400 !important;
  color: #1C1E26 !important;
  font-size: 0.68rem !important;
  font-weight: 900 !important;
  line-height: 16px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-shadow: 0 3px 8px rgba(28,30,38,0.14) !important;
}

/* Preis/Amount im Header-Warenkorb ausblenden, aber Count behalten */
.site-header .header-cart-button .amount,
.site-header .header-cart-wrap .amount,
.site-header .cart-toggle-open-container .amount {
  display: none !important;
}

/* Wenn Kadence den Zähler nur als Text neben dem Icon ausgibt */
.site-header .header-cart-button > span:not(.amount),
.site-header .header-cart-wrap a > span:not(.amount) {
  font-size: 0.68rem !important;
  font-weight: 900 !important;
}

/* Mobile */
@media (max-width: 767px) {
  .site-header .header-cart-button,
  .site-header .cart-toggle-open-container,
  .site-header .header-cart-wrap a {
    width: 42px !important;
    height: 36px !important;
    min-width: 42px !important;
    min-height: 36px !important;
  }

  .site-header .header-cart-button svg,
  .site-header .cart-toggle-open-container svg,
  .site-header .header-cart-wrap a svg {
    width: 20px !important;
    height: 20px !important;
  }
}
/* ============================================================
   IT24 – Header Suche + Warenkorb exakt auf einer Höhe
   ============================================================ */

/* Rechte Header-Sektion sauber vertikal zentrieren */
.site-header .site-header-section-right,
.site-header .site-header-section-right .site-header-item,
.site-header .header-cart-wrap,
.site-header .cart-toggle-open-container,
.site-header .it24-header-product-search {
  display: flex !important;
  align-items: center !important;
}

/* Suche und Warenkorb exakt gleiche Höhe */
.site-header .it24-header-product-search {
  height: 38px !important;
  min-height: 38px !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

.site-header .header-cart-button,
.site-header .cart-toggle-open-container,
.site-header .header-cart-wrap a {
  height: 38px !important;
  min-height: 38px !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  align-self: center !important;
}

/* Falls Kadence den Cart intern etwas verschiebt */
.site-header .header-cart-wrap,
.site-header .cart-toggle-open-container {
  height: 38px !important;
  min-height: 38px !important;
  align-self: center !important;
  transform: translateY(0) !important;
}

/* Feinkorrektur: Warenkorb minimal nach unten ziehen */
.site-header .header-cart-button,
.site-header .cart-toggle-open-container,
.site-header .header-cart-wrap a {
  transform: translateY(7px) !important;
}

/* Hover darf nicht mehr springen */
.site-header .header-cart-button:hover,
.site-header .cart-toggle-open-container:hover,
.site-header .header-cart-wrap a:hover {
  transform: translateY(1px) !important;
}