/* Standort-Seiten und Übersicht (Verkaufsstellen). Grosse Schrift, grosse Klickflächen (≥ 56 px). */
.rha-standort, .rha-standorte { max-width: 72rem; margin: 0 auto; font-size: 1.125rem; line-height: 1.6; color: #1f2937; }
.rha-standort h2, .rha-standorte h2 { font-weight: 700; line-height: 1.25; margin: 0 0 .75rem; }

/* ---------- Status-Farben ---------- */
.rha-badge { display: inline-block; padding: .1rem .6rem; border-radius: 999px; font-size: .9rem; font-weight: 700; line-height: 1.5; vertical-align: middle; }
.rha-badge-aktiv { background: #e3f3ec; color: #0f5c43; }
.rha-badge-aufbau { background: #fff1d6; color: #7a3f00; }
.rha-badge-planung { background: #e8eefc; color: #1d3f91; }
.rha-badge-eingestellt { background: #cfd4d9; color: #2b3238; }

/* ---------- Hinweisbox oben ---------- */
.rha-hinweisbox { display: flex; flex-wrap: wrap; gap: .25rem .75rem; align-items: baseline; padding: 1rem 1.25rem; margin: 0 0 1.5rem; border-radius: .6rem; border-left: 8px solid; font-size: 1.15rem; }
.rha-hb-aufbau { background: #fff4dc; border-color: #d98a0b; color: #5c3200; }
.rha-hb-planung { background: #e8eefc; border-color: #3a62c8; color: #172f6b; }
.rha-hb-eingestellt { background: #d3d8dc; border-color: #5b636a; color: #1c2227; }

/* ---------- Eingestellte Standorte: ganze Seite grau ---------- */
.rha-standort.rha-status-eingestellt { background: #e9ecef; border: 2px solid #b8bec4; border-radius: .9rem; padding: 1.25rem; }
.rha-status-eingestellt .rha-infobox { background: #dde1e5; border-color: #b8bec4; }
.rha-status-eingestellt .rha-kurz { color: #4b5359; }

/* ---------- Raster der Standortseite ---------- */
.rha-st-grid { display: grid; gap: 1.5rem 2rem; grid-template-columns: minmax(0, 1fr); grid-template-areas: "info" "haupt" "karte"; }
.rha-infobox { grid-area: info; }
.rha-st-haupt { grid-area: haupt; min-width: 0; }
.rha-st-karte { grid-area: karte; min-width: 0; }
@media (min-width: 900px) {
  .rha-st-grid { grid-template-columns: minmax(0, 1fr) 24rem; grid-template-areas: "haupt info" "haupt karte"; align-items: start; }
  .rha-infobox { position: sticky; top: 5.5rem; }
}

.rha-infobox { background: #f3f6f4; border: 1px solid #c9d3ce; border-radius: .8rem; padding: 1.25rem; }
.rha-infobox h2 { font-size: 1.3rem; }
.rha-infobox dl { display: grid; grid-template-columns: 7.5rem minmax(0, 1fr); gap: .6rem 1rem; margin: 0 0 1.1rem; }
.rha-infobox dt { font-weight: 700; color: #4b5563; }
.rha-infobox dd { margin: 0; overflow-wrap: anywhere; }
.rha-knoepfe { display: flex; flex-direction: column; gap: .7rem; }
.rha-knopf { display: flex; align-items: center; justify-content: center; min-height: 56px; padding: .5rem 1.25rem; border: 2px solid #167a5a; border-radius: .6rem; background: #fff; color: #0f5c43; font-size: 1.1rem; font-weight: 700; text-decoration: none; text-align: center; }
.rha-knopf:hover { background: #e3f3ec; }
.rha-knopf-haupt { background: #167a5a; color: #fff; }
.rha-knopf-haupt:hover { background: #0f5c43; }
.rha-status-eingestellt .rha-knopf { border-color: #5b636a; color: #2b3238; }

.rha-kurz { font-size: 1.25rem; font-weight: 600; margin: 0 0 1rem; color: #0f5c43; }
.rha-text > :first-child { margin-top: 0; }
.rha-text p { margin: 0 0 1rem; }
.rha-text ol, .rha-text ul { padding-left: 1.4rem; margin: 0 0 1rem; }
.rha-text li { margin-bottom: .5rem; }
.rha-text h3 { font-size: 1.3rem; margin: 1.5rem 0 .5rem; }

.rha-fotos { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr)); margin: 1.5rem 0; }
.rha-foto { margin: 0; }
.rha-foto a { display: block; }
.rha-foto img { display: block; width: 100%; height: auto; border-radius: .6rem; }
.rha-foto figcaption { margin-top: .4rem; font-size: 1rem; color: #4b5563; }
.rha-zurueck { margin-top: 2rem; font-size: 1.1rem; }

/* ---------- Übersicht ---------- */
.rha-intro > :first-child { margin-top: 0; }
.rha-gruppe { margin-top: 2.75rem; }
.rha-gruppe h2 { font-size: 1.7rem; }
.rha-gruppe-text { margin: 0 0 1.1rem; color: #4b5563; }
.rha-eintraege { list-style: none; margin: 0 0 1.25rem; padding: 0; display: grid; gap: 1rem; grid-template-columns: repeat(auto-fill, minmax(19rem, 1fr)); }
.rha-eintrag a { display: flex; flex-direction: column; gap: .15rem; height: 100%; min-height: 56px; padding: 1rem 1.15rem; border: 2px solid #c9d3ce; border-radius: .8rem; background: #fff; color: #1f2937; text-decoration: none; }
.rha-eintrag a:hover { border-color: #167a5a; }
.rha-e-name { font-size: 1.2rem; font-weight: 700; }
.rha-e-zeile { color: #4b5563; font-size: 1.05rem; }
.rha-e-kurz { color: #0f5c43; font-weight: 600; }
.rha-e-mehr { margin-top: auto; padding-top: .5rem; color: #0f5c43; font-weight: 700; }
.rha-eintrag.rha-status-aufbau a, .rha-eintrag.rha-status-planung a { border-style: dashed; background: #fafaf7; }
.rha-eintrag.rha-status-eingestellt a { background: #e9ecef; border-color: #b8bec4; color: #4b5359; }
.rha-eintrag.rha-status-eingestellt .rha-e-name, .rha-eintrag.rha-status-eingestellt .rha-e-zeile, .rha-eintrag.rha-status-eingestellt .rha-e-mehr { color: #4b5359; }

/* ---------- Karten-Popup ---------- */
.rha-popup-status { display: inline-block; margin: .15rem 0; padding: 0 .5rem; border-radius: 999px; font-size: .85rem; font-weight: 700; }
.rha-st-aufbau { background: #fff1d6; color: #7a3f00; }
.rha-st-planung { background: #e8eefc; color: #1d3f91; }
.rha-st-eingestellt { background: #cfd4d9; color: #2b3238; }
.rha-karte .rha-pin-eingestellt { filter: grayscale(1); }

/* Zwischenüberschriften im Text deutlicher */
.rha-text h3 { font-weight: 700; color: #1f2937; }

/* Schmale Bildschirme: Info-Tabelle einspaltig, weniger Randabstand */
@media (max-width: 599px) {
  .rha-infobox { padding: 1rem; }
  .rha-infobox dl { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .rha-infobox dt { margin-top: .75rem; font-size: .95rem; }
  .rha-infobox dd { margin-top: .1rem; }
  .rha-standort.rha-status-eingestellt { padding: .75rem; }
  .rha-hinweisbox { padding: .85rem 1rem; }
}

/* Hochformatfotos nicht über den ganzen Bildschirm ziehen */
.rha-foto img { max-height: 26rem; object-fit: cover; object-position: center 60%; }

/* ---------- Anleitung im Modal ---------- */
button.rha-knopf { cursor: pointer; font: inherit; }
.rha-dialog { width: min(60rem, 94vw); max-height: 92vh; padding: 0; border: 0; border-radius: 1rem; overflow: auto; box-shadow: 0 20px 60px rgba(0, 0, 0, .4); color: #1f2937; }
.rha-dialog::backdrop { background: rgba(20, 30, 25, .6); }
.rha-dialog-kopf { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: .75rem 1.25rem; position: sticky; top: 0; background: #167a5a; color: #fff; z-index: 2; }
.rha-dialog-kopf h2 { margin: 0; font-size: 1.4rem; color: #fff; }
.rha-dialog-zu { width: 3.5rem; height: 3.5rem; font-size: 2.2rem; line-height: 1; border: 2px solid #fff; border-radius: .6rem; background: transparent; color: #fff; cursor: pointer; }
.rha-dialog-zu:hover { background: #0f5c43; }
.rha-dialog-inhalt { display: grid; gap: 1.25rem 2rem; padding: 1.25rem; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 800px) { .rha-dialog-inhalt { grid-template-columns: minmax(0, 20rem) minmax(0, 1fr); align-items: start; } .rha-anl-hinweis { grid-column: 1 / -1; } }
.rha-anl-bild { position: relative; max-width: 24rem; margin: 0 auto; }
.rha-anl-bild img { display: block; width: 100%; height: auto; border-radius: .6rem; margin: 0 !important; }
.rha-pin { position: absolute; transform: translate(-50%, -50%); width: 2.25rem; height: 2.25rem; border-radius: 50%; border: 3px solid #fff; background: #167a5a; color: #fff; font-weight: 800; font-size: 1rem; cursor: pointer; box-shadow: 0 2px 8px rgba(0, 0, 0, .5); }
.rha-pin.aktiv, .rha-pin:focus-visible { background: #d98a0b; transform: translate(-50%, -50%) scale(1.2); z-index: 3; }
.rha-pin-tip { display: none; position: absolute; bottom: 125%; left: 50%; transform: translateX(-50%); white-space: nowrap; padding: .3rem .65rem; border-radius: .4rem; background: #1f2937; color: #fff; font-size: .95rem; font-weight: 600; pointer-events: none; }
.rha-pin:hover .rha-pin-tip, .rha-pin:focus-visible .rha-pin-tip, .rha-pin.aktiv .rha-pin-tip { display: block; }
.rha-anl-liste { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .6rem; }
.rha-anl-liste li { display: flex; align-items: center; gap: .75rem; margin: 0; padding: .6rem .75rem; border: 2px solid #d5dbd8; border-radius: .7rem; background: #f7faf8; }
.rha-anl-liste li::marker { content: none; }
.rha-anl-liste li.aktiv { border-color: #d98a0b; background: #fff4dc; }
.rha-anl-nr { flex: none; width: 2rem; height: 2rem; display: inline-flex; align-items: center; justify-content: center; border-radius: 50%; background: #167a5a; color: #fff; font-weight: 800; }
.rha-anl-icon { flex: none; color: #0f5c43; }
.rha-anl-icon svg { stroke: currentColor; }
.rha-anl-hinweis { margin: 0; padding: .75rem 1rem; background: #e3f3ec; border-radius: .6rem; font-weight: 600; }

/* Brotkrumen: gleiche Spalte wie der Inhalt, deutlicher Abstand nach unten */
.rha-brotkrumen { margin: 0 0 2.25rem; padding-top: .25rem; font-size: .95rem; line-height: 1.5; color: #4b5563; }
.rha-brotkrumen a { color: #0f5c43; text-decoration: none; }
.rha-brotkrumen a [itemprop="name"] { text-decoration: underline; text-underline-offset: .2em; }
.rha-krume-trenner { margin: 0 .5rem; color: #9ca3af; }
.dark .rha-brotkrumen { color: #9ca3af; }
.dark .rha-brotkrumen a { color: #6ee7b7; }

/* Vorschaubild links in der Standort-Kachel */
.rha-eintrag a.rha-e-mit-bild { flex-direction: row; align-items: center; gap: .9rem; }
.rha-e-bild { flex: none; width: 5.25rem; height: 5.25rem; border-radius: .55rem; overflow: hidden; background: #e3f3ec; }
.rha-e-bild img { display: block; width: 100%; height: 100%; object-fit: cover; margin: 0 !important; }
.rha-e-text { display: flex; flex-direction: column; gap: .15rem; min-width: 0; flex: 1; }
.rha-eintrag.rha-status-eingestellt .rha-e-bild { filter: grayscale(1); opacity: .75; }

/* ---------- Auf einen Blick: Badges, Fakten mit Symbol, Knöpfe ---------- */
.rha-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.rha-chips { list-style: none; display: flex; flex-wrap: wrap; gap: .45rem; margin: 0 0 .9rem; padding: 0; }
.rha-chip { margin: 0; padding: .3rem .85rem; border-radius: 999px; background: #167a5a; color: #fff; font-size: 1.05rem; font-weight: 700; line-height: 1.3; }
.rha-chips .rha-badge { margin: 0; padding: .3rem .85rem; font-size: 1rem; }
.rha-status-eingestellt .rha-chip { background: #5b636a; }
.rha-fakten { list-style: none; margin: 0 0 1rem; padding: 0; }
.rha-fakt { display: flex; align-items: flex-start; gap: .7rem; margin: 0; padding: .6rem 0; border-top: 1px solid #d5dbd8; font-size: 1.05rem; line-height: 1.4; }
.rha-fakt svg { flex: none; width: 1.5rem; height: 1.5rem; margin-top: .05rem; fill: none; stroke: #167a5a; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.rha-fakt span { min-width: 0; overflow-wrap: anywhere; }
.rha-status-eingestellt .rha-fakt svg { stroke: #5b636a; }
@media (max-width: 767px) {
  .rha-infobox { padding: .9rem 1rem 1rem; }
  .rha-knoepfe { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem; }
  .rha-knoepfe .rha-knopf-haupt { grid-column: 1 / -1; }
  .rha-knopf { min-height: 3rem; padding: .35rem .6rem; font-size: 1rem; text-align: center; }
}
button.rha-knopf { font-weight: 700; font-size: 1.1rem; }
@media (max-width: 767px) { button.rha-knopf { font-size: 1rem; } }

/* ---------- Onlineshop-Hinweis oben auf /verkaufsstellen ---------- */
.rha-shop { display: flex; gap: 1rem; align-items: flex-start; margin: 1.25rem 0 0; padding: 1rem 1.25rem; background: #eef5f9; border-left: 8px solid #2b6f94; border-radius: .6rem; color: #17394d; }
.rha-shop > svg { flex: none; width: 2.2rem; height: 2.2rem; margin-top: .1rem; fill: none; stroke: #2b6f94; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.rha-shop-text { min-width: 0; }
.rha-shop h2 { margin: 0 0 .35rem; font-size: 1.4rem; }
.rha-shop h2 .rha-badge { margin-left: .4rem; font-size: .85rem; vertical-align: middle; }
.rha-shop p { margin: 0; }
.rha-shop .rha-knopf { margin-top: .75rem; display: inline-flex; }
@media (max-width: 767px) { .rha-shop { margin-top: .5rem; padding: .8rem .9rem; gap: .7rem; } .rha-shop > svg { width: 1.8rem; height: 1.8rem; } .rha-shop h2 { font-size: 1.15rem !important; margin: 0 0 .25rem !important; } .rha-shop p { font-size: .98rem; line-height: 1.4; } }
.dark .rha-shop { background: #1b3140; color: #dbe9f1; border-color: #5aa6cc; }
