/*
Theme Name: Kathrein-DS2
Description: Multi-Purpose Wordpress Theme
Author: Codex Themes.
Theme URI: http://codex-themes.com/thegem/
Author URI: http://codex-themes.com/thegem/
Template: thegem
Version: 1.0
Tags: one-column, two-columns, left-sidebar, right-sidebar, responsive-layout, custom-background, custom-colors, custom-header, custom-menu, featured-images, flexible-header, full-width-template, theme-options, translation-ready, dark, light
License: GNU General Public License
License URI: license.txt
*/
@import url('css/montserrat.css');
@import url('css/roboto.css');

/*
Colors:
    light-blue: #009ee0;
    blue:       #006AB2;
    white:      #fff;
    grey:       #2a2b2a;
*/

/* ===============================
   Seiteninhalt breiter machen
================================ */

#main-content .container,
#main .container,
.block-content .container{
  max-width: 1600px !important;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
}

/* =========================================
   Kathrein Produktseiten: Tabs näher an Produktbereich
   ========================================= */

/* Desktop */
.single-product .vc_row:has(.vc_tta-container) {
  position: relative !important;
  top: -150px !important;
  margin-bottom: -150px !important;
}

/* Abstand zwischen Radio-Icons und Tabs */
.single-product .kathrein-radio-icons {
  margin-top: 0 !important;
  margin-bottom: 50px !important;
}

/* Tablet & Mobil */
@media (max-width: 1024px) {
  .single-product .vc_row:has(.vc_tta-container) {
    position: relative !important;
    top: -150px !important;
    margin-bottom: -150px !important;
  }

  .single-product .kathrein-radio-icons {
    margin-top: 0 !important;
    margin-bottom: 25px !important;
  }
}

/* =========================================
   TheGem Mega-Menü: Spalten etwas breiter
========================================= */

/* Erste Menüspalte */
.site-header .sub-menu > li,
#site-header .sub-menu > li,
.header-wrapper .sub-menu > li,
nav .sub-menu > li,
.menu .sub-menu > li {
    min-width: 310px !important;
}

/* Zweite Menüspalte */
.site-header .sub-menu .sub-menu,
#site-header .sub-menu .sub-menu,
.header-wrapper .sub-menu .sub-menu,
nav .sub-menu .sub-menu,
.menu .sub-menu .sub-menu {
    min-width: 310px !important;
}

/* Menütexte nicht umbrechen lassen */
.site-header .sub-menu li a,
#site-header .sub-menu li a,
.header-wrapper .sub-menu li a,
nav .sub-menu li a,
.menu .sub-menu li a {
    padding-left: 38px !important;
    padding-right: 38px !important;
    white-space: nowrap !important;
}

/* ===============================
   Aufzählungszeichen rot färben
   TheGem / WPBakery li::before
================================ */

.entry-content ul li::before,
.wpb_text_column ul li::before,
.vc_column-inner ul li::before,
.product .woocommerce-tabs ul li::before,
.woocommerce-tabs ul li::before {
  color: #ff0000 !important;
}

/* ===============================
   Kathrein Icon direkt vor Headline
   Standard: linksbündig
   Zusatzklasse: kds-icon-headline-center = zentriert
================================ */

