/* Hier Ihren benutzerdefinierten CSS-Code einfügen */
/* AHG List */

table.ahg {
  width: 100%;
  border-collapse: collapse;
  background-color: #fff;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}

table.ahg th, table.ahg td {
  padding: 15px;
  text-align: left;
  border-bottom: 1px solid #ddd;
}

table.ahg th.sortable {
  cursor: pointer;
}

table.ahg th.sortable:hover {
  background-color: #f2f2f2;
}

.icon-container {
  display: flex;
  align-items: center;
}

.icon-container img {
  width: 30px;
  margin-right: 5px;
}

.icon-container img:last-child {
  margin-right: 0;
}

/* Additional Logos Detailpage */
.additional-logos {
display: flex;
flex-wrap: wrap;
justify-content: center; 
}

.logo-item {
margin: 10px;
}

.logo-item img {
max-height: 45px;
width: auto; /* Breite automatisch anpassen */
}

/* =======================================
   CSS für Leistungs-Icons
   - Enthält das Layout und Styling für
     die Icon-Text-Paare (z.B. PKW Parkplätze)
   - Flexibles Grid-Layout mit max. Breite von 180px pro Item
   - Zusätzliche Klassen für spezifische Anpassungen pro Icon-Gruppe
======================================= */

/* Allgemeiner Container für Icon-Text-Paare */
.icon-container {
    display: flex; /* Flexbox-Layout für horizontalen Fluss */
    flex-wrap: wrap; /* Wrap für Zeilenumbruch bei zu vielen Elementen */
    gap: 20px; /* Abstand zwischen den Icon-Items */
    justify-content: flex-start; /* Links ausgerichtet */
    width: 100%;
    margin: 0 auto; /* Zentriert den Container */
    padding: 20px; /* Innenabstand für den Container */
}

/* Einzelnes Icon-Text-Paar */
.icon-item {
    display: flex;
    flex-direction: column; /* Vertikale Anordnung */
    align-items: center; /* Horizontale Zentrierung */
    text-align: center;
    min-width: 180px; /* Minimale Breite für jedes Icon-Item */
    min-height: 175px; /* Minimale Höhe für alle Icon-Items */
    height: auto; /* Höhe anpassen, damit sie bei Bedarf größer werden können */
    padding: 10px; 
    background-color: #f8f8f8; 
    border-radius: 8px; 
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1); /* Schatten */
    margin: 0 10px 20px; /* Horizontaler Abstand zu den Nachbarn und vertikaler Abstand */
}

/* Styling für das Icon-Bild */
.icon-image img {
    width: 50px; /* Breite des Icons */
    height: 50px; /* Höhe des Icons */
    margin-bottom: 10px; /* Abstand unter dem Icon */
}

/* Textbereich */
.icon-text {
    font-size: 14px; /* Schriftgröße für den Text */
    line-height: 1.5; /* Zeilenhöhe */
}

/* Überschrift */
.icon-title {
    font-size: 16px; 
    font-weight: bold; 
    margin-bottom: 6px;
}	

/* Reduzierter Abstand zwischen Zusatzfeldern */
.icon-text p + p {
    margin-top: -12px; /* Abstand zwischen den Absätzen (Zusatzfelder) */
}

/* Responsive Anpassungen für kleinere Bildschirme */
@media screen and (max-width: 768px) {
    .icon-container {
        flex-wrap: wrap; /* Wrap für mobile Ansicht */
        gap: 15px; /* Abstand für mobile Ansicht */
    }

    .icon-item {
        min-width: 150px; /* Minimale Breite für mobile Ansicht */
    }
}

/* Anpassungen für spezifische Container */
/* Hier können später gezielt Anpassungen vorgenommen werden */
.parken-pkw-container {
    background-color: #e0f7fa; /* Beispiel: andere Hintergrundfarbe */
}
