/* --- DEBUG: Finde falsche direkte Kinder in einer Row --- */
/*.row > div:not([class*="col-"]) {
    outline: 5px dashed red !important;
    background-color: rgba(255, 0, 0, 0.2) !important;
    position: relative;
}

.row > div:not([class*="col-"])::before {
    content: "FEHLER: div ohne col- Klasse in einer row!";
    position: absolute;
    top: 0;
    left: 0;
    background: red;
    color: white;
    font-weight: bold;
    padding: 5px;
    font-size: 12px;
    z-index: 9999;
}*/

/* Bootstrap defaults */
.table {
    --bs-table-bg: transparent;
}
.modal.modal-fullscreen {
    --bs-modal-width: auto;
}
.btn-secondary {
    --bs-btn-bg: #f0f0f0;
    --bs-btn-color: var(--lvt-darkgrey)
}

/* --- Bootstrap 5 Optik für bootstrap-select erzwingen --- */

/* Standard-Ansicht (wie form-select) */
.bootstrap-select > .dropdown-toggle.btn {
    background-color: #fff !important;
    border: 1px solid #ced4da !important;
    border-radius: 0.375rem !important;
    color: #212529 !important;
    font-weight: 400;
}

/* Hover-Status leicht abdunkeln */
.bootstrap-select > .dropdown-toggle.btn:hover {
    background-color: #f8f9fa !important;
}

/* Fokus-Status (der typische Bootstrap 5 blaue Rahmen) */
.bootstrap-select > .dropdown-toggle.btn:focus,
.bootstrap-select > .dropdown-toggle.btn:active,
.show > .bootstrap-select > .dropdown-toggle.btn {
    background-color: #fff !important;
    border-color: #86b7fe !important;
    box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25) !important;
    outline: 0 !important;
}

/* Dropdown-Menü */
.dropdown-menu {
    font-size: 14px;
}
.bootstrap-select .dropdown-menu {
    border-radius: 0.375rem;
    border: 1px solid rgba(0,0,0,.15);
}
.bootstrap-select>select {
    left: 0;
    bottom: 0;
}

/* --- 1. Den äußeren Wrapper unsichtbar machen --- */
div.bootstrap-select.form-select,
div.bootstrap-select.form-control {
    border: none !important;
    padding: 0 !important;
    background-image: none !important; /* Entfernt den äußeren BS5-Pfeil */
    box-shadow: none !important;
}

/* --- 2. Innerer Button (Das eigentliche, klickbare Dropdown) --- */
.bootstrap-select > .dropdown-toggle.btn {
    width: 100% !important;
    background-color: #f0f0f0 !important; /* Hier auf grau geändert */
    border: 1px solid #ced4da !important;
    border-radius: 0.375rem !important;
    color: #212529 !important;
    font-weight: 400;
    font-size: 14px;
    padding-left: 10px;

    /* Nativer Bootstrap 5 Pfeil als Hintergrundbild */
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e") !important;
    background-repeat: no-repeat !important;
    background-position: right 0.75rem center !important;
    background-size: 16px 12px !important;
    padding-right: 2.25rem !important;
}

/* --- 3. Alten Plugin-Pfeil verstecken --- */
.bootstrap-select > .dropdown-toggle.btn::after {
    display: none !important;
}

/* --- 4. Hover & Focus --- */
.bootstrap-select > .dropdown-toggle.btn:hover {
    background-color: #e2e2e2 !important; /* Beim Hover minimal dunkler machen für besseres Feedback */
}

/* Prüfen, ob für alle Dropdowns ok! */
.bootstrap-select:not([class*=col-]):not([class*=form-control]):not(.input-group-btn) {
    width: 100%;
}

.bootstrap-select > .dropdown-toggle.btn:focus,
.bootstrap-select > .dropdown-toggle.btn:active,
.show > .bootstrap-select > .dropdown-toggle.btn {
    background-color: #f0f0f0 !important; /* Auch beim Aufklappen grau lassen */
    border-color: #86b7fe !important;
    box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25) !important;
    outline: 0 !important;
}

/* Tabs */
.nav-link {
    color: var(--lvt-blue);
}
.nav-pills .nav-link.active,
.nav-pills .show>.nav-link {
    background-color: var(--lvt-blue);
}



/* Sonstiges */
.btn-link {
    text-decoration: none;
    color: var(--lvt-blue);
}
textarea.form-control {
    min-height: calc(4em + .75rem + calc(var(--bs-border-width) * 2));
    font-size: 14px;
}
input.form-control {
    font-size: 14px;
}
@media (min-width: 992px) {
    .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9 {
    float: left;
    }
}
@media (min-width: 576px) {
    .modal-large .modal-dialog {
        max-width: none;
    }
}
.modal-header {
    display: inline-block;
}
.input-group .bootstrap-select.form-control .dropdown-toggle {
    border: none !important;
    font-size: 12px;
    background-color: transparent !important;
    padding: 0px;
    padding-right: 0px;
}
.fc-datagrid-cell.fc-resource  {
    display: flex;
    border: 0;
    border-bottom: 1px solid #EFEFEF;
}
.fc-datagrid-cell.fc-resource  {
    display: flex;
    border: 0;
    border-bottom: 1px solid #EFEFEF;
}

/* Bootstrap 5 table reboot reset for FullCalendar */
.fc table thead,
.fc table tbody,
.fc table tfoot,
.fc table tr {
    border-style: none;
    border-width: 0;
    border-color: transparent;
}

.list-group-item {
    position: relative;
  display: block;
  padding: 10px 15px;
  border: 1px solid #ddd;
}
.modal-content {
    box-shadow: 0 5px 15px rgba(0,0,0,.5);
}

/* Portal */
.portalheader .sec-center {
    width: auto;
}
.portalheader .sec-center a {
    color: #fff !important;
}
.lvt-n  .bootstrap-select > .dropdown-toggle.btn {
    background-color: transparent !important;
    border: 0 !important;
    font-size: 12px;
    padding: 0;
    padding-right: 0px;
}
.pick-a-color-markup {
    border: 1px solid #ccc;
    border-radius: 5px;
    width: 150px;
    height: 36px;
    background-color: #FFF;
}
.pick-a-color-markup .pick-a-color {
    border: 0;
}
.pick-a-color-markup .hex-pound {
    line-height: 33px;
    color: #888;
}
.lvt-nb  .form-input-group {
    width: 100%;
}