/* Grundstil: Icon bleibt an der ersten Zeile ausgerichtet */
.kds-icon-headline h1,
.kds-icon-headline h2,
.kds-icon-headline h3 {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: flex-start !important;
  gap: 16px;

  padding-left: 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* Icon */
.kds-icon-headline h1::before,
.kds-icon-headline h2::before,
.kds-icon-headline h3::before {
  content: "";
  flex: 0 0 30px;
  width: 30px;
  height: 30px;
  display: inline-block;

  background: url('/wp-content/uploads/2026/04/kathrein_arrow_icon.webp') no-repeat center center;
  background-size: 30px 30px;

  margin-top: 0px;
  transform: none !important;
}

/* Zusatzklasse: zentriert Icon + Überschrift gemeinsam */
.kds-icon-headline.kds-icon-headline-center h1,
.kds-icon-headline.kds-icon-headline-center h2,
.kds-icon-headline.kds-icon-headline-center h3 {
  justify-content: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: center !important;
}

/* alte absolute Positionierung sicher überschreiben */
.kds-icon-headline::before {
  content: none !important;
}

/* ===============================
   Produkt-Tabellen allgemein
   2-spaltig: product-specs-table
   4-spaltig: wallbox-variants-table
================================ */

/* Basis: Tabelle selbst */
.product-specs-table table,
table.product-specs-table,
.wallbox-variants-table table,
table.wallbox-variants-table {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
  background: transparent !important;
  background-color: transparent !important;
  font-size: 16px;
  margin: 0 0 28px;
}

/* Tabellenbereiche transparent */
.product-specs-table table thead,
.product-specs-table table tbody,
.product-specs-table table tfoot,
table.product-specs-table thead,
table.product-specs-table tbody,
table.product-specs-table tfoot,
.wallbox-variants-table table thead,
.wallbox-variants-table table tbody,
.wallbox-variants-table table tfoot,
table.wallbox-variants-table thead,
table.wallbox-variants-table tbody,
table.wallbox-variants-table tfoot {
  background: transparent !important;
  background-color: transparent !important;
}

/* Zeilen */
.product-specs-table table tr,
table.product-specs-table tr,
.wallbox-variants-table table tr,
table.wallbox-variants-table tr {
  border-bottom: 1px solid #e2e2e2;
  background: transparent !important;
  background-color: transparent !important;
}

.product-specs-table table tr:first-child,
table.product-specs-table tr:first-child,
.wallbox-variants-table table tr:first-child,
table.wallbox-variants-table tr:first-child {
  border-top: 1px solid #e2e2e2;
}

/* Zellen */
.product-specs-table table td,
.product-specs-table table th,
table.product-specs-table td,
table.product-specs-table th,
.wallbox-variants-table table td,
.wallbox-variants-table table th,
table.wallbox-variants-table td,
table.wallbox-variants-table th {
  padding: 10px 16px !important;
  vertical-align: middle !important;
  text-align: left !important;
  border: none !important;
  font-size: 16px;
  line-height: 20px;
  color: #4d4d4d;
  background: transparent !important;
  background-color: transparent !important;
  overflow-wrap: normal;
  word-break: normal;
}

/* Tabellenkopf bei Varianten */
.wallbox-variants-table table th,
table.wallbox-variants-table th {
  font-weight: 600;
  color: #333333;
}

/* ===============================
   2-spaltige Tabelle: Eigenschaften
================================ */

.product-specs-table table td:first-child,
.product-specs-table table th:first-child,
table.product-specs-table td:first-child,
table.product-specs-table th:first-child {
  width: 36%;
  font-weight: 600;
  color: #333333;
}

.product-specs-table table td:last-child,
.product-specs-table table th:last-child,
table.product-specs-table td:last-child,
table.product-specs-table th:last-child {
  width: 64%;
  color: #4d4d4d;
}

/* Zeilenumbrüche in Eigenschaften erhalten */
.product-specs-table table td,
table.product-specs-table td {
  white-space: pre-line;
  overflow-wrap: break-word;
  word-break: break-word;
}

/* ===============================
   4-spaltige Tabelle: Varianten
================================ */

/* Spalte 1: Ladeleistung */
.wallbox-variants-table table th:nth-child(1),
.wallbox-variants-table table td:nth-child(1),
table.wallbox-variants-table th:nth-child(1),
table.wallbox-variants-table td:nth-child(1) {
  width: 18%;
  font-weight: 600;
  color: #333333;
}

/* Spalte 2: Farbe */
.wallbox-variants-table table th:nth-child(2),
.wallbox-variants-table table td:nth-child(2),
table.wallbox-variants-table th:nth-child(2),
table.wallbox-variants-table td:nth-child(2) {
  width: 22%;
}

/* Spalte 3: Anschluss */
.wallbox-variants-table table th:nth-child(3),
.wallbox-variants-table table td:nth-child(3),
table.wallbox-variants-table th:nth-child(3),
table.wallbox-variants-table td:nth-child(3) {
  width: 32%;
}

/* Spalte 4: Artikel-Nr. */
.wallbox-variants-table table th:nth-child(4),
.wallbox-variants-table table td:nth-child(4),
table.wallbox-variants-table th:nth-child(4),
table.wallbox-variants-table td:nth-child(4) {
  width: 28%;
  font-weight: 600;
  color: #333333;
}

/* Keine erzwungenen Umbrüche in der Varianten-Tabelle */
.wallbox-variants-table table td,
table.wallbox-variants-table td {
  white-space: normal;
  overflow-wrap: normal;
  word-break: normal;
}

/* ===============================
   Mobil
================================ */

@media (max-width: 767px) {

  /* 2-spaltige Eigenschaften mobil untereinander */
  .product-specs-table table,
  .product-specs-table table tbody,
  .product-specs-table table tr,
  .product-specs-table table td,
  table.product-specs-table,
  table.product-specs-table tbody,
  table.product-specs-table tr,
  table.product-specs-table td {
    display: block;
    width: 100% !important;
    background: transparent !important;
    background-color: transparent !important;
  }

  .product-specs-table table tr,
  table.product-specs-table tr {
    padding: 0;
  }

  .product-specs-table table td,
  table.product-specs-table td {
    padding: 8px 0 !important;
    line-height: 18px;
  }

  .product-specs-table table td:first-child,
  table.product-specs-table td:first-child {
    font-weight: 600;
    width: 100% !important;
    padding-bottom: 4px !important;
  }

  .product-specs-table table td:last-child,
  table.product-specs-table td:last-child {
    width: 100% !important;
    padding-top: 0 !important;
  }

  /* 4-spaltige Varianten mobil als Karten */
  .wallbox-variants-table table,
  .wallbox-variants-table table thead,
  .wallbox-variants-table table tbody,
  .wallbox-variants-table table tr,
  .wallbox-variants-table table th,
  .wallbox-variants-table table td,
  table.wallbox-variants-table,
  table.wallbox-variants-table thead,
  table.wallbox-variants-table tbody,
  table.wallbox-variants-table tr,
  table.wallbox-variants-table th,
  table.wallbox-variants-table td {
    display: block;
    width: 100% !important;
  }

  .wallbox-variants-table table thead,
  table.wallbox-variants-table thead {
    display: none;
  }

  .wallbox-variants-table table tr,
  table.wallbox-variants-table tr {
    padding: 12px 0;
    border-bottom: 1px solid #e2e2e2;
  }

  .wallbox-variants-table table td,
  table.wallbox-variants-table td {
    border-bottom: none !important;
    padding: 5px 0 !important;
    line-height: 18px;
  }

  .wallbox-variants-table table td:nth-child(1)::before,
  table.wallbox-variants-table td:nth-child(1)::before {
    content: "Ladeleistung: ";
    font-weight: 600;
    color: #333333;
  }

  .wallbox-variants-table table td:nth-child(2)::before,
  table.wallbox-variants-table td:nth-child(2)::before {
    content: "Farbe: ";
    font-weight: 600;
    color: #333333;
  }

  .wallbox-variants-table table td:nth-child(3)::before,
  table.wallbox-variants-table td:nth-child(3)::before {
    content: "Anschluss: ";
    font-weight: 600;
    color: #333333;
  }

  .wallbox-variants-table table td:nth-child(4)::before,
  table.wallbox-variants-table td:nth-child(4)::before {
    content: "Artikel-Nr.: ";
    font-weight: 600;
    color: #333333;
  }
}

/* ===============================
   Border Ansprechpartner
================================ */

.wpb_column.textblock > .vc_column-inner,
.vc_column_container.textblock > .vc_column-inner{
  border: 1px solid #d9dde2 !important;
  border-radius: 0 30px 30px 30px !important;
  background: #fff !important;
  overflow: hidden !important;
}

/* ===============================
   Border Allgemeine Kacheln, Textblöcke
================================ */

.contact-team-card > .vc_column-inner{
  border: 1px solid #d9dde2 !important;
  border-radius: 0 30px 30px 30px !important;
  background: #fff !important;
  overflow: hidden !important; }

/* ===============================
   Schatten im Titelbild
================================ */

.page-title-title{
  text-shadow: 0 3px 12px rgba(0,0,0,0.45);
}

.page-title-excerpt{
  text-shadow: 0 2px 12px rgba(0,0,0,0.8);
}

#page-title.page-title-block.has-background-image{
  position: relative;
  overflow: hidden;
}

