/*------------------------------------*\
  #BOOTSTRAP-4-KOMPATIBILITÄT
  Nur Grundschule und Kindergarten.
  Gleicht Bootstrap 5.3 an das bisherige Erscheinungsbild von Bootstrap 4.5 an,
  damit sich das Design durch das Update nicht ändert.
  Wird direkt nach Bootstrap und vor dem Design-CSS geladen.
\*------------------------------------*/

/* Farben, Radien, Links wie Bootstrap 4 */
:root {
    --bs-link-color: #007bff;
    --bs-link-color-rgb: 0, 123, 255;
    --bs-link-hover-color: #0056b3;
    --bs-link-hover-color-rgb: 0, 86, 179;
    --bs-link-decoration: none;
    --bs-border-radius: 4px;
    --bs-border-radius-sm: 3px;
    --bs-border-radius-lg: 5px;
}

a {
    text-decoration: none;
}

a:hover {
    text-decoration: underline;
}

/* Grid: Abstand 30px statt 24px, keine xxl-Containerbreite */
.container,
.container-fluid,
.container-sm,
.container-md,
.container-lg,
.container-xl,
.container-xxl,
.row {
    --bs-gutter-x: 30px;
}

.g-0,
.gx-0 {
    --bs-gutter-x: 0;
}

@media (min-width: 1400px) {
    .container,
    .container-sm,
    .container-md,
    .container-lg,
    .container-xl,
    .container-xxl {
        max-width: 1140px;
    }
}

/* Überschriften ohne responsive Skalierung (RFS) */
h1, .h1 { font-size: 40px; }
h2, .h2 { font-size: 32px; }
h3, .h3 { font-size: 28px; }
h4, .h4 { font-size: 24px; }
h5, .h5 { font-size: 20px; }
h6, .h6 { font-size: 16px; }

/* Reboot-Unterschiede */
label {
    margin-bottom: 8px;
}

ol,
ul {
    padding-left: 40px;
}

small,
.small {
    font-size: 80%;
}

hr {
    margin: 16px 0;
    color: gray;
    border: 0;
    border-top: 1px solid rgba(0, 0, 0, .1);
    opacity: 1;
}

/* In Bootstrap 5 entfernte Klassen */
.form-group {
    margin-bottom: 16px;
}

.media {
    display: flex;
    align-items: flex-start;
}

.media-body {
    flex: 1;
}

.text-left { text-align: left !important; }
.text-right { text-align: right !important; }
.text-justify { text-align: justify !important; }

/* Breadcrumb wie Bootstrap 4 */
.breadcrumb {
    padding: 12px 16px;
    margin-bottom: 16px;
    background-color: #e9ecef;
    border-radius: 4px;
}

.breadcrumb-item {
    display: flex;
}

.breadcrumb-item + .breadcrumb-item::before {
    float: none;
}