/* Grundlegendes Styling für den Karten-Container */
#mcmp-map,
#mcmp-map-preview {
    width: 100%;
    height: 400px;
}

/* Styling für die Angebotsliste */
#mcmp-list {
    margin-top: 20px;
}

/* Tabelle der Angebotsliste */
#mcmp-list table {
    width: 100%;
    border-collapse: collapse;
    font-family: Arial, sans-serif;
    font-size: 14px;
}

/* Tabellenkopf: Überschrift mit weißer Schrift auf Hintergrund #64B687 */
#mcmp-list table thead {
    background-color: #64B687;
    color: #ffffff;
}

/* Tabellenzellen (Kopf und Körper) */
#mcmp-list table th,
#mcmp-list table td {
    border: 1px solid #ccc;
    padding: 8px;
    text-align: left;
}

/* Abwechselnde Zeilen im Tabellenkörper */
#mcmp-list table tbody tr:nth-child(odd) {
    background-color: #FAFAFA;
}
#mcmp-list table tbody tr:nth-child(even) {
    background-color: #ffffff;
}

/* Container für Side-by-Side-Layout */
.mcmp-container.mcmp-beside {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
}
.mcmp-container.mcmp-beside #mcmp-map {
    flex: 1 1 60%;
}
.mcmp-container.mcmp-beside #mcmp-list {
    flex: 1 1 35%;
}

/* Optionale Rahmen für die Kartenstile */
.map-style-standard {
    border: 2px solid #ccc;
}
.map-style-dark {
    border: 2px solid #333;
    box-shadow: 0 0 10px rgba(0,0,0,0.5);
}
.map-style-silver {
    border: 2px solid #aaa;
}