#page-title.page-title-block.has-background-image::before{
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 68%;
  height: 100%;
  background: linear-gradient(
    to right,
    rgba(0,0,0,0.32) 0%,
    rgba(0,0,0,0.22) 55%,
    rgba(0,0,0,0.10) 80%,
    rgba(0,0,0,0.00) 100%
  );
  pointer-events: none;
  z-index: 1;
}

#page-title .page-title-inner,
#page-title .page-title-content,
#page-title .page-title-title,
#page-title .page-title-excerpt{
  position: relative;
  z-index: 2;
}

#page-title .page-title-title,
#page-title .page-title-excerpt{
  color: #fff !important;
}

/* =========================================
   Kathrein page cards
   ========================================= */


/* =========================================
   Gemeinsame Basis
   ========================================= */

.support-card-col,
.support-card-title-only{
  margin-bottom: 0 !important;
  cursor: pointer;
}

/* WPBakery-Abstände entfernen */
.support-card-col .vc_column-inner,
.support-card-col .wpb_wrapper,
.support-card-col .wpb_single_image,
.support-card-col .wpb_text_column,
.support-card-title-only .vc_column-inner,
.support-card-title-only .wpb_wrapper,
.support-card-title-only .wpb_single_image,
.support-card-title-only .wpb_text_column{
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

/* Bild-Wrapper */
.support-card-col .support-card-image .vc_single_image-wrapper,
.support-card-title-only .support-card-image .vc_single_image-wrapper{
  display: block !important;
  margin: 0 !important;
  border-radius: 20px 20px 0 0 !important;
  overflow: hidden !important;
}

/* Bild */
.support-card-col .support-card-image .vc_single_image-wrapper img,
.support-card-title-only .support-card-image .vc_single_image-wrapper img{
  display: block !important;
  width: 100% !important;
  height: auto !important;
  margin: 0 !important;
  border-radius: 20px 20px 0 0 !important;
  transition: transform 0.4s ease !important;
  transform: scale(1);
}

/* Hover-Zoom */
.support-card-col:hover .support-card-image .vc_single_image-wrapper img,
.support-card-title-only:hover .support-card-image .vc_single_image-wrapper img{
  transform: scale(1.08);
}


/* =========================================
   Variante 1: Kacheln mit Überschrift + Text
   Spalte: support-card-col
   ========================================= */

.support-card-col .wpb_text_column.support-card-content{
  background: #4a4a4a !important;
  padding: 16px 24px 18px 24px !important;
  margin: 0 !important;
  border-radius: 0 0 20px 20px !important;
  color: #ffffff !important;
  text-align: center !important;

  height: auto !important;
  min-height: 118px !important;
  max-height: none !important;
  box-sizing: border-box !important;

  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* Innerer Wrapper */
.support-card-col .wpb_text_column.support-card-content > .wpb_wrapper{
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;

  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;

  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box !important;
}

/* Überschrift */
.support-card-col .wpb_text_column.support-card-content h3{
  margin: 0 0 8px 0 !important;
  padding: 0 !important;
  color: #ffffff !important;
  text-align: center !important;
  font-size: 20px !important;
  line-height: 1.2 !important;
  font-weight: 600 !important;
  letter-spacing: normal !important;
  text-transform: none !important;

  display: block !important;
  position: static !important;
  transform: none !important;
}

/* Text */
.support-card-col .wpb_text_column.support-card-content p{
  margin: 0 !important;
  padding: 0 !important;
  color: #ffffff !important;
  text-align: center !important;
  font-size: 16px !important;
  line-height: 1.25 !important;
  font-weight: 400 !important;
}


/* =========================================
   Variante 2: Kacheln nur mit Überschrift
   Spalte: support-card-content support-card-title-only
   ========================================= */

.support-card-title-only .wpb_text_column.support-card-content{
  background: #4a4a4a !important;
  padding: 0 24px !important;
  margin: 0 !important;
  border-radius: 0 0 20px 20px !important;
  color: #ffffff !important;
  text-align: center !important;

  height: 72px !important;
  min-height: 72px !important;
  max-height: 72px !important;
  box-sizing: border-box !important;

  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* Innerer Wrapper */
.support-card-title-only .wpb_text_column.support-card-content > .wpb_wrapper{
  width: 100% !important;
  height: 72px !important;
  min-height: 72px !important;
  max-height: 72px !important;

  display: flex !important;
  align-items: center !important;
  justify-content: center !important;

  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box !important;
}

/* Überschrift */
.support-card-title-only .wpb_text_column.support-card-content h3{
  margin: 0 !important;
  padding: 0 !important;
  color: #ffffff !important;
  text-align: center !important;
  font-size: 20px !important;
  line-height: 1.2 !important;
  font-weight: 600 !important;
  letter-spacing: normal !important;
  text-transform: none !important;

  display: block !important;
  position: static !important;
  transform: none !important;
}

/* Falls WPBakery die Überschrift in einen Absatz setzt */
.support-card-title-only .wpb_text_column.support-card-content p{
  margin: 0 !important;
  padding: 0 !important;
  line-height: 1.2 !important;
}


/* =========================================
   Mobile Optimierung
   ========================================= */

@media (max-width: 767px){

  .support-card-col .wpb_text_column.support-card-content{
    padding: 14px 18px 16px 18px !important;
    min-height: 110px !important;
  }

  .support-card-col .wpb_text_column.support-card-content h3,
  .support-card-title-only .wpb_text_column.support-card-content h3{
    font-size: 19px !important;
  }

  .support-card-col .wpb_text_column.support-card-content p{
    font-size: 15px !important;
    line-height: 1.3 !important;
  }

  .support-card-title-only .wpb_text_column.support-card-content,
  .support-card-title-only .wpb_text_column.support-card-content > .wpb_wrapper{
    height: 68px !important;
    min-height: 68px !important;
    max-height: 68px !important;
  }
}

/* ===============================
   Nur Links im eigentlichen Fließtext unterstreichen
================================ */

.wpb_text_column p a,
.entry-content p a,
.textwidget p a{
  text-decoration: underline !important;
  text-underline-offset: 2px;
}

/* ===================
   Header Schatten
====================== */

#site-header-wrapper .header-background:before,
#site-header-wrapper .header-background:after,
#site-header-wrapper .header-background{
  box-shadow: 0 2px 8px rgba(0,0,0,0.08) !important;
}

/* ===================================
   WP File Download Buttons und Tags
==================================== */

/* WPFD – Reihenfolge: 1) Filter-Header 2) Tag-Buttons 3) Suchleiste */
.box-search-filter{
  display: flex !important;
  flex-direction: column !important;
  margin-top: 0 !important;
}

.mediaTableWrapperWithMenu > .mediaTableMenu{
  display:none !important;
}

.box-search-filter > #filter.wpfd-filter.wpfd_tabcontent.active{
  order: 1 !important;
}

.box-search-filter > .searchSection{
  order: 3 !important;
  margin-top: 15px !important;
}

/* Innerhalb des Filter-Blocks */
#filter.wpfd-filter.wpfd_tabcontent.active,
.wpfd-filter.wpfd_tabcontent.active{
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  border: none !important;
}

#filter.wpfd-filter.wpfd_tabcontent.active .top.clearfix{
  order: 1 !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
}

