/* ============================================================
   project.css – portalspezifische Styles

   Konvention (in allen Portalen gleicher Dateiname):
   - theme.css   = Basis/Framework + Palette   (in jedem Portal identisch)
   - project.css = NUR projektspezifisches Zeug (pro Portal unterschiedlich)
   Wird in layout.html.twig NACH theme.css geladen, darf also überschreiben.
   Weiterhin ausschließlich palette-basiert: var(--primary), var(--surface) …

   Portal: Naheblick – Beratung innovativer Wohnkonzepte
   Palette: primary #14436C (Blau), accent #709FAF (Mint), ink #24323D (Anthrazit)
   ============================================================ */

/* ── Pill-Buttons: aktiv = Primär-Button-Stil, inaktiv = Outline-Stil ───── */
.btn-check:checked + .btn-outline-primary,
.btn-group .btn-outline-primary.active {
    background-color: var(--lp-btn-bg, var(--lp-primary, #14436c)) !important;
    border-color:     var(--lp-btn-bg, var(--lp-primary, #14436c)) !important;
    color: var(--lp-btn-text, #fff) !important;
}
.btn-group .btn-outline-primary:not(.active) {
    background-color: transparent !important;
    border-color: var(--lp-btn-bg, var(--lp-primary, #14436c)) !important;
    color:        var(--lp-btn-bg, var(--lp-primary, #14436c)) !important;
}

/* ── Destruktive Aktionen bewusst funktional ROT halten ──────────────────
   Die Akzentfarbe (--accent) ist im Naheblick-Branding Mintgrün und wird
   für Badges/Hervorhebungen genutzt. „Löschen"-Aktionen sollen aber klar
   als Gefahr erkennbar bleiben, daher hier ein neutrales Rot statt --accent. */
:root { --lp-danger: #c0392b; --lp-danger-hover: #a93226; }
.btn-danger {
    background-color: var(--lp-danger) !important;
    border-color:     var(--lp-danger) !important;
    color: #fff !important;
}
.btn-danger:hover, .btn-danger:focus, .btn-danger:active {
    background-color: var(--lp-danger-hover) !important;
    border-color:     var(--lp-danger-hover) !important;
}
.btn-outline-danger {
    color: var(--lp-danger) !important;
    border-color: var(--lp-danger) !important;
}
.btn-outline-danger:hover, .btn-outline-danger:focus,
.btn-outline-danger:active, .btn-outline-danger.active {
    background-color: var(--lp-danger) !important;
    border-color: var(--lp-danger) !important;
    color: #fff !important;
}
.text-danger { color: var(--lp-danger) !important; }

/* ── Überschriften-Schrift (CI: Montserrat) getrennt vom Fließtext ───────────
   --lp-font-heading kommt aus den Design-Einstellungen (Admin → Farben & Schrift
   → „Überschriften-Schrift"); Fallback ist die Fließtext-Schrift. Diese Regel
   lädt nach theme.css und überschreibt dort das pauschale var(--lp-font). */
h1, h2, h3, h4, h5, h6,
.brand-h1, .brand-h2, .brand-h3,
.navbar-brand, .brand-logo-text {
    font-family: var(--lp-font-heading, var(--lp-font)), Arial, Helvetica, sans-serif !important;
    font-weight: 700;
}