/*
 * Kompatibilitätsschicht: Bootstrap-3-Klassen, die in den rund 780 Templates
 * noch verwendet werden, auf Bootstrap-5-Optik abbilden. Neue Templates sollen
 * direkt Bootstrap-5-Klassen nutzen; diese Datei kann schrumpfen, sobald die
 * alten Klassen aus den Templates entfernt sind.
 */

/* Panels -> Cards */
.panel {
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    background: #fff;
    border: 1px solid rgba(0, 0, 0, 0.125);
    border-radius: 0.375rem;
    margin-bottom: 1.25rem;
}

.panel-heading {
    padding: 0.6rem 1rem;
    background: rgba(0, 0, 0, 0.03);
    border-bottom: 1px solid rgba(0, 0, 0, 0.125);
    border-radius: 0.375rem 0.375rem 0 0;
    font-weight: 600;
}

.panel-heading .panel-title,
.panel-title {
    font-size: 1rem;
    margin: 0;
    font-weight: 600;
}

.panel-body {
    padding: 1rem;
    flex: 1 1 auto;
}

.panel-footer {
    padding: 0.6rem 1rem;
    background: rgba(0, 0, 0, 0.03);
    border-top: 1px solid rgba(0, 0, 0, 0.125);
}

.panel-primary > .panel-heading { background: #003064; color: #fff; border-color: #003064; }
.panel-success > .panel-heading { background: #d1e7dd; color: #0f5132; }
.panel-info > .panel-heading { background: #cff4fc; color: #055160; }
.panel-warning > .panel-heading { background: #fff3cd; color: #664d03; }
.panel-danger > .panel-heading { background: #f8d7da; color: #842029; }

.panel-actions {
    float: right;
    margin: 0;
    padding: 0;
    list-style: none;
}

.panel-actions li {
    display: inline-block;
    margin-left: 0.5rem;
}

.panel-actions a {
    color: #999;
}

.panel-group .panel { margin-bottom: 0.5rem; }

/* Buttons */
.btn-default {
    --bs-btn-color: #333;
    --bs-btn-bg: #fff;
    --bs-btn-border-color: #ccc;
    --bs-btn-hover-color: #333;
    --bs-btn-hover-bg: #e6e6e6;
    --bs-btn-hover-border-color: #adadad;
    --bs-btn-active-bg: #e6e6e6;
    --bs-btn-active-border-color: #adadad;
}

.btn-xs {
    --bs-btn-padding-y: 0.1rem;
    --bs-btn-padding-x: 0.4rem;
    --bs-btn-font-size: 0.75rem;
}

.btn-group-xs > .btn { padding: 0.1rem 0.4rem; font-size: 0.75rem; }

/* Sichtbarkeits-Helfer */
@media (max-width: 767.98px) {
    .hidden-xs { display: none !important; }
}
@media (min-width: 768px) {
    .visible-xs { display: none !important; }
}
@media (min-width: 768px) and (max-width: 991.98px) {
    .hidden-sm { display: none !important; }
}
@media (min-width: 992px) and (max-width: 1199.98px) {
    .hidden-md { display: none !important; }
}
@media (min-width: 1200px) {
    .hidden-lg { display: none !important; }
}
@media print {
    .hidden-print { display: none !important; }
}
.hidden { display: none !important; }
.show-inline { display: inline !important; }

/* Floats und Text */
.pull-right { float: right !important; }
.pull-left { float: left !important; }
.center-block { display: block; margin-left: auto; margin-right: auto; }
.text-right { text-align: right !important; }
.text-left { text-align: left !important; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); border: 0; }

/* Labels -> Badges */
.label {
    display: inline-block;
    padding: 0.2em 0.6em 0.3em;
    font-size: 75%;
    font-weight: 700;
    line-height: 1;
    color: #fff;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    border-radius: 0.25em;
    background: #777;
}
.label-default { background: #777; }
.label-primary { background: #003064; }
.label-success { background: #198754; }
.label-info { background: #0dcaf0; color: #000; }
.label-warning { background: #ffc107; color: #000; }
.label-danger { background: #dc3545; }
.badge-default { background: #777; }
.badge:empty { display: none; }

/* Wells, Thumbnails, Jumbotron */
.well {
    min-height: 20px;
    padding: 1rem;
    margin-bottom: 1.25rem;
    background: #f5f5f5;
    border: 1px solid #e3e3e3;
    border-radius: 0.375rem;
}
.well-sm { padding: 0.5rem; }
.jumbotron { padding: 2rem 1rem; background: #e9ecef; border-radius: 0.375rem; margin-bottom: 1.5rem; }
.img-responsive { max-width: 100%; height: auto; display: block; }
.img-rounded { border-radius: 0.375rem; }
.img-circle { border-radius: 50%; }
.thumbnail { display: block; padding: 4px; background: #fff; border: 1px solid #ddd; border-radius: 0.375rem; }

/* Formulare (Bootstrap-3-Markup) */
.form-group { margin-bottom: 1rem; }
.form-horizontal .form-group::after { content: ""; display: table; clear: both; }
.control-label { font-weight: 600; margin-bottom: 0.3rem; display: inline-block; }
.form-horizontal .control-label { text-align: right; padding-top: 0.4rem; }
.help-block { display: block; margin-top: 0.25rem; color: #6c757d; font-size: 0.85rem; }
.has-error .form-control { border-color: #dc3545; }
.has-error .control-label, .has-error .help-block { color: #dc3545; }
.has-success .form-control { border-color: #198754; }
.checkbox, .radio { position: relative; display: block; margin-top: 0.5rem; margin-bottom: 0.5rem; }
.checkbox label, .radio label { padding-left: 1.4rem; font-weight: 400; cursor: pointer; }
.checkbox input[type="checkbox"], .radio input[type="radio"] { position: absolute; margin-left: -1.4rem; margin-top: 0.3rem; }
.checkbox-inline, .radio-inline { display: inline-block; margin-right: 1rem; }
.input-group-addon, .input-group-btn {
    display: flex;
    align-items: center;
    padding: 0.375rem 0.75rem;
    background: #e9ecef;
    border: 1px solid #ced4da;
    border-radius: 0.375rem;
}
.input-group > .input-group-addon:first-child { border-right: 0; border-radius: 0.375rem 0 0 0.375rem; }
.input-group > .input-group-addon:last-child { border-left: 0; border-radius: 0 0.375rem 0.375rem 0; }
.input-group-btn { padding: 0; border: 0; background: none; }
.input-group-btn > .btn { border-radius: 0 0.375rem 0.375rem 0; }
select.form-control { appearance: auto; }
.input-sm { min-height: calc(1.5em + 0.5rem + 2px); padding: 0.25rem 0.5rem; font-size: 0.875rem; }
.input-lg { min-height: calc(1.5em + 1rem + 2px); padding: 0.5rem 1rem; font-size: 1.25rem; }

/* Tabellen */
.table-condensed > thead > tr > th,
.table-condensed > tbody > tr > td { padding: 0.25rem; }
.table > thead > tr > th { vertical-align: bottom; }

/* Listen */
.list-inline > li { display: inline-block; padding-right: 5px; padding-left: 5px; }
.nav-stacked > li { float: none; }
.nav-stacked > li + li { margin-top: 2px; margin-left: 0; }
.nav-pills > li > a, .nav-tabs > li > a { display: block; padding: 0.5rem 1rem; }

/* Dropdowns mit li > a (Bootstrap 3) */
.dropdown-menu > li > a {
    display: block;
    width: 100%;
    padding: 0.25rem 1rem;
    clear: both;
    color: #212529;
    text-decoration: none;
    white-space: nowrap;
    background: transparent;
    border: 0;
}
.dropdown-menu > li > a:hover { background: #f8f9fa; }
.dropdown-menu > .divider { height: 0; margin: 0.5rem 0; overflow: hidden; border-top: 1px solid #dee2e6; }
.dropdown-menu > li { list-style: none; }
.caret {
    display: inline-block;
    width: 0;
    height: 0;
    margin-left: 2px;
    vertical-align: middle;
    border-top: 4px dashed;
    border-right: 4px solid transparent;
    border-left: 4px solid transparent;
}

/* Modals mit Bootstrap-3-Schließen-Button */
.modal-header .close {
    order: 2;
    margin-left: auto;
    padding: 0;
    background: transparent;
    border: 0;
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 1;
    color: #000;
    opacity: 0.5;
}
.modal-header .close:hover { opacity: 0.8; }
.modal-header { flex-wrap: wrap; }
.close { float: right; font-size: 1.5rem; font-weight: 700; line-height: 1; color: #000; opacity: 0.5; background: none; border: 0; }

/* Alerts / Progress */
.alert-dismissable .close { position: relative; top: -2px; right: -21px; }
.progress-bar-success { background-color: #198754; }
.progress-bar-info { background-color: #0dcaf0; }
.progress-bar-warning { background-color: #ffc107; }
.progress-bar-danger { background-color: #dc3545; }

/* Raster: col-xs entspricht col, Offsets */
.col-xs-1 { flex: 0 0 auto; width: 8.3333%; }
.col-xs-2 { flex: 0 0 auto; width: 16.6667%; }
.col-xs-3 { flex: 0 0 auto; width: 25%; }
.col-xs-4 { flex: 0 0 auto; width: 33.3333%; }
.col-xs-5 { flex: 0 0 auto; width: 41.6667%; }
.col-xs-6 { flex: 0 0 auto; width: 50%; }
.col-xs-7 { flex: 0 0 auto; width: 58.3333%; }
.col-xs-8 { flex: 0 0 auto; width: 66.6667%; }
.col-xs-9 { flex: 0 0 auto; width: 75%; }
.col-xs-10 { flex: 0 0 auto; width: 83.3333%; }
.col-xs-11 { flex: 0 0 auto; width: 91.6667%; }
.col-xs-12 { flex: 0 0 auto; width: 100%; }
[class*="col-"] { position: relative; min-height: 1px; padding-right: calc(var(--bs-gutter-x, 1.5rem) * 0.5); padding-left: calc(var(--bs-gutter-x, 1.5rem) * 0.5); }
@media (min-width: 768px) {
    .col-sm-offset-1 { margin-left: 8.3333%; } .col-sm-offset-2 { margin-left: 16.6667%; } .col-sm-offset-3 { margin-left: 25%; } .col-sm-offset-4 { margin-left: 33.3333%; } .col-sm-offset-6 { margin-left: 50%; }
}
@media (min-width: 992px) {
    .col-md-offset-1 { margin-left: 8.3333%; } .col-md-offset-2 { margin-left: 16.6667%; } .col-md-offset-3 { margin-left: 25%; } .col-md-offset-4 { margin-left: 33.3333%; } .col-md-offset-6 { margin-left: 50%; }
}
/* Spalten ohne umgebendes .row (in alten Templates häufig): als Block darstellen */
.container-fluid > [class*="col-"], .panel-body > [class*="col-"] { float: left; }
.row::after, .clearfix::after { content: ""; display: table; clear: both; }

/* Porto-Abstandsklassen */
.mb-xs { margin-bottom: 5px !important; } .mb-sm { margin-bottom: 10px !important; } .mb-md { margin-bottom: 15px !important; } .mb-lg { margin-bottom: 20px !important; } .mb-xl { margin-bottom: 30px !important; } .mb-none { margin-bottom: 0 !important; }
.mt-xs { margin-top: 5px !important; } .mt-sm { margin-top: 10px !important; } .mt-md { margin-top: 15px !important; } .mt-lg { margin-top: 20px !important; } .mt-xl { margin-top: 30px !important; } .mt-none { margin-top: 0 !important; }
.mr-xs { margin-right: 5px !important; } .mr-sm { margin-right: 10px !important; } .mr-md { margin-right: 15px !important; } .mr-lg { margin-right: 20px !important; }
.ml-xs { margin-left: 5px !important; } .ml-sm { margin-left: 10px !important; } .ml-md { margin-left: 15px !important; } .ml-lg { margin-left: 20px !important; }
.pb-xs { padding-bottom: 5px !important; } .pb-sm { padding-bottom: 10px !important; } .pb-md { padding-bottom: 15px !important; } .pb-lg { padding-bottom: 20px !important; }
.pt-xs { padding-top: 5px !important; } .pt-sm { padding-top: 10px !important; } .pt-md { padding-top: 15px !important; } .pt-lg { padding-top: 20px !important; }

/* Glyphicons (nur noch zwei Vorkommen) auf Font Awesome */
.glyphicon { font-family: "Font Awesome 6 Free"; font-weight: 900; font-style: normal; }
.glyphicon-remove::before { content: "\f00d"; }
.glyphicon-ok::before { content: "\f00c"; }
.glyphicon-plus::before { content: "\f067"; }
.glyphicon-minus::before { content: "\f068"; }
.glyphicon-pencil::before { content: "\f303"; }
.glyphicon-trash::before { content: "\f1f8"; }