#filter.wpfd-filter.wpfd_tabcontent.active .tags-item{
  order: 2 !important;
}

/* WPFD Filter-Tags */
.tags-item,
.wpfd-filter.wpfd_tabcontent.active .tags-item{
  margin-bottom: 0 !important;
  display: inline-flex;
  align-items: center;
}

.chk-tags-filtering ul{
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  padding: 0 !important;
  margin: 0 !important;
}

.chk-tags-filtering ul li.tags-item{
  margin: 0 !important;
}

/* Aktiver Filter-Tag */
.chk-tags-filtering ul li.tags-item.active{
  background-color: #ffe9ec !important;
  background-image: none !important;
  box-shadow:
    0 3px 8px rgba(227,6,19,0.10),
    0 0 0 1px #E30613 inset !important;
  border: none !important;
  border-radius: 4px !important;
  box-sizing: border-box !important;
}

.chk-tags-filtering ul li.tags-item.active > a,
.chk-tags-filtering ul li.tags-item.active > span{
  border: none !important;
  box-shadow: none !important;
  background: transparent !important;
}

.chk-tags-filtering ul li.tags-item.active,
.chk-tags-filtering ul li.tags-item.active *{
  color: #2c2c2c !important;
}

/* WPFD Kategorie-Buttons – Grundlayout */
.wpfd-container .wpfd-categories,
.wpfd-content .wpfd-categories,
.wpfd-container .wpfd-subcategories,
.wpfd-content .wpfd-subcategories{
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 0 !important;
}

.wpfd-container .wpfd-categories a.wpfdcategory.catlink,
.wpfd-content .wpfd-categories a.wpfdcategory.catlink,
.wpfd-container .wpfd-subcategories a.wpfdcategory.catlink,
.wpfd-content .wpfd-subcategories a.wpfdcategory.catlink{
  margin: 10px !important;
  flex: 0 0 calc(33.333% - 20px) !important;
  width: calc(33.333% - 20px) !important;
  max-width: calc(33.333% - 20px) !important;
  box-sizing: border-box !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: unset !important;
  background-color: #ffffff !important;
  border: 1px solid #e3e3e3 !important;
  transition: all 0.2s ease;
}

