/* Kundenportal: wenige eigene Regeln, Farben nur aus den Variablen des Core
   (hell und dunkel). */
.fk-body--auth .fk-auth__card:has(.portal-breit) { max-width: 46rem; }
.portal-text h2 { margin-top: var(--fk-space-5, 1.5rem); font-size: 1.05rem; }
.portal-fuss { margin-top: var(--fk-space-4, 1rem); font-size: .85rem; text-align: center; }
.portal-fuss a { margin: 0 .5rem; }
.portal-fuss-innen { margin-top: var(--fk-space-5); }

/* Nächste Schritte */
.portal-schritte { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--fk-space-3); }
.portal-schritt { border-left: 3px solid var(--fk-primary); padding: var(--fk-space-3) var(--fk-space-4); background: var(--fk-surface-2); border-radius: var(--fk-radius, 6px); }
.portal-schritt__frist { display: block; margin-top: var(--fk-space-1); font-size: .85rem; color: var(--fk-text-muted); }
.portal-erledigt { border-left: 3px solid var(--fk-success); padding: var(--fk-space-3) var(--fk-space-4); background: var(--fk-surface-2); border-radius: var(--fk-radius, 6px); }

/* Zwei Spalten: einmalig links, laufend rechts */
.portal-zwei { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); gap: var(--fk-space-4); margin: var(--fk-space-5) 0; align-items: start; }
@media (max-width: 860px) { .portal-zwei { grid-template-columns: 1fr; } }
.portal-zwei h2 { font-size: 1.1rem; margin: 0 0 var(--fk-space-3); }
.portal-karte + .portal-karte { margin-top: var(--fk-space-3); }

/* Phasenleiste einer Ausbaustufe */
.portal-phasen { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 4px; margin: var(--fk-space-2) 0 var(--fk-space-3); list-style: none; padding: 0; }
.portal-phasen li { font-size: .78rem; text-align: center; padding: .35rem .2rem; border-radius: 4px; background: var(--fk-surface-2); color: var(--fk-text-muted); border: 1px solid var(--fk-border); }
.portal-phasen li.is-erledigt { color: var(--fk-text); border-color: var(--fk-success); }
.portal-phasen li.is-aktiv { background: var(--fk-primary); border-color: var(--fk-primary); color: #fff; font-weight: 600; }
@media (max-width: 560px) { .portal-phasen { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

.portal-dl { display: grid; grid-template-columns: max-content 1fr; gap: var(--fk-space-1) var(--fk-space-4); margin: 0; }
.portal-dl dt { color: var(--fk-text-muted); }
.portal-dl dd { margin: 0; }

/* Rechnungen */
.portal-reiter { display: flex; flex-wrap: wrap; gap: var(--fk-space-3); margin: var(--fk-space-4) 0; }
.portal-reiter a { padding: .3rem .7rem; border: 1px solid var(--fk-border); border-radius: 999px; text-decoration: none; }
.portal-stand { font-weight: 600; }
.portal-stand--bezahlt { color: var(--fk-success); }
.portal-stand--ueberfaellig { color: var(--fk-error); }
.portal-stand--offen, .portal-stand--teilweise { color: var(--fk-warning); }
.portal-stand--storniert, .portal-stand--gutschrift { color: var(--fk-text-muted); }