/* Status-Seite (templates/agff-status.html.twig) und Hinweise an App-Links (status-hinweis.js) */
.agff-status { --as-gut: #1f8a4c; --as-mittel: #d39b16; --as-schlecht: #c2185b; --as-leer: #d7dcda; --as-rand: #d5ddd8; max-width: 980px; }
.as-banner { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; padding: 14px 18px; border-radius: 12px; font-weight: 700; font-size: 1.1rem; margin: 10px 0 18px; }
.as-banner small { font-weight: 400; font-size: .85rem; opacity: .85; }
.as-gut { background: #e3f3ea; color: #145c33; } .as-schlecht { background: #fde8ef; color: #8a1240; } .as-grau { background: #eef1f0; color: #3e4a46; }
.as-punkt { width: 12px; height: 12px; border-radius: 50%; background: currentColor; box-shadow: 0 0 0 4px rgba(0,0,0,.06); }
.as-schlecht .as-punkt { animation: as-puls 1.6s ease-in-out infinite; }
@keyframes as-puls { 50% { opacity: .35; } }
@media (prefers-reduced-motion: reduce) { .as-schlecht .as-punkt { animation: none; } }
.as-liste { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.as-dienst { border: 1px solid var(--as-rand); border-radius: 14px; padding: 14px 16px 12px; background: #fff; }
.as-kopf { display: grid; grid-template-columns: auto minmax(0, 1fr) auto auto; gap: 6px 14px; align-items: center; }
.as-ampel { width: 16px; height: 16px; border-radius: 50%; background: var(--as-leer); }
.as-an .as-ampel { background: var(--as-gut); box-shadow: 0 0 0 5px rgba(31,138,76,.15); }
.as-aus .as-ampel { background: var(--as-schlecht); box-shadow: 0 0 0 5px rgba(194,24,91,.18); animation: as-puls 1.6s ease-in-out infinite; }
.as-name h2 { font-size: 1.05rem; margin: 0; } .as-name p { margin: 2px 0 0; font-size: .9rem; color: #52514e; }
.as-zustand { display: flex; flex-direction: column; align-items: flex-end; font-size: .85rem; color: #52514e; text-align: right; }
.as-zustand b { font-size: .95rem; color: #1e1e1e; } .as-aus .as-zustand b { color: var(--as-schlecht); } .as-an .as-zustand b { color: var(--as-gut); }
.as-oeffnen { font-size: .9rem; font-weight: 600; white-space: nowrap; }
.as-verlauf { display: grid; grid-template-columns: repeat(30, 1fr); gap: 3px; margin-top: 12px; height: 28px; }
.as-tag { border-radius: 3px; background: var(--as-leer); } .as-tag.as-gut { background: var(--as-gut); } .as-tag.as-mittel { background: var(--as-mittel); } .as-tag.as-schlecht { background: var(--as-schlecht); }
.as-legende { display: flex; justify-content: space-between; font-size: .78rem; color: #6b6a65; margin-top: 4px; }
.as-h2 { font-size: 1.15rem; margin: 26px 0 8px; }
.as-stoerungen { margin: 0 0 12px; padding-left: 18px; font-size: .92rem; } .as-stoerungen li { margin: 4px 0; }
.as-klein { font-size: .85rem; color: #52514e; max-width: 720px; }
@media (max-width: 640px) { .as-kopf { grid-template-columns: auto minmax(0, 1fr); } .as-zustand { grid-column: 2; align-items: flex-start; text-align: left; } .as-oeffnen { grid-column: 2; } .as-verlauf { height: 22px; gap: 2px; } }
/* Hinweis an Links auf gestoerte Apps */
.agff-status-hinweis { display: inline-flex; align-items: center; gap: 4px; margin-left: 6px; padding: 1px 8px; border-radius: 999px; background: #fde8ef; color: #8a1240 !important; font-size: .8em; font-weight: 600; text-decoration: none !important; white-space: nowrap; vertical-align: middle; }
.agff-status-hinweis::before { content: ''; width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
/* Listenstile des Themes (prose) nicht uebernehmen */
.agff-status ul.as-liste, .agff-status ul.as-liste > li { margin: 0; padding-left: 0; list-style: none; max-width: none; }
.agff-status ul.as-liste > li.as-dienst { padding: 14px 16px 12px; }
.agff-status ul.as-liste > li::before, .agff-status ul.as-liste > li::marker { content: none; }
.agff-status .as-banner { max-width: none; }