.wpfd-container .wpfd-categories a.wpfdcategory.catlink:hover,
.wpfd-content .wpfd-categories a.wpfdcategory.catlink:hover{
  background-color: #fff6f7 !important;
  border-color: #E30613 !important;
  box-shadow: 0 3px 8px rgba(227,6,19,0.06);
}

@media (max-width: 991px){
  .wpfd-container .wpfd-categories a.wpfdcategory.catlink,
  .wpfd-content .wpfd-categories a.wpfdcategory.catlink,
  .wpfd-container .wpfd-subcategories a.wpfdcategory.catlink,
  .wpfd-content .wpfd-subcategories a.wpfdcategory.catlink{
    flex: 0 0 calc(50% - 20px) !important;
    width: calc(50% - 20px) !important;
    max-width: calc(50% - 20px) !important;
  }
}

@media (max-width: 575px){
  .wpfd-container .wpfd-categories a.wpfdcategory.catlink,
  .wpfd-content .wpfd-categories a.wpfdcategory.catlink,
  .wpfd-container .wpfd-subcategories a.wpfdcategory.catlink,
  .wpfd-content .wpfd-subcategories a.wpfdcategory.catlink{
    flex: 0 0 calc(100% - 20px) !important;
    width: calc(100% - 20px) !important;
    max-width: calc(100% - 20px) !important;
  }
}

.wpfd-container .wpfd-categories a.wpfdcategory.catlink span,
.wpfd-content .wpfd-categories a.wpfdcategory.catlink span,
.wpfd-container .wpfd-subcategories a.wpfdcategory.catlink span,
.wpfd-content .wpfd-subcategories a.wpfdcategory.catlink span{
  flex: 1 1 auto !important;
  min-width: 0 !important;
  max-width: none !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

/* ===============================
   WP File Download – graue Markierung bei heruntergeladenen Dateien entfernen
================================ */

.wpfd-container .file.is_downloaded,
.wpfd-container .file.pdf.is_downloaded,
.wpfd-content-default .wpfd_list .file.is_downloaded,
.wpfd-content-default .wpfd_list .file.pdf.is_downloaded,
#te_doc .wpfd-content-default .wpfd_list .file.is_downloaded,
#te_doc .wpfd-content-default .wpfd_list .file.pdf.is_downloaded {
  background: #ffffff !important;
  background-color: #ffffff !important;
  background-image: none !important;
}

/* ======================
   Tabs in Produkten
====================== */

/* Aktiver Tab */
.vc_tta-color-white.vc_tta-style-modern .vc_tta-tab.vc_active > a {
    background-color: #F1F2F3 !important;
    border-color: #E9E9E9 !important;
    color: #2c2c2c !important;
}

.vc_tta-color-white.vc_tta-style-modern .vc_tta-tab > a {
    border-color: #E9E9E9 !important;
}

.vc_tta.vc_tta-style-modern .vc_tta-tabs-list {
    border-bottom: none !important;
}

/* Mobile Panels (Grundzustand) */
.vc_tta-color-white.vc_tta-style-modern .vc_tta-panel-heading {
    background-color: #ffffff;
    border-color: #E9E9E9 !important;
}

/* Mobile Titel-Link */
.vc_tta-color-white.vc_tta-style-modern .vc_tta-panel-title a {
    color: #2c2c2c !important;
}

/* Aktives Panel (geöffnet) */
.vc_tta-color-white.vc_tta-style-modern .vc_tta-panel.vc_active .vc_tta-panel-heading {
    background-color: #F1F2F3 !important;
    border-color: #E9E9E9 !important;
}

/* ========================================
   Button in Suchergebnissen ausblenden
======================================== */

/* TheGem – View All Button in normalen Suchergebnissen entfernen */
a.view-all.gem-button{
  display: none !important;
}

/* ===============================
   Produktseite: Bezugsquellen-Box
================================ */

.kathrein-source-box {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    width: 100% !important;
    max-width: 520px !important;
    margin-top: 22px !important;
    margin-bottom: 22px !important;
    padding: 14px 0 !important;
    border-top: 1px solid #e5e5e5 !important;
    border-bottom: 1px solid #e5e5e5 !important;
    text-decoration: none !important;
    color: #2f3b46 !important;
    clear: both !important;
}

.kathrein-source-box:hover {
    text-decoration: none !important;
}

.kathrein-source-icon {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 48px !important;
    height: 48px !important;
    min-width: 48px !important;
    flex: 0 0 48px !important;
}

.kathrein-source-icon img {
    display: block !important;
    width: 30px !important;
    height: 30px !important;
    max-width: 30px !important;
    object-fit: contain !important;
}

.kathrein-source-text {
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    line-height: 1.25 !important;
}

.kathrein-source-title {
    display: block !important;
    font-size: 18px !important;
    font-weight: 500 !important;
    color: #2f3b46 !important;
}

.kathrein-source-subtitle {
    display: block !important;
    margin-top: 4px !important;
    font-size: 14px !important;
    font-weight: 400 !important;
    color: #4d5a64 !important;
}

.kathrein-source-box:hover .kathrein-source-title,
.kathrein-source-box:hover .kathrein-source-subtitle {
    color: #e30613 !important;
}

.kathrein-product-numbers {
    display: block !important;
    width: 100% !important;
    clear: both !important;
}

.kathrein-product-number-row {
    display: block !important;
    width: 100% !important;
    clear: both !important;
}

/* ===============================
   KATHREIN Fachhandel-Suche
================================ */

.kathrein-dealer-search {
    margin: 40px 0;
    padding: 30px;
    background: #f7f7f7;
}

