/* HVKG Mitgliederverwaltung */

/* ---- HvKG Farbpalette ---- */
:root,
[data-bs-theme="dark"] {
    --hvkg-petrol:  #325767;  /* hsl(199,35%,30%) — Primärfarbe */
    --hvkg-gruen:   #326748;  /* hsl(145,35%,30%) */
    --hvkg-amber:   #6B4D2E;  /* hsl(30,40%,30%) */
    --hvkg-rose:    #723741;  /* hsl(350,35%,33%) */
    --hvkg-violett: #543B6D;  /* hsl(270,30%,33%) */

    /* Bootstrap primary → HvKG Petrol */
    --bs-primary:     #325767;
    --bs-primary-rgb: 50, 87, 103;
    --bs-link-color:  #5a99b3;
    --bs-link-hover-color: #7ab3c9;
}

/* Buttons: primary */
.btn-primary {
    --bs-btn-bg: #325767;
    --bs-btn-border-color: #325767;
    --bs-btn-hover-bg: #3d6a7e;
    --bs-btn-hover-border-color: #3d6a7e;
    --bs-btn-active-bg: #2a4856;
    --bs-btn-active-border-color: #2a4856;
    --bs-btn-disabled-bg: #325767;
    --bs-btn-disabled-border-color: #325767;
}

.btn-outline-primary {
    --bs-btn-color: #5a99b3;
    --bs-btn-border-color: #325767;
    --bs-btn-hover-bg: #325767;
    --bs-btn-hover-border-color: #325767;
    --bs-btn-hover-color: #fff;
    --bs-btn-active-bg: #2a4856;
    --bs-btn-active-border-color: #2a4856;
}

/* Nav-Pills: aktiver Tab in HvKG-Petrol (Bootstrap-Default wäre grelles Blau) */
.nav-pills {
    --bs-nav-pills-link-active-bg: var(--hvkg-petrol);
}

/* Badges → HvKG-Palette */
.badge.bg-primary   { background-color: var(--hvkg-petrol)  !important; }
.badge.bg-success   { background-color: var(--hvkg-gruen)   !important; }
.badge.bg-warning   { background-color: var(--hvkg-amber)   !important; color: #fff !important; }
.badge.bg-danger    { background-color: var(--hvkg-rose)    !important; }
.badge.bg-info      { background-color: var(--hvkg-violett) !important; color: #fff !important; }

/* Focus-Ring */
.btn-primary:focus-visible,
.btn-outline-primary:focus-visible,
.form-control:focus {
    box-shadow: 0 0 0 0.25rem rgba(50, 87, 103, 0.4);
    border-color: #325767;
}

/* Sidebar: aktiver Link mit Petrol-Akzent */
.sidebar-nav .nav-link.active {
    background: rgba(50, 87, 103, 0.35);
    font-weight: 600;
    border-left: 3px solid #325767;
}

body {
    font-size: 0.9rem;
}

/* ---- Header ---- */

.site-header {
    background: var(--hvkg-petrol);
}

/* ---- Sidebar ---- */

.sidebar {
    width: 195px;
    background: var(--bs-body-bg);
    position: sticky;
    top: 0;
    height: 100vh;
    overflow-y: auto;
}

.sidebar-nav .nav-link {
    padding: 0.3rem 1rem;
    font-size: 0.85rem;
    color: var(--bs-body-color);
}

.sidebar-nav .nav-link:hover {
    background: rgba(50, 87, 103, 0.25);
}

.sidebar-nav .nav-link.disabled {
    opacity: 0.4;
}

.sidebar-nav .nav-link i {
    width: 1.4em;
    display: inline-block;
}

/* ---- Main Content ---- */

.main-content {
    overflow-x: auto;
}

/* ---- KPI-Karten (Dashboard) ---- */

.aufgaben-list { max-width: 66%; }
@media (max-width: 767.98px) { .aufgaben-list { max-width: 100%; } }
.kpi-row { display: flex; flex-wrap: wrap; gap: 0.5rem; justify-content: center; }
.kpi-card { color: #fff; min-width: 170px; flex: 0 0 170px; }
.kpi-card .card-body { display: flex; flex-direction: column; justify-content: center; padding: 0.6rem 0.8rem; }
.kpi-card .card-title { font-size: 0.75rem; margin-bottom: 0.2rem; white-space: nowrap; }
.kpi-card .kpi-value { font-size: 1.25rem; font-weight: 600; margin-bottom: 0; white-space: nowrap; }
.kpi-card small { font-size: 0.7rem; }
.kpi-mitglieder    { background: #325767; }  /* Petrol hsl(199,35%,30%) */
.kpi-kontostand    { background: #326748; }  /* Grün hsl(145,35%,30%) */
.kpi-spenden       { background: #6B4D2E; }  /* Amber hsl(30,40%,30%) */
.kpi-offene-posten { background: #723741; }  /* Rose hsl(350,35%,33%) */
.kpi-sollstellung  { background: #543B6D; }  /* Violett hsl(270,30%,33%) */

/* ---- Cards ---- */

.card .display-6 {
    font-size: 1.8rem;
}

/* ---- Tables ---- */

.table th {
    white-space: nowrap;
}

/* Darkmode: thead dezent aufgehellt statt Bootstrap table-light (weiß) */
.table thead th {
    background-color: rgba(255, 255, 255, 0.06);
    color: var(--bs-body-color);
    border-bottom-color: rgba(255, 255, 255, 0.12);
}

/* table-light im Darkmode neutralisieren */
.table-light,
.table-light th,
.table-light td {
    background-color: rgba(255, 255, 255, 0.06) !important;
    color: var(--bs-body-color) !important;
}

.table-sm th {
    width: 35%;
}

/* ---- Collapsible detail rows ---- */

.invoice-toggle {
    cursor: pointer;
}

.detail-row td {
    background: rgba(255, 255, 255, 0.02);
}

/* ---- List-Group (Entwurf-Auswahl) ---- */

.list-group-item {
    background-color: var(--bs-body-bg);
    color: var(--bs-body-color);
    border-color: rgba(255, 255, 255, 0.1);
}
.list-group-item:hover:not(.active) {
    background-color: rgba(255, 255, 255, 0.06);
}
.list-group-item.active {
    background-color: var(--hvkg-petrol);
    border-color: var(--hvkg-petrol);
}

/* ---- Footer ---- */

.site-footer {
    background: var(--bs-body-bg);
    font-size: 0.8rem;
}
