/* Kap. 642b: Abzeichen fuer gebuchte Produkte */
.gebucht-zeile{display:flex; gap:8px; align-items:center; flex-wrap:wrap; margin:16px 0 0}
.gebucht-titel{font-size:12px; font-weight:700; letter-spacing:.4px; text-transform:uppercase;
  color:#5A6472; margin-right:4px}
.badge{display:inline-flex; align-items:center; padding:5px 12px; border-radius:999px;
  background:#E8F1FB; color:#0F4C85; border:1px solid #CFE1F5; font-size:12.5px; font-weight:650}
/* Kap. 651: Das Wort "gebucht" stand absolut in der Ecke und lag ueber dem Titel.
   Die Zeile "Fuer Ihre Gemeinde gebucht" ueber den Spalten sagt es bereits - hier nur
   ein leiser Punkt links am Titel. */
a.karte[data-gebucht] .kopf::before{content:''; width:6px; height:6px; border-radius:50%;
  background:#2D7A4F; display:inline-block; margin-right:2px}

.gebucht-hinweis{font-size:12.5px; color:#5A6472}

/* Kap. 635: ohne Anmelde-Kasten ist die Flaeche einspaltig (sonst bliebe rechts eine
   leere 384-px-Spalte). */
.spalten.ohne-anmeldung{grid-template-columns:1fr}
/* Vom Portal ergaenzt: Zustand der Anmeldung */
/* KAP. 519ac: Der angemeldete Zustand ist ein KOPFLEISTEN-Cluster, kein eigener Kasten.
   Vorher stand hier ein grau hinterlegter Block mit Innenabstand — im Kopf riss er die
   Menueleiste auseinander (befundet). */
.angemeldet{display:inline-flex; align-items:center; gap:10px; margin-left:auto;
  font-size:13.5px; color:var(--it-text-2,#4C5A67); white-space:nowrap}
.angemeldet b{color:#08304F; font-weight:700}
.angemeldet .abmelden{margin-left:2px; padding-left:12px; border-left:1px solid var(--linie,#E4E7EB);
  color:#0F4C85; text-decoration:none; font-weight:600}
.angemeldet .abmelden:hover{text-decoration:underline}
/* Und der leise Anmelde-Verweis im Kopf (unangemeldet) — gleiche Ruhe wie „Abmelden". */
a.kopfanmeldung{margin-left:auto; display:inline-flex; align-items:center; min-height:36px;
  padding:7px 14px; border-radius:var(--r-zeile,9px); text-decoration:none;
  font-weight:650; font-size:14px; color:#0F4C85; white-space:nowrap;
  border:1px solid rgba(15,76,133,.28); background:rgba(15,76,133,.04)}
a.kopfanmeldung:hover{background:rgba(15,76,133,.10)}
/* KAP. 519z: der Avatar rechts oben — Bild aus Keycloak, Initialen als Rueckfall.
   Das Bild legt sich ueber die Initialen; laedt es nicht, bleibt der Buchstabe stehen. */
.angemeldet .av{position:relative; flex:0 0 auto; width:38px; height:38px; border-radius:50%;
  background:linear-gradient(135deg,#0F4C85,#1A6FB5); display:grid; place-items:center; overflow:hidden}
.angemeldet .av i{font-style:normal; color:#fff; font-weight:700; font-size:14px; letter-spacing:.3px}
.angemeldet .av img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:none}
.angemeldet .av.da img{display:block}
.angemeldet .wer{line-height:1.35}
.angemeldet .wer b{color:#08304F; font-weight:700}
a.knopf{display:flex; align-items:center; justify-content:center; width:100%; min-height:46px;
  padding:12px 16px; font-size:15px; font-weight:700; letter-spacing:.4px; color:#fff;
  text-decoration:none; border-radius:9px;
  background:linear-gradient(96deg,#00305B 0%,#0F4C85 58%,#1A6FB5 100%);
  box-shadow:0 10px 22px rgba(0,48,91,.22)}
a.knopf:hover{transform:translateY(-1px); box-shadow:0 14px 28px rgba(0,48,91,.28)}
.fussnote{margin-top:12px; font-size:12px; text-align:center; color:#4C5A67}

/* Die Anmeldemaske der k360-Adresse: gleiche Formensprache wie das angemeldete Feld */
.portal-anmeldung{display:block}
.portal-anmeldung label{display:block; font-size:12.5px; font-weight:700; letter-spacing:.2px;
  color:#0F1B26; margin:0 0 6px}
.portal-anmeldung input{width:100%; padding:11px 13px; font-size:14.5px; font-family:inherit;
  color:#0F1B26; background:rgba(255,255,255,.92); border:1px solid #7A8896;
  border-radius:9px; margin:0 0 15px; transition:border-color 220ms, box-shadow 220ms}
.portal-anmeldung input:focus{outline:none; border-color:#0F4C85;
  box-shadow:0 0 0 3px rgba(15,76,133,.18)}
.portal-anmeldung button.knopf{width:100%; border:0; cursor:pointer}

/* Die Produktkacheln sind VERWEISE. Ein Verweis ist von Haus aus "inline" — damit
   brechen Innenabstand, Rundung und Raster der Kachel. Deshalb hier ausdruecklich
   dieselben Regeln wie fuer die Kachel selbst, plus: kein Unterstrich. */
a.karte, a.karte:hover, a.karte:focus, a.karte:visited{ text-decoration:none; color:inherit; }
a.karte{ display:block; cursor:pointer; }
a.karte.mitzeichen{ display:grid; }
a.karte:focus-visible{ outline:2px solid #0F4C85; outline-offset:2px; }