.kathrein-dealer-search h2 {
    margin-top: 0;
    margin-bottom: 12px;
    color: #2f3b46;
}

.kathrein-dealer-search-form {
    display: flex;
    gap: 10px;
    margin-top: 24px;
    margin-bottom: 24px;
}

.kathrein-dealer-search-input {
    flex: 1;
    height: 46px;
    min-height: 46px;
    padding: 0 14px;
    border: 1px solid #cfcfcf;
    background: #ffffff !important;
    color: #2f3b46;
    font-size: 15px;
    line-height: 46px;
    box-sizing: border-box;
}

.kathrein-dealer-search-input:focus {
    background: #ffffff !important;
    border-color: #999999;
    outline: none;
}

.kathrein-dealer-search-form button {
    height: 46px;
    min-height: 46px;
    padding: 0 26px;
    border: none;
    background: #e30613;
    color: #ffffff;
    font-size: 15px;
    cursor: pointer;
    box-sizing: border-box;
}

.kathrein-dealer-search-form button:hover {
    background: #c9000b;
}

.kathrein-dealer-table-wrap {
    max-height: 650px;
    overflow: auto;
    background: #ffffff;
    border: 1px solid #e2e2e2;
}

.kathrein-dealer-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
}

.kathrein-dealer-table th,
.kathrein-dealer-table td {
    padding: 11px 12px;
    border-bottom: 1px solid #e5e5e5;
    text-align: left;
    vertical-align: top;
}

.kathrein-dealer-table th {
    background: #333333;
    color: #ffffff;
    font-weight: 600;
    position: sticky;
    top: 0;
    z-index: 1;
}

.kathrein-dealer-table tr:nth-child(even) {
    background: #f9f9f9;
}

.kathrein-dealer-ready {
    color: #2d7a2d;
}

.kathrein-dealer-error {
    color: #b00020;
}

@media (max-width: 768px) {
    .kathrein-dealer-search {
        padding: 22px;
    }

    .kathrein-dealer-search-form {
        flex-direction: column;
        gap: 10px;
    }

    .kathrein-dealer-search-input {
        width: 100%;
        height: 52px !important;
        min-height: 52px !important;
        padding: 0 14px !important;
        background: #ffffff !important;
        color: #2f3b46;
        font-size: 16px !important;
        line-height: 52px !important;
        box-sizing: border-box;
    }

    .kathrein-dealer-search-form button {
        width: 100%;
        height: 52px !important;
        min-height: 52px !important;
        font-size: 16px !important;
        box-sizing: border-box;
    }

    .kathrein-dealer-table {
        min-width: 760px;
    }
}

/* =========================================
   KATHREIN Startseite Kategorie-Kacheln
========================================= */

/* Abstand der Kachel-Spalten */
.kathrein-category-card {
    margin-bottom: 30px;
}

/* Der eigentliche sichtbare Kachel-Container in WPBakery */
.kathrein-category-card > .vc_column-inner {
    background: #ffffff;
    border-radius: 18px;
    overflow: hidden;
    box-shadow: 0 10px 30px rgba(0,0,0,0.08);
    transition: transform 0.25s ease, box-shadow 0.25s ease;
    padding: 0 !important;
}

/* Hover-Effekt für ganze Kachel */
.kathrein-category-card:hover > .vc_column-inner {
    transform: translateY(-4px);
    box-shadow: 0 16px 40px rgba(0,0,0,0.13);
}

/* WPBakery Wrapper-Abstände entfernen */
.kathrein-category-card .wpb_wrapper,
.kathrein-category-card .wpb_single_image,
.kathrein-category-card .wpb_text_column,
.kathrein-category-card .wpb_raw_html,
.kathrein-category-card .kathrein-category-card-html {
    margin: 0 !important;
}

/* Bildbereich */
.kathrein-category-card-image {
    margin-bottom: 0 !important;
}

.kathrein-category-card-image .vc_single_image-wrapper {
    display: block !important;
    width: 100% !important;
    overflow: hidden;
    border-radius: 18px 18px 0 0;
}

/* Bild selbst */
.kathrein-category-card-image img {
    display: block !important;
    width: 100% !important;
    height: 210px !important;
    object-fit: cover !important;
    border-radius: 18px 18px 0 0;
    transition: transform 0.4s ease;
}

/* Bild-Zoom bei Hover */
.kathrein-category-card:hover .kathrein-category-card-image img {
    transform: scale(1.05);
}

/* Unterer Inhaltsbereich */
.kathrein-category-card-content {
    position: relative;
    padding: 72px 26px 0px 26px;
    background: #ffffff;
}

/* Icon-Kreis halb über Bild / Textbereich */
.kathrein-category-card-icon {
    position: absolute;
    top: -48px;
    left: 26px;
    width: 96px;
    height: 96px;
    border-radius: 50%;
    background: #f1f2f3;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 8px 22px rgba(0,0,0,0.12);
    z-index: 2;
}

/* Icon */
.kathrein-category-card-icon img {
    width: 72px;
    height: 72px;
    object-fit: contain;
    display: block;
}

/* Überschrift */
.kathrein-category-card-text h3 {
    margin: 0 0 14px 0;
    font-size: 24px;
    line-height: 1.25;
    font-weight: 700;
    color: #2f3b46;
}

/* Beschreibung */
.kathrein-category-card-text p {
    margin: 0 0 12px 0;
    font-size: 15px;
    line-height: 1.55;
    color: #393939;
}

