/**
 * Hauptstil für die Fraktionsverwaltung
 */

/* Basis-Stile */
body {
    background-color: #121212;
    color: #e0e0e0;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

/* Karten-Styling */
.card {
    background-color: #1e1e1e;
    border-color: #333;
    margin-bottom: 20px;
}

.card-header {
    background-color: #252525;
    border-bottom-color: #333;
}

/* Formular-Elemente */
.form-control, .form-select {
    background-color: #2a2a2a;
    border-color: #444;
    color: #e0e0e0;
}

.form-control:focus, .form-select:focus {
    background-color: #333;
    border-color: #007bff;
    color: #fff;
    box-shadow: 0 0 0 0.25rem rgba(0, 123, 255, 0.25);
}

/* Platzhaltertext für Eingabefelder */
::placeholder {
    color: #888;
    opacity: 1;
}

/* Tabellenstyling */
.table {
    color: #e0e0e0;
}

.table-dark {
    background-color: #1e1e1e;
}

.table-dark thead th {
    background-color: #252525;
    border-bottom-color: #444;
}

.table-dark.table-hover tbody tr:hover {
    background-color: rgba(255, 255, 255, 0.075);
}

/* Buttons */
.btn-primary {
    background-color: #0d6efd;
    border-color: #0d6efd;
}

.btn-primary:hover {
    background-color: #0b5ed7;
    border-color: #0a58ca;
}

.btn-danger {
    background-color: #dc3545;
    border-color: #dc3545;
}

.btn-danger:hover {
    background-color: #bb2d3b;
    border-color: #b02a37;
}

.btn-success {
    background-color: #198754;
    border-color: #198754;
}

.btn-success:hover {
    background-color: #157347;
    border-color: #146c43;
}

.btn-outline-primary {
    color: #0d6efd;
    border-color: #0d6efd;
}

.btn-outline-primary:hover {
    background-color: #0d6efd;
    color: #fff;
}

.btn-outline-danger {
    color: #dc3545;
    border-color: #dc3545;
}

.btn-outline-danger:hover {
    background-color: #dc3545;
    color: #fff;
}

.btn-outline-success {
    color: #198754;
    border-color: #198754;
}

.btn-outline-success:hover {
    background-color: #198754;
    color: #fff;
}

/* Select2 Dropdown-Anpassung */
.select2-container--bootstrap-5 .select2-selection {
    background-color: #2a2a2a !important;
    border-color: #444 !important;
    color: #e0e0e0 !important;
}

.select2-container--bootstrap-5 .select2-selection--single .select2-selection__rendered {
    color: #e0e0e0 !important;
}

.select2-container--bootstrap-5 .select2-dropdown {
    background-color: #2a2a2a !important;
    border-color: #444 !important;
}

.select2-container--bootstrap-5 .select2-results__option {
    color: #e0e0e0 !important;
}

.select2-container--bootstrap-5 .select2-results__option--highlighted[aria-selected] {
    background-color: #0d6efd !important;
    color: #fff !important;
}

/* Accordion-Anpassung */
.accordion-item {
    background-color: #1e1e1e;
    border-color: #333;
}

.accordion-button {
    background-color: #252525;
    color: #e0e0e0;
}

.accordion-button:not(.collapsed) {
    background-color: #0d6efd;
    color: #fff;
}

.accordion-button:focus {
    box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
}

.accordion-button::after {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
}

/* Produktionsrouten-Styling */
.route-item, .route-component, .route-subcomponent {
    background-color: #252525;
    border: 1px solid;
}

.route-item.border-primary {
    border-color: #0d6efd !important;
}

.route-component.border-success {
    border-color: #198754 !important;
}

.route-component.border-danger {
    border-color: #dc3545 !important;
}

.route-subcomponent.border-success {
    border-color: #198754 !important;
    background-color: rgba(25, 135, 84, 0.1);
}

.route-subcomponent.border-danger {
    border-color: #dc3545 !important;
    background-color: rgba(220, 53, 69, 0.1);
}

/* Modal-Anpassung */
.modal-content {
    background-color: #252525;
    color: #e0e0e0;
}

.modal-header {
    border-bottom-color: #333;
}

.modal-footer {
    border-top-color: #333;
}

/* Weitere Styling-Anpassungen */
.text-muted {
    color: #a0a0a0 !important;
}

.text-white-50 {
    color: rgba(255, 255, 255, 0.5) !important;
}

/* Responsive Design */
@media (max-width: 768px) {
    .container {
        padding-left: 15px;
        padding-right: 15px;
    }
    
    .btn-group {
        display: flex;
        flex-direction: column;
    }
    
    .btn-group .btn {
        margin-bottom: 5px;
    }
}