.MainImage-container img {
    width: auto; /* Erlaubt dem Bild, proportional zu skalieren */
    height: auto; /* Erlaubt dem Bild, proportional zu skalieren */
    max-width: 100%; /* Verhindert, dass das Bild horizontal ausbricht */
    max-height: 500px; /* Begrenzt die Bildhöhe auf exakt maximal 500px */
    object-fit: contain; /* Garantiert die Beibehaltung des Seitenverhältnisses */
    display: block;
}

@import url('./icons.css');

html, body {
    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
    margin: 0;
}

.w-100 {
    width: 100% !important;
}

.h-100 {
    height: 100% !important;
}

.h-auto {
    height: auto !important;
}

.overflow-hidden {
    overflow: hidden !important;
}

.text-danger {
    color: var(--dxds-color-content-danger-default-rest);
}


.main-content-pad0 {
    display: flex;
    flex-direction: column; /* Zwingt h1 und Splitter untereinander */
    align-items: center; /* Zentriert standardmäßig die h1 */
    height: 100%;
    width: 100%;
    padding: 0px;
}

.full-width-box {
    width: 100%; /* Volle Breite */
    text-align: center; /* Text horizontal zentrieren */
    padding: 0; /* Oben/unten Abstand, links/rechts 0 */
    font-weight: bold;
    /*background-color: #fff3e0;
    border: 1px solid #ff9800;
    box-sizing: border-box;*/ /* WICHTIG: Rahmen wird in die 100% eingerechnet */
}

.full-width-box-MitBackGrau {
    width: 100%; /* Volle Breite */
    text-align: center; /* Text horizontal zentrieren */
    padding: 0;
    margin-top: 5px;
    font-weight: bold;
    font-size: larger;
    background-color: #EFEFEF;
    border: 1px solid #000000;
    box-sizing: border-box;
    */ /* WICHTIG: Rahmen wird in die 100% eingerechnet */
}

.full-width-box-NotBold {
    width: 100%; /* Volle Breite */
    text-align: center; /* Text horizontal zentrieren */
    padding: 0;
    margin-top: 2px;
    background-color: #fff3e0;
    border: 1px solid #ff9800;
    box-sizing: border-box;
    */ /* WICHTIG: Rahmen wird in die 100% eingerechnet */
}


.center-container {
    display: flex; /* Aktiviert Flexbox */
    justify-content: center; /* Zentriert horizontal */
    align-items: center; /* Zentriert vertikal */

    height: 100vh; /* Nutzt 100% der Browser-Fensterhöhe */
    width: 100%; /* Nutzt die volle Breite */

    position: fixed; /* Optional: Bleibt fixiert, auch beim Scrollen */
    top: 0;
    left: 0;
    z-index: 9999; /* Sorgt dafür, dass es über anderem Content liegt */
    background-color: rgba(255, 255, 255, 0.8); /* Optionaler Overlay-Effekt */
}

.text-weiss {
    color: white;
}

.message-with-linebreaks {
    white-space: pre-wrap;
}

.CenterHorVer {
    display: flex;
    justify-content: center; /* Horizontal */
    align-items: center; /* Vertikal */
    height: 100vh; /* 100% der Viewport-Höhe */
    width: 100%;
}

.title {
    /*padding-bottom: 3rem;*/
    text-align: center;
}
.bold{
    font-weight: bold;
}








/* Erzwingt, dass die Tab-Leiste die volle Breite kriegt und links startet */
::deep .force-left-tabs,
::deep .force-left-tabs .dxbl-tabs {
    width: 100% !important;
    display: flex !important;
    justify-content: flex-start !important;
}

    /* Spricht die direkte Liste (ul/nav) der Reiter an */
    ::deep .force-left-tabs .nav-tabs,
    ::deep .force-left-tabs ul {
        width: 100% !important;
        display: flex !important;
        justify-content: flex-start !important;
        margin-left: 0 !important;
        padding-left: 0 !important;
    }

    /* Verhindert das Rutschen der Reiter-Schaltflächen */
    ::deep .force-left-tabs .nav-item,
    ::deep .force-left-tabs .dxbl-tabs-item {
        flex: 0 0 auto !important; /* Blockiert jegliches dynamische Verschieben */
        width: auto !important; /* Nur so breit wie das Icon und der Text */
    }

/* Äußerer Wrapper-Schutz, falls das Layout kollabiert */
.main-tab-wrapper {
    width: 100% !important;
    display: block !important;
    clear: both !important;
}