/* Pfeil nach Button-Text */
.kathrein-category-card-button::after {
    content: "→";
    margin-left: 10px;
    font-size: 18px;
    line-height: 1;
}

/* Button Hover */
.kathrein-category-card-button:hover {
    background: #ff0000;
    color: #ffffff !important;
}

/* WPBakery Button innerhalb der Kategorie-Kachel */
.kathrein-category-card .kathrein-category-card-wpb-button {
    margin: 0 !important;
    padding: 0 26px 0px 26px;
}

/* Falls der Button selbst einen WPBakery-Abstand mitbringt */
.kathrein-category-card .kathrein-category-card-wpb-button .vc_btn3-container {
    margin: 0 !important;
}

/* Falls dein gespeicherter Button zusätzlich von TheGem/WPBakery umschlossen wird */
.kathrein-category-card .kathrein-category-card-wpb-button .wpb_wrapper {
    margin: 0 !important;
}

/* Responsive */
@media (max-width: 991px) {
    .kathrein-category-card-image img {
        height: 220px !important;
    }

    .kathrein-category-card-content {
        padding: 70px 22px 12px 22px;
    }

    .kathrein-category-card-icon {
        left: 22px;
    }

    .kathrein-category-card .kathrein-category-card-wpb-button {
        padding: 0 22px 22px 22px;
    }
}

@media (max-width: 600px) {
    .kathrein-category-card-image img {
        height: 200px !important;
    }

    .kathrein-category-card-text h3 {
        font-size: 22px;
    }

    .kathrein-category-card-text p {
        font-size: 15px;
    }
}

/* =========================================
   Kathrein Radio Feature Icons
   ========================================= */

.kathrein-radio-icons {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 20px;
  flex-wrap: wrap;
  margin: 0 auto 35px auto;
  padding: 0;
  text-align: center;
}

.kathrein-radio-icons img {
  display: block;
  width: 130px;
  height: 65px;
  object-fit: contain;
  flex: 0 0 auto;
}

@media (max-width: 768px) {
  .kathrein-radio-icons {
    gap: 15px;
    margin-bottom: 25px;
  }

  .kathrein-radio-icons img {
    width: 100px;
    height: 50px;
  }
}

/* =========================================
   eMobility Header Text
========================================= */

#page-title .emobility-header-text h1 {
  margin-bottom: 28px !important;
  line-height: 1.12 !important;
}

#page-title .emobility-header-text p {
  font-size: 26px !important;
  line-height: 1.35 !important;
  margin: 0 !important;
}

/* Desktop: Umbruch erzwingen */
#page-title .emobility-header-text .desktop-linebreak {
  display: block !important;
}

/* Tablet/Mobil: Umbruch aufheben */
@media (max-width: 767px) {
  #page-title .emobility-header-text .desktop-linebreak {
    display: inline !important;
  }

  #page-title .emobility-header-text p {
    font-size: 20px !important;
    line-height: 1.4 !important;
  }
}

/* =========================================
   Kathrein App Feature Icons
========================================= */

.kathrein-app-feature-icons {
  display: flex;
  justify-content: center;
  align-items: stretch;
  gap: 25px;
  max-width: 1320px;
  margin: 45px auto 55px;
  text-align: center;
  flex-wrap: nowrap;
}

/* Ab 7 Kacheln: automatisch umbrechen, z. B. 9 = 5 oben / 4 unten mittig */
.kathrein-app-feature-icons:has(> .kathrein-app-feature-icon:nth-child(7)) {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: stretch;
  gap: 25px;
  max-width: 1050px;
}

.kathrein-app-feature-icon {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  width: 190px;
  flex: 0 0 190px;
  min-width: 0;

  border: 1px solid #e0e0e0;
  border-radius: 16px;
  padding: 22px 14px 20px;
  background: #fff;
  box-sizing: border-box;

  transition: border-color 0.25s ease, box-shadow 0.25s ease, transform 0.25s ease;
}

.kathrein-app-feature-icon:hover {
  border-color: #cfcfcf;
  box-shadow: 0 8px 22px rgba(0,0,0,0.08);
  transform: translateY(-2px);
}

.kathrein-app-feature-icon img {
  width: 90px;
  height: 90px;
  object-fit: contain;
  margin-bottom: 14px;
}

.kathrein-app-feature-icon span {
  display: block;
  max-width: 180px;
  min-height: 42px;
  font-size: 13px;
  line-height: 1.35;
  color: #2f3a44;
}

/* Tablet */
@media (max-width: 1024px) {
  .kathrein-app-feature-icons {
    flex-wrap: wrap;
    justify-content: center;
    max-width: 720px;
    gap: 28px;
  }

  .kathrein-app-feature-icon {
    width: 200px;
    flex: 0 0 200px;
  }

  /* Ab 7 Kacheln: 3 pro Zeile, Rest mittig */
  .kathrein-app-feature-icons:has(> .kathrein-app-feature-icon:nth-child(7)) {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    max-width: 656px;
    gap: 28px;
  }
}

/* Mobil: 2 Spalten */
@media (max-width: 767px) {
  .kathrein-app-feature-icons,
  .kathrein-app-feature-icons:has(> .kathrein-app-feature-icon:nth-child(7)) {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    max-width: 420px;
    gap: 22px 18px;
    margin: 35px auto 45px;
  }

  .kathrein-app-feature-icon {
    width: auto;
    flex: none;
    padding: 18px 12px 16px;
    border-radius: 14px;
  }

  .kathrein-app-feature-icon img {
    width: 58px;
    height: 58px;
    margin-bottom: 12px;
  }

  .kathrein-app-feature-icon span {
    font-size: 14px;
    line-height: 1.35;
  }
}

