/* PV-Simulator – ergänzende Stile zu Bootstrap 5.3 (keine Inline-Styles wegen Content-Security-Policy) */

body { background: #f5f6f8; }

.kpi { border: 0; box-shadow: 0 1px 2px rgba(0, 0, 0, .06); }
.kpi-label { font-size: .8rem; color: #6c757d; text-transform: uppercase; letter-spacing: .03em; }
.kpi-value { font-size: 1.5rem; font-weight: 600; color: #212529; line-height: 1.3; }
.kpi-value small { font-size: .9rem; font-weight: 400; color: #6c757d; }
a.kpi:hover { box-shadow: 0 2px 6px rgba(0, 0, 0, .12); }

.chart-box { position: relative; height: 320px; }
.chart-box-lg { height: 420px; }

/* Vergleich / Optimierungsvorschläge */
.cmp-rec { border: 1px solid #dee2e6; box-shadow: 0 1px 2px rgba(0, 0, 0, .04); }
.cmp-rec-best { border-color: #1e8449; box-shadow: 0 0 0 1px rgba(30, 132, 73, .25); }
.cmp-table .cmp-row-best { background: rgba(30, 132, 73, .08); }
.cmp-table .cmp-row-pareto { background: rgba(230, 167, 0, .08); }
.chart-type { display: inline-flex; align-items: center; gap: .35rem; }
.chart-type .form-select { width: auto; min-width: 8rem; }
.canton-log { max-height: 12rem; overflow: auto; white-space: pre-wrap; }
.ts-table { max-height: 420px; overflow-y: auto; }
.json-view { max-height: 480px; overflow: auto; white-space: pre; }
.audit-details { white-space: normal; word-break: break-word; font-size: .75rem; }
.project-desc { max-width: 28rem; }

.progress { height: 1.4rem; }
.progress-bar { width: 0; transition: width .3s ease; }

.sticky-actions { position: sticky; bottom: 0; background: #f5f6f8; border-top: 1px solid #dee2e6; z-index: 10; }
.repeater-item { background: #fbfcfd; }
.geocode { position: relative; }
.geocode-list { position: absolute; left: calc(var(--bs-gutter-x) * .5); right: calc(var(--bs-gutter-x) * .5); z-index: 1050;
    max-height: 18rem; overflow-y: auto; box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .15); }
.geocode-list .list-group-item { cursor: pointer; }
.card-header .form-check-label { cursor: pointer; }
.help-btn { display: inline-flex; align-items: center; justify-content: center; width: 1.1rem; height: 1.1rem; margin-left: .3rem;
    padding: 0; border: 1px solid #6c757d; border-radius: 50%; background: transparent; color: #6c757d;
    font-size: .7rem; font-weight: 700; line-height: 1; vertical-align: .1em; cursor: pointer; }
.help-btn:hover, .help-btn:focus-visible, .help-btn[aria-expanded="true"] { border-color: #0d6efd; background: #0d6efd; color: #fff; }
.help-popover { max-width: 24rem; }
.help-popover .popover-body { white-space: pre-line; }
details > summary { cursor: pointer; color: #0d6efd; }

/* Icon-Aktionsbuttons in Listen (SVG, ohne Icon-Font wegen CSP) */
.btn-icon {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    padding: 0;
    line-height: 1;
}
.btn-icon.btn-icon-lg { width: 2.35rem; height: 2.35rem; }
.btn-icon .icon { display: block; flex-shrink: 0; }
/* Klicks müssen den Button treffen – sonst findet closest('[data-action]') das Ziel nicht (SVG/path). */
.btn-icon svg,
.btn-icon .icon,
.btn-icon .visually-hidden { pointer-events: none; }
.btn-icon-group { display: inline-flex; flex-wrap: wrap; gap: .25rem; justify-content: flex-end; align-items: center; }

.deps-list { padding-left: 1.1rem; margin-bottom: 0; }
.deps-list li { margin-bottom: .15rem; }
.deps-external { color: #856404; }
.deps-confirm { border-top: 1px solid #dee2e6; padding-top: .75rem; }
.deps-confirm-details > summary,
.deps-group > summary,
.deps-compact > summary { cursor: pointer; color: #0d6efd; }
.deps-group > summary { font-weight: 600; color: inherit; }
.deps-group.deps-external-wrap > summary { color: #856404; }
#project-dependencies .card-header .btn[aria-expanded="true"] .deps-chevron { transform: rotate(180deg); }
#project-dependencies .deps-chevron { display: inline-block; transition: transform .15s ease; }

@media (max-width: 575.98px) {
    .kpi-value { font-size: 1.2rem; }
    .chart-box { height: 260px; }
}

/* Öffentliche Website / CMS – gleiche container-xl-Spalte wie Arbeitsbereich */
body.cms-public { display: flex; flex-direction: column; min-height: 100vh; background: #f5f6f8; }
.cms-public-nav { background: #1a2332; }
.cms-logo { height: 1.75rem; width: auto; }
.cms-logo-app { height: 1.5rem; width: auto; }
.cms-hero {
    position: relative;
    overflow: hidden;
    background: linear-gradient(135deg, #1a2332 0%, #2c4a6e 100%);
    color: #fff;
    border-radius: .375rem;
}
.cms-hero-has-image { min-height: 12rem; }
.cms-hero-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .35; }
.cms-hero-content { z-index: 1; }
.cms-article { max-width: none; width: 100%; }
.cms-article h2 { margin-top: 1.5rem; font-size: 1.35rem; }
.cms-article h3 { margin-top: 1.25rem; font-size: 1.15rem; }
.cms-article img { max-width: 100%; height: auto; border-radius: .25rem; }
.cms-article .approach-flows,
.approach-flows {
    display: grid;
    gap: 1.25rem;
    margin: 1rem 0 1.5rem;
}
@media (min-width: 768px) {
    .cms-article .approach-flows,
    .approach-flows { grid-template-columns: 1fr 1fr; }
}
.approach-flow-block {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: .5rem;
    padding: .75rem 1rem 1rem;
}
.approach-flow-title { margin: 0 0 .5rem; color: #1a2332; }
.approach-flow-caption { margin: .5rem 0 0; }
.approach-flow-svg { display: block; width: 100%; height: auto; max-width: 100%; }
.approach-flow-mini { margin-top: .25rem; pointer-events: none; }
.approach-flow-mini .approach-flow-svg { max-height: 4.5rem; }
.approach-model-wrap {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: .5rem;
    padding: .75rem 1rem;
}
.approach-card { transition: border-color .15s ease, box-shadow .15s ease; }
.approach-card:hover { border-color: #94a3b8; }
.approach-card.border-primary { box-shadow: 0 0 0 .15rem rgba(37, 99, 235, .15); }
.approach-badge-from-load {
    background-color: #0d9488;
    color: #fff;
}
.approach-guide {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: .5rem;
    padding: .75rem 1rem;
    margin-bottom: .5rem;
}
.approach-guide-a2 { border-color: #99f6e4; background: #f0fdfa; }
.approach-guide-a1 { border-color: #bfdbfe; background: #eff6ff; }
.approach-inventory li { margin-bottom: .35rem; }
.approach-inventory .badge { margin-right: .35rem; }
.cms-public-footer-inner { margin-top: auto; }

/* Registrierung: Honeypot für Bots (visuell und für Screenreader versteckt) */
.reg-hp {
    position: absolute;
    left: -10000px;
    top: auto;
    width: 1px;
    height: 1px;
    overflow: hidden;
}
.cms-media-thumb { max-height: 8rem; width: 100%; object-fit: cover; }
.cms-dragging { opacity: .5; }
.cms-drag-handle { cursor: grab; user-select: none; }
#cmsPagesBody tr[data-id]:hover { background: rgba(13, 110, 253, .04); }

/* TinyMCE (lokal, ohne Remote-Skins) */
.tox-tinymce { border-radius: .375rem !important; }
.tox .tox-toolbar, .tox .tox-menubar, .tox .tox-statusbar { background: #f8f9fa !important; }

@media print {
    .no-print, .navbar, footer, .toast-container, .help-btn, .modal { display: none !important; }
    body { background: #fff; font-size: 10pt; }
    body.print-view main.container-xl,
    main.container-xl { max-width: 100%; padding: 0; }
    .chart-box { height: 240px; page-break-inside: avoid; }
    .card { break-inside: avoid; box-shadow: none !important; border: 1px solid #ccc !important; }
    .cmp-rec { break-inside: avoid; }
    table { page-break-inside: auto; }
    tr { page-break-inside: avoid; }
    a { color: inherit; text-decoration: none; }
    details[data-cmp-block] { display: block !important; }
    details[data-cmp-block] > summary { display: none; }
    details[data-cmp-block][open] > *:not(summary),
    details[data-cmp-block] > *:not(summary) { display: block !important; }
}