/* v4.12 – Fenster «Kundenstimmen» und Zitat-Zeile auf dem Desktop (aus Mockup Runde 3, 28.10.2026). Baut auf den bestehenden Klassen .window/.title-bar/.button auf. */
/* Fenster */
#kundenstimmen[style*="block"]{display:flex!important} /* Doppelklick setzt display:block – Fenster bleibt Flex-Spalte */
#kundenstimmen{top:6vh;left:200px;width:min(900px,calc(100vw - 230px))}
@media (max-width:1023px){
  #kundenstimmen{top:24px;left:4px;width:calc(100vw - 8px);max-width:none;height:calc(100% - 76px)}
  .ks-body{height:auto;flex:1 1 auto}
}

/* Ein Fenster, Explorer-Aufteilung: links Kundenliste, rechts Detailansicht (keine Fenster im Fenster) */
#kundenstimmen .menubar{flex:0 0 auto}
.ks-body{display:flex;gap:3px;height:min(500px,calc(100vh - 6vh - 126px));flex:1 1 auto;min-height:0;padding:0 1px 2px} /* flex: wächst/schrumpft mit, wenn das Fenster an der Ecke vergrössert/verkleinert wird (Statusleiste bleibt unten) */
.ks-liste,.ks-inhalt{background:#fff;overflow:auto;
  box-shadow:inset -1px -1px #fff,inset 1px 1px gray,inset -2px -2px #dfdfdf,inset 2px 2px #121212}
.ks-liste{flex:0 0 250px;padding:4px}
.ks-liste ul{list-style:none;margin:0;padding:0}
.ks-liste__eintrag{display:flex;align-items:center;gap:8px;width:100%;margin:0 0 2px;padding:6px 6px;border:1px dotted transparent;
  background:none;font:inherit;font-size:.9em;color:#121212;text-align:left;cursor:default}
.ks-liste__eintrag:focus-visible{border-color:#121212;outline:none}
.ks-liste__logo{flex:0 0 76px;height:36px;display:flex;align-items:center;justify-content:center;background:#fff;border:1px solid #dfdfdf;padding:2px}
.ks-liste__logo img{max-width:100%;max-height:100%;width:auto;height:auto;display:block}
.ks-liste__text{min-width:0;display:flex;flex-direction:column}
.ks-liste__name{font-weight:bold;color:#004264}
.ks-liste__branche{font-size:.88em;color:#555}
.ks-liste__eintrag[aria-selected="true"]{background:#004264;color:#fff}
.ks-liste__eintrag[aria-selected="true"] .ks-liste__name,.ks-liste__eintrag[aria-selected="true"] .ks-liste__branche{color:#fff}
.ks-inhalt{flex:1 1 auto;min-width:0;padding:16px 22px 18px}
.ks-titel{margin:0 0 .15em;font-size:1.4em}
.ks-lead{margin:0 0 1rem;color:#004264}
.ks-js .ks-detail[data-ks-verborgen]{display:none}
.ks-detail{padding-top:14px;border-top:1px solid gray;box-shadow:inset 0 1px #fff}
.ks-detail__logo{height:96px;display:flex;align-items:center;margin-bottom:12px}
.ks-detail__logo img{max-height:96px;max-width:min(340px,100%);width:auto;height:auto;display:block}
.ks-detail__name{margin:0 0 .5em;font-size:1.2em}
.ks-detail__zitat{margin:0 0 1rem;padding:0 0 0 12px;border-left:3px solid #004264;font-size:1.08em;line-height:1.45;color:#121212}
.ks-detail__zitat p{margin:0}
.ks-detail__angaben{display:grid;grid-template-columns:auto 1fr;gap:4px 12px;margin:0;font-size:.92em}
.ks-detail__angaben dt{color:#404040}
.ks-detail__angaben dd{margin:0}

/* Handy/Tablet schmal: keine Aufteilung, schlichte Liste untereinander mit Trennlinien */
@media (max-width:700px){
  .ks-body{display:block;height:auto;flex:1 1 auto;overflow:auto;-webkit-overflow-scrolling:touch}
  .ks-liste{display:none}
  .ks-inhalt{overflow:visible;padding:12px 14px 16px;min-height:100%}
  .ks-js .ks-detail[data-ks-verborgen]{display:block}
  .ks-detail{padding:14px 0 16px}
  .ks-detail__logo{height:64px;margin-bottom:10px}
  .ks-detail__logo img{max-height:64px;max-width:220px}
  .ks-detail__zitat{font-size:1em}
  .ks-detail__angaben{grid-template-columns:1fr;gap:0}
  .ks-detail__angaben dd{margin:0 0 6px}
}

/* Rotierende Zitat-Zeile auf dem Desktop (Win95-Tooltip/Infobox) */
.ks-ticker{position:absolute;right:1.5rem;bottom:calc(2.75rem + 2px + 1rem + 1.9rem);z-index:1;width:min(380px,calc(100vw - 2rem));
  display:flex;gap:8px;align-items:flex-start;padding:6px 8px 6px 7px;background:#ffffe1;color:#121212;border:1px solid #121212;
  box-shadow:2px 2px 0 rgba(0,0,0,.35);text-decoration:none;font-size:.85rem;line-height:1.3;cursor:pointer}
.ks-ticker:hover .ks-ticker__mehr,.ks-ticker:focus-visible .ks-ticker__mehr{text-decoration:underline}
.ks-ticker:focus-visible{outline:1px dotted #121212;outline-offset:2px}
.ks-ticker img{flex:0 0 auto;margin-top:1px}
.ks-ticker__text{flex:1 1 auto;min-width:0;transition:opacity .35s}
.ks-ticker__text.is-weg{opacity:0}
.ks-ticker__zitat{display:block}
.ks-ticker__quelle{display:block;color:#004264;font-weight:bold;margin-top:2px}
.ks-ticker__mehr{display:block;color:#004264;margin-top:3px;font-size:.92em}
@media (prefers-reduced-motion:reduce){.ks-ticker__text{transition:none}}
@media (max-width:600px){.ks-ticker{right:.5rem;left:.5rem;width:auto;bottom:calc(2.75rem + 2px + .5rem + 1.6rem);font-size:.8rem}}
@media (scripting:none){.ks-ticker{position:static;margin:.5rem}}
/* Ist das Fenster offen, ist die Zitat-Zeile überflüssig */
.screen-wrapper:has(#kundenstimmen[style*="flex"]) .ks-ticker,.screen-wrapper:has(#kundenstimmen[style*="block"]) .ks-ticker{display:none}
#kundenstimmen .statusbar span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media (min-width:701px){#kundenstimmen .statusbar span:last-child{flex:0 0 55%}}
@media (max-width:700px){#kundenstimmen .statusbar span:last-child:empty{display:none}}

/* Startfenster «Willkommen» rechts neben den Symbolen: mit 8 statt 7 Symbolen braucht es zwischen 870 und 983 px Fensterhöhe
   schon 2 Symbolspalten (bisher erst ab ≤ 869 px, siehe desktop.css) → Willkommen dort ebenfalls bei 315 px statt 200 px. */
@media (min-width:1024px) and (min-height:870px) and (max-height:983px){#willkommen{left:315px}}