/* Sehr kleine Smartphones: 1 Spalte */
@media (max-width: 420px) {
  .kathrein-app-feature-icons,
  .kathrein-app-feature-icons:has(> .kathrein-app-feature-icon:nth-child(7)) {
    grid-template-columns: 1fr;
    max-width: 280px;
  }
}

/* =========================================
   KATHREIN easyInstall / easyOperate Step Tabs
========================================= */

.kds-easyinstall-steps {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 50px;
  align-items: flex-start;
  margin: 35px 0 65px;
}

.kds-easyinstall-steps-left {
  width: 100%;
  min-width: 0;
}

.kds-easyinstall-intro {
  margin: 0 0 34px;
  padding-left: 22px;
  list-style: none;
}

.kds-easyinstall-intro li {
  position: relative;
  margin-bottom: 7px;
  color: #555;
  font-size: 17px;
  line-height: 1.4;
}

.kds-easyinstall-intro li::before {
  content: "";
  position: absolute;
  left: -18px;
  top: 0.7em;
  width: 6px;
  height: 6px;
  background: #e30613;
  transform: translateY(-50%);
}

/* Einzelner Schritt */
.kds-easyinstall-step {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 17px 0;
  border-top: 1px solid #d8dce0;
  background: transparent;
  color: #2f3a44;
  text-align: left;
  cursor: pointer;
  transition: color 0.2s ease;
  user-select: none;
}

/* Aktiver Schritt */
.kds-easyinstall-step.is-active {
  align-items: flex-start;
  color: #e30613;
}

.kds-easyinstall-step:last-child {
  border-bottom: 1px solid #d8dce0;
}

.kds-easyinstall-step:hover {
  color: #e30613;
}

/* Plus-/Minus-Icon */
.kds-step-icon {
  width: 30px;
  height: 30px;
  flex: 0 0 30px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #2f3a44;
  border-radius: 4px;
  margin-top: 0;
  position: relative;
  pointer-events: none;
}

.kds-step-icon::before,
.kds-step-icon::after {
  content: "";
  position: absolute;
  background: #fff;
  border-radius: 2px;
}

.kds-step-icon::before {
  width: 15px;
  height: 4px;
}

.kds-step-icon::after {
  width: 4px;
  height: 15px;
}

/* Aktives Icon */
.kds-easyinstall-step.is-active .kds-step-icon {
  background: #e30613;
  margin-top: 1px;
}

/* Beim aktiven Punkt aus Plus ein Minus machen */
.kds-easyinstall-step.is-active .kds-step-icon::after {
  display: none;
}

/* Textbereich */
.kds-step-text {
  display: block;
  min-width: 0;
  pointer-events: none;
}

.kds-step-text strong {
  display: block;
  font-size: 17px;
  line-height: 1.35;
  font-weight: 700;
  color: inherit;
}

.kds-step-text small {
  display: none;
  margin-top: 10px;
  font-size: 15px;
  line-height: 1.45;
  color: #222;
  font-weight: 400;
}

/* Untertext nur beim aktiven Schritt anzeigen */
.kds-easyinstall-step.is-active .kds-step-text small {
  display: block;
}

/* Bullet-Liste standardmäßig ausblenden */
.kds-step-bullets {
  display: none;
  margin: 10px 0 0;
  padding-left: 16px;
  list-style: none;
}

/* Bullet-Liste nur beim aktiven Tab anzeigen */
.kds-easyinstall-step.is-active .kds-step-bullets {
  display: block;
}

.kds-step-bullets li {
  position: relative;
  margin-bottom: 5px;
  font-size: 13px;
  line-height: 1.35;
  color: #2f3a44;
  font-weight: 400;
}

/* Nur das Quadrat ist rot */
.kds-step-bullets li::before {
  content: "";
  position: absolute;
  left: -13px;
  top: 8px;
  width: 5px;
  height: 5px;
  background: #e30613;
}

/* Sicherstellen, dass aktive Tabs nicht die Bullet-Texte rot färben */
.kds-easyinstall-step.is-active .kds-step-bullets li {
  color: #2f3a44;
}

/* Bildbereich rechts */
.kds-easyinstall-steps-right {
  width: 100%;
  min-width: 0;
  display: flex;
  justify-content: center;
  align-items: flex-start;
  position: sticky;
  top: 120px;
}

.kds-easyinstall-step-image {
  display: block;
  width: 100%;
  max-width: none;
  height: auto;
  object-fit: contain;
  transition: opacity 0.22s ease;
}

/* Tablet */
@media (max-width: 1024px) {
  .kds-easyinstall-steps {
    grid-template-columns: 1fr;
    gap: 40px;
  }

  .kds-easyinstall-steps-right {
    position: static;
  }

  .kds-easyinstall-step-image {
    max-width: 720px;
  }
}

/* Mobil */
@media (max-width: 767px) {
  .kds-easyinstall-steps {
    margin: 30px 0 50px;
    gap: 32px;
  }

  .kds-easyinstall-intro li {
    font-size: 16px;
  }

  .kds-easyinstall-step {
    padding: 15px 0;
  }

  .kds-step-text strong {
    font-size: 16px;
  }

  .kds-step-text small {
    font-size: 14px;
  }

  .kds-step-icon {
    width: 28px;
    height: 28px;
    flex-basis: 28px;
  }

  .kds-step-bullets li {
    font-size: 13px;
  }

  .kds-easyinstall-step-image {
    max-width: 100%;
  }
}