/* Diese fünf spiegeln die Breakpoints des MUI-Themes (ui/theme.tsx) — beide
   Listen müssen zusammen geändert werden. */

/* Ohne Gegenstück im Theme: unterhalb dieser Breite ist die Kopfleiste zu
   schmal für Beschriftungen. Auch aus TSX nutzbar, siehe
   UpdateStatusToolbarButton. */

/* fixed sizes */

/* border-radius */
/* tables 8px*/

/* border-boxes */

/* NEW COLORS v12 - TOP MENU */

/*  */

/* SUPPORTIVE COLORS */
/* SUCCESS - Green */

/* WARNING - Orange */

/* ERROR - Red */

/* WARNING - Amber. Eigene Familie mit einem Mitglied: liegt zwischen
   clrSecondary (Gelb) und clrOrange und hat dort keine Entsprechung — der
   naechste Palettenwert ist 31 Einheiten entfernt, also sichtbar anders. */

/* Neutral */

/* INFO - Blue */

/* Colors */

/* Statusfarben der Update-Anzeige (AQPV-10941). Sie stehen hier und nicht in den
   Komponenten, weil sie an zwei Stellen gebraucht werden: als Kachel und Icon in
   der dunklen Kopfleiste und als Icon und Titel in der Statuskarte des Dialogs.
   Dieselbe Meldung soll an beiden Stellen gleich aussehen, und doppelt gepflegt
   wuerden die Werte irgendwann auseinanderlaufen, ohne dass es auffaellt.
   Die Toene sind auf die dunkle Kopfleiste ausgelegt, wo sie Kachel und Label
   tragen. Im Dialog genuegt das fuer ein Icon (3:1); als Titeltext bleiben sie
   unter den 4.5:1 der Stufe AA. Zwei Zustaende weichen dort ab, UpdateAvailable
   und CheckFailed — die Zahlen je Zustand stehen in UpdateInfoSection.css. */

/*  */

/*  TOP MENU */
/* end TOP MENU */

/* RGBA colors */

/* Dark Mode Colors (for Desktop WebComponent) */

/* Colors for chips and status indicators */

/* Dark Mode Colors for formatting report Values  */


.PPpnzZYkW5LqNdnm4CreUAHQX_FTQvad {
  overflow-x: hidden;
  overflow-y: auto;
  position: absolute;
  bottom: 0;
  right: 0;
}

.k99cYVzvSr1egpBxfmCgQJviWeUd_4Rl,
.KaWO5FCBDWMjfgm9xqM2nQRHuR6lKgrC {
  position: relative;
}

.KGbJbiOM8rN_ohTDQMHXjwc4rdSf3r8F,
.hNQ7FUMzOYdkgyiimhMOwZcmIiE8XQqx {
  position: relative;
  top: -10px;
  overflow: hidden; /* don't change overflow:hidden! solves:AQPV-6625*/
}
.hNQ7FUMzOYdkgyiimhMOwZcmIiE8XQqx {
  top: 4px !important;
}

.CQUT1EFGBU21kF1YDLxHQo4a3OdyI__6 {
  position: absolute;
  top: 0;
  right: 0;
  display: flex;
  padding-right: 0.5rem;
  flex-direction: column;
}

.k99cYVzvSr1egpBxfmCgQJviWeUd_4Rl .VictoryContainer > svg,
.KaWO5FCBDWMjfgm9xqM2nQRHuR6lKgrC .VictoryContainer > svg {
  overflow: visible;
  height: 99% !important;
}

.KGbJbiOM8rN_ohTDQMHXjwc4rdSf3r8F .VictoryContainer > svg,
.hNQ7FUMzOYdkgyiimhMOwZcmIiE8XQqx .VictoryContainer > svg {
  margin-top: -15px;
}

.k99cYVzvSr1egpBxfmCgQJviWeUd_4Rl .VictoryContainer {
  height: 99% !important;
}

.KaWO5FCBDWMjfgm9xqM2nQRHuR6lKgrC .VictoryContainer {
  height: 94% !important;
}

@media (max-width: 960px) {
  .CQUT1EFGBU21kF1YDLxHQo4a3OdyI__6.mUk5TsVo7ZEMQ3piUhJlYgpMtne64zWn {
    top: 35px;
  }
  .hNQ7FUMzOYdkgyiimhMOwZcmIiE8XQqx .VictoryContainer {
    padding: 0 1rem;
  }
}

@media print {
  .CQUT1EFGBU21kF1YDLxHQo4a3OdyI__6 {
    display: none;
  }
  .PPpnzZYkW5LqNdnm4CreUAHQX_FTQvad {
    overflow-x: visible;
    overflow-y: visible;
    flex-shrink: 1;
  }
  .KGbJbiOM8rN_ohTDQMHXjwc4rdSf3r8F,
  .hNQ7FUMzOYdkgyiimhMOwZcmIiE8XQqx {
    left: -10px;
    width: 100vw !important;
    padding: 1rem 1rem 0 1rem;
  }
}

.UyKBXvO36nKuHp9KNvd1GACl9zndBvPM {
  right: -10rem;
  bottom: 2rem;
  display: flex;
  justify-content: center;
  align-items: center;
}

@media (min-width: 500px) {
  ._ra2YAHfkeHbFBCBUTkPQQ2XrTxD7oou {
    min-width: 140px;
  }
}

.wDlJaIHxrcDevrL_zupSQexJXrvD8QAL {
  min-width: 100px;
}

.FT7I8dRiot0nvS_iNARDngvGcp8WgfeZ {
  flex-direction: row;
  align-items: center;
  margin-right: 0.25rem;
}

@media (min-width: 500px) {
  .tjXSmRC_EgPIrPYBQ_03KwDf4WwXkT_h {
    min-width: 140px;
  }
}

.mPBkCKXhU4C7HdEJlN7blQ37ue6_xCrT {
  min-width: 100px;
}

.T0GrJkR8_PHntqXd5Bffwo6GPZe_iAWw {
  color: #d32f2f;
  padding-top: 0.5rem;
}

.qZeSSaNJX4fomz4386rOngPNZsSF9VJ8 {
  display: flex;
  height: auto;
}

.JguQCMhdr__QsJeIoEiWwz0m7YwLSTVu {
  display: flex;
  flex-direction: row;
  border: 1px solid #ABBACF;
  border-radius: 8px;
  width: 100%;
  align-items: center;
}

.JguQCMhdr__QsJeIoEiWwz0m7YwLSTVu:hover {
  background-color: #E8EDF2;
}

.AH7TsnUldTIC9TBWYHiZQ2FGm0DMgm1i {
  text-decoration: none;
  flex: 1;
  color: inherit;
}

._zz4ab5dz9cW7HDMd44gLjwyJWCOU_uh {
  background-color: transparent;
  color: #587CA1;
}
.J815kApGLuz8WD08RV0QTAq6UROwPVeZ {
  padding-right: 16px;
}

.yMJw5ypdA9NcmlylllxgQTczQkAacDbr {
  font-weight: 500;
  color: #d32f2f;
}
.Nt5vgBxQo93MKd5iuzq2SQMtPZ0Kbt5g {
  font-weight: 500;
  color: #0A8B2E;
}

.RR_fSnpBafiC6WrtdTQ6AsgTMltZG85S {
  min-width: 300px;
}

.l7C3mZzxekDwCiGrPcrAwpGPsvktIRTU {
  word-break: break-all;
  display: -webkit-box;
  overflow: hidden;
  /* Nächsten Kommentar nicht löschen!*/
  /* autoprefixer: ignore next */
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}

@media (max-width: 600px) {
  .JguQCMhdr__QsJeIoEiWwz0m7YwLSTVu {
    align-items: center;
  }

  .J815kApGLuz8WD08RV0QTAq6UROwPVeZ {
    flex-direction: column;
    padding-left: 0;
    padding-right: 4px;
  }

  .J815kApGLuz8WD08RV0QTAq6UROwPVeZ button {
    margin: 2px 0;
  }

  .X6TwALrLxSxtLi0S9YsfSwsHIiIvh3QD {
    margin-left: 0 !important;
  }

  .l7C3mZzxekDwCiGrPcrAwpGPsvktIRTU {
    line-height: 1.3;
  }
}

@media (max-width: 460px) {
  .RR_fSnpBafiC6WrtdTQ6AsgTMltZG85S {
    min-width: 200px;
  }
}

@media (max-width: 400px) {
  .l7C3mZzxekDwCiGrPcrAwpGPsvktIRTU {
    font-size: 0.9rem;
    word-break: break-word;
  }
}

@media (max-width: 375px) {
  ._zz4ab5dz9cW7HDMd44gLjwyJWCOU_uh {
    transform: scale(0.9);
  }
  .AH7TsnUldTIC9TBWYHiZQ2FGm0DMgm1i > * {
    padding-right: 0;
    padding-left: 8px;
  }
  .AH7TsnUldTIC9TBWYHiZQ2FGm0DMgm1i > * > * {
    margin-right: 8px;
  }
}

.F42EVW_MuRDY8dkoESrodAv1IJ0JxiW8 {
  display: block;
  padding-bottom: 16px;
  margin: 0.5rem 0;
  width: 100%;
}

.F42EVW_MuRDY8dkoESrodAv1IJ0JxiW8 > div:nth-child(1) {
  width: 100%;
}

.mFI8d1wRC5_25xSpzXbc4g_hBvwW11R7 {
  background-color: rgba(255, 255, 255, 0.9);
  border-radius: 8px;
}

.mFI8d1wRC5_25xSpzXbc4g_hBvwW11R7::before {
  border-bottom: none;
}

.efMzGn8QXuwidjomJ9i4xAWUL0MMhCDT {
  cursor: pointer;
  margin: 0.25rem;
  display: flex;
  align-items: center;
}

.tVOyTTkOsmEQEKAFt57Iw6wAHjPRpZw6 {
  width: 1.5rem;
  height: 1rem;
  margin-right: 8px;
}

.YSXSXzxrJFuCHlbRuoHx0gj99gutJe0I {
  margin-right: 12px;
}

.SklsmgDaGWemRGAIc1rgFODskEOspkaj {
  width: 100%;
}

/* Enlarge the flag in the top menu so it matches the 32px icon column.
   Drop the trailing margin so the flag stays within the icon slot's
   min-width (otherwise it stretches the slot and pushes the label right). */
.SklsmgDaGWemRGAIc1rgFODskEOspkaj .tVOyTTkOsmEQEKAFt57Iw6wAHjPRpZw6 {
  width: 2rem;
  height: 1.5rem;
  margin-right: 0;
}

.SklsmgDaGWemRGAIc1rgFODskEOspkaj > div {
  display: flex;
  align-items: center;
}
/* input arrow  */
.SklsmgDaGWemRGAIc1rgFODskEOspkaj svg {
  color: #EDF0F4;
}

.FrbNMakPIatfiGCq1LolgauKdVGynS32 {
  border-color: rgba(255, 255, 255, 0.8);
}

.j_u2dOXyX6d8XAJeotrA7wY2vXvRr3sS {
  padding: 0;
}

.RbOqCSQcSPzVnd21hsGS9gaALEemPkIg {
  background-color: rgba(244, 244, 246, 0.9);
  position: fixed;
  bottom: 0;
  left: 0;
  display: flex;
  justify-content: flex-end;
  gap: 1rem;
  width: 100%;
  padding: 1rem 2rem;
  z-index: 100;
}

.RbOqCSQcSPzVnd21hsGS9gaALEemPkIg > button {
  box-shadow: none;
}

.rldwhdlioY0MOJ3xF9MpYg9pPalWdIte {
  background-color: white;
}

/* DIALOG BUTTONS */
._20zSYbntPwh5013YUYAxw2aAaTRq3rb {
  display: flex;
  justify-content: flex-end;
  gap: 1rem;
  width: 100%;
  margin: 1rem 0;
}

/* MEDIA */

@media (max-width: 960px) {
  .RbOqCSQcSPzVnd21hsGS9gaALEemPkIg {
    padding: 1rem;
  }

  .RbOqCSQcSPzVnd21hsGS9gaALEemPkIg > button,
  ._20zSYbntPwh5013YUYAxw2aAaTRq3rb > button {
    width: 50%;
  }
}

.KH0CdiXaUiPIdYCsoDrUApQBooPkDr2K {
  margin: 16px 0;
}

.KH0CdiXaUiPIdYCsoDrUApQBooPkDr2K:hover {
  background-color: #EEEFF1;
}

.jesBr9gM1NSzqLU6nL1zgykoAa9P0x5k {
  display: flex;
}

.y2cVVffzbtIsJip6XeLTCQE9wvy1Pmcu {
  font-size: 1.1rem;
  font-weight: 500;
}

.XjJVMlndVs4XOMXnY3f3RwzMvrMAHrPk {
  margin-top: 1rem;
  max-width: 300px;
}

.EEsNITes_NjTG1fwTXPKwcg6r0zWXU27 {
  display: flex;
  width: 100%;
  justify-content: space-between;
  align-items: center;
  margin: 0.75rem 0;
}

.EEsNITes_NjTG1fwTXPKwcg6r0zWXU27 > *:nth-child(2n-1) {
  margin-right: 1rem;
}

.WtuzrppUtbNaQkNFQ2TdwQVEAqCbnM0u,
.he6ezJJhoIVXTFSm3c_6jw16DPJTRjno {
  font-weight: 500;
}

.WtuzrppUtbNaQkNFQ2TdwQVEAqCbnM0u,
.LzbM3dYVqZNf8DDurEhgvAyHljbzI6ib,
.RTeVy7i9OSxh12ucv7e5eAXq6E8gh3l9,
.he6ezJJhoIVXTFSm3c_6jw16DPJTRjno {
  width: 100%;
  color: #434956;
  font-size: 0.9rem;
  text-align: left;
}

.he6ezJJhoIVXTFSm3c_6jw16DPJTRjno {
  text-align: right;
}
.RTeVy7i9OSxh12ucv7e5eAXq6E8gh3l9 {
  font-size: 1rem;
}

.inmiCn24_0X9CfjIX7VEngROTdrVYSS1 {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.sW1yhUSAnPnLmuMVuvWpKwBoCDutCwzh {
  display: inline-block;
  vertical-align: middle;
  margin-right: 8px;
}

.YJOvSWv1FgdUduekT0PRlghX51m6T_Dq {
  padding: 4px 16px;
}

@media (max-height: 500px) and (orientation: landscape) {
  .iNi2ftT5HhnS1BsA_HkqfQXxtSLOg4sD {
    width: 95%;
    height: 95%;
    margin: 4px auto;
  }
  .x59wmaw08CbEfmsshdpnbwN2Tr434QhM {
    padding: 0 16px;
    display: flex;
    justify-content: space-between;
  }
}

.lcTCN8n35YSQkPCMFW6tgB4yUgadIbRt {
  width: 8rem;
}

@media (max-height: 500px) and (orientation: landscape) {
  .tuNoTeVyTWEyrg3pd2RkDwpjvJmAT8a1 {
    padding: 0 16px;
  }
  .fcMmIoVjH6SqW1jJ1ea9wWpS7n7Fcjov {
    padding: 0 12px 0 0;
  }
}

.iiPYodZh0qyy6ghL15_N_w_7JUsXLvQd {
  height: 52px;
}

.icGqTa3QV787PYYKjlMN_w4PF1_6rog6 {
  position: absolute;
  top: 2.5rem;
  right: 11rem;
  z-index: 100;
}

.U6SHvJTWyAwBm7w5dJoAU5npsD3edHp5 {
  position: absolute;
  top: 6rem;
  right: 4rem;
  z-index: 100;
}

.GpHCQTPufG4BaRK8N4QA3M5ET_a2F1Mn {
  position: relative;
  height: 2rem;
}

.AVNLYIZv2FAuZEsZWHG_UQczym5288CD {
  position: absolute;
  top: 0;
  left: 0.5rem;
}

.mlFbz_EOMVf8YhDrQNcwggapQK5Zr8Zx {
  position: absolute;
  left: 2.8rem;
  top: 0.125rem;
  width: 9rem;
}

.hq8R3upgxmu6gniWTamogAnWHsMVzzng {
  display: none;
}

.Bl4LBBLXWVUlE_VpOVAZAlqwMNhVqr9g {
  width: 100%;
  height: 100%;
  overflow: auto;
  background: #F4F4F6;
}

.waZN9Mu_AWnCMIPbRVuOA69dfNhJPOAk {
  margin-top: calc(4 * 0.5rem);
}

.s2jNcETuj4aIeoZBl46K4wUttdC0vus7 {
  padding: calc(4 * 0.5rem);
}

.jUNnwp4z4dKSnRQMdragdw6zC2fu789K {
  padding: calc(2 * 0.5rem);
  border-left: solid 3px #d32f2f;
  border-right: solid 3px #d32f2f;
}

.KDxNqS8nTe2LCPr6WAW6TwXFKkGYSl0B {
  white-space: pre;
  width: 100%;
  overflow-x: auto;
}

/* Gleiche Inhaltsbreite wie "Über diese Anlage", damit Statuskarte und
   Link-Kacheln in beiden Dialogen identisch sitzen (AQPV-10941). */

.TNIE67XSi6lYHf7gx4cQdIIEn17KQWDA {
  display: flex;
  flex-direction: column;
  gap: 20px;
  width: 512px;
  max-width: 100%;
}

/* Vollbild: DialogContent ist breiter als die Entwurfsbreite — ausfüllen,
   nicht linksbündig stehen lassen. */
@media screen and (max-width: 600px) {
  .TNIE67XSi6lYHf7gx4cQdIIEn17KQWDA {
    width: 100%;
  }
}

/* Rollen in der Karte, auf die Palette abgebildet. Die Regeln unten nennen nur
   diese Rollennamen — so bleibt lesbar, wofür eine Farbe steht, und die
   Zuordnung zur Palette steht an einer Stelle. */

/* Umbruchschwelle der Kachelreihe (3 → 2 → 1). Containerbasiert statt per
   Breakpoint: die Sektion läuft in zwei unterschiedlich breiten Dialogen. */

.OQAVkZzyf4_yBJGmM5L7wPQoqW4vzi4f {
  display: flex;
  align-items: flex-start;
  gap: 13px;
  padding: 14px 16px;
  border: 1px solid var(--status-border);
  border-radius: 10px;
  background: var(--status-bg);
  color: var(--status-fg);
}

/* Titel und Icon tragen dieselbe Farbe wie Icon und Label in der Kopfleiste —
   dieselbe Meldung soll an beiden Stellen gleich aussehen. --status-fg und
   --status-icon bleiben trotzdem getrennte Variablen, weil die zwei Ausnahmen
   unten nur einen der beiden Werte verschieben.

   Als Titeltext liegen diese Farben unter den 4.5:1 der WCAG-Stufe AA:
   UpToDate 4.11:1, UpdateCritical 3.73:1, SupportExpired 3.61:1,
   VersionOutdated 1.91:1. Als Icon reichen 3:1, das erfuellen alle ausser
   VersionOutdated. Bewusst zugunsten des einheitlichen Auftritts entschieden;
   der Fliesstext der Karte laeuft unabhaengig davon in bodyText. */
.iN5MxV_4BgLa1Y1IIZ9Qnw3byNpD4FrU {
  --status-fg: #0A8B2E;
  --status-icon: #0A8B2E;
  --status-bg: #F3F8EF;
  --status-border: #C1DCAA;
}

/* Ausnahme: nur das Icon nimmt die Statusfarbe. clrBlue600Base kommt als Text
   auf 3.63:1 gegen clrBlue100, clrBlue800 dagegen auf 6.12:1. */
.cjK4d4RMPEA6lHr9OiqmghHMGJIeJbMj {
  --status-fg: #0961A0;
  --status-icon: #0288D1;
  --status-bg: #F2F9FE;
  --status-border: #B2D9FB;
}

.PDQcavowX8YjlpPxq0NzwOB1ZSN5n8sk {
  --status-fg: #f9a825;
  --status-icon: #f9a825;
  --status-bg: #FFFBF0;
  --status-border: #FFECC1;
}

.TiPtmKAY_1WCpi51FBWNw23rj9JoPg68 {
  --status-fg: #db5b00;
  --status-icon: #db5b00;
  --status-bg: #fff8eb;
  --status-border: #ffdba8;
}

.F3iQ9sr_kb6eNk84pS2BA_sfDJXEvKYL {
  --status-fg: #e44444;
  --status-icon: #e44444;
  --status-bg: #fdf4f6;
  --status-border: #fbbcbc;
}

/* Neutraler Fallback, kein Fehlerbild — Begründung bei checkFailedPresentation
   in updateInfoPresentation.ts.
   Ausnahme, und der einzige Zustand ohne seinen Statustoken: clrGrey500 ist auf
   die dunkle Kopfleiste ausgelegt und hier selbst als Icon zu schwach (2.71:1).
   clrGrey700 traegt darum beides, mit 4.80:1 auch den Text. */
.a7LwGZJtivuLiN8blmQ2jj6PF8dZw5xF {
  --status-fg: #656C7B;
  --status-icon: #656C7B;
  --status-bg: #F4F4F6;
  --status-border: #CED1D9;
}

/* Platzhalter in Grauwerten; die Mindesthöhe entspricht der fertigen Karte,
   damit der Dialog beim Eintreffen der Antwort nicht springt. */
.SuBdhsVgD1kjQrphRsT38gVfDqKzedeI {
  align-items: center;
  min-height: 108px;
  border-color: #E4E6EC;
  background: #F4F4F6;
  color: #8F96A3;
}

.SuBdhsVgD1kjQrphRsT38gVfDqKzedeI .u3HL18zehAPS0h9l7Ee8VAEH__8Zqoug {
  color: #8F96A3;
}

.u3HL18zehAPS0h9l7Ee8VAEH__8Zqoug {
  flex: none;
  margin-top: 1px;
  font-size: 26px;
  color: var(--status-icon);
}

/* min-width: 0 hebt das automatische Flex-Minimum auf — sonst brechen die
   Versionsspalten nicht um, sondern schieben die Karte aus dem Dialog. */
.zZYsmyteCu6UHend2sMuEABgLEEgzKab {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}

.UOCo04o46K0GY_1nxfscIgQKvd8Wvaim {
  font-size: 15.5px;
  font-weight: 500;
  color: inherit;
}

.tfuf3bzVWhqOKMYSGpjQ1uTZL9LfBD0O {
  font-size: 13px;
  line-height: 1.45;
  color: #434956;
}

.mWI4R5SPe7MMcRedbQIFQb086Fdbxt76 {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 28px;
  margin-top: 6px;
  padding-top: 8px;
  border-top: 1px solid var(--status-border);
}

/* flex: none — die Spalten schrumpfen nicht, sie brechen um. Desktop behält
   damit die natürliche Spaltenbreite. */
.oGNFmo1N2D74VAAKPnjMgPQzXybbBoUj {
  display: flex;
  flex-direction: column;
  gap: 1px;
  flex: none;
}

.vBTDmdKXSJhlQjZwVFgQAa004kZvvLff {
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: #B0B5BF;
}

.zVKuddbo7qnt0bIOEZIAwrq_iVyIUnau {
  font-size: 13px;
  font-variant-numeric: tabular-nums;
  /* Absicherung gegen überlange Versionsstrings ohne Trennstelle. */
  overflow-wrap: anywhere;
}

.TeznEDQjKwdzQHf8kfY8ugAabTU5ypG3 {
  font-weight: 500;
  color: #434956;
}

.FgWzDZWx3IrrMscDPFMoAZunEtPF5K4b {
  font-weight: 500;
  color: inherit;
}

.irNDAXidzC1Y5TgBEMtUgbbUUJHsNMFr {
  font-size: 11.5px;
}

._d78GXpo5WaBWX3A8q4v3gnshw9ibLiz {
  color: #B0B5BF;
}

.Hqj8WeQH20mx6zEusxr4A8VNoqzokmnC {
  font-weight: 500;
  color: inherit;
}

.a4uFfbvEnoa7w6JE5JmBggmLR_LVk0Fe {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(148px, 1fr));
  gap: 10px;
}

.X01Y2nZdLbsGY666vcT1WQYomS4t2f4e {
  display: flex;
  flex-direction: column;
  gap: 3px;
  padding: 11px 13px;
  border: 1px solid #DBE2EA;
  border-radius: 10px;
  background: #ffffff;
  text-decoration: none;
  transition:
    border-color 150ms cubic-bezier(0.2, 0.6, 0.2, 1),
    background-color 150ms cubic-bezier(0.2, 0.6, 0.2, 1);
}

.X01Y2nZdLbsGY666vcT1WQYomS4t2f4e:hover {
  border-color: #0961A0;
  background: #F2F5F8;
}

.ftS9jjwv09KgdYArZKEZswvtdhFfogBj {
  display: flex;
  align-items: center;
  gap: 7px;
  font-size: 13px;
  font-weight: 500;
  color: #0961A0;
}

.TQwokODvCLCHisietsoDwQXwSnNH4WAN {
  flex: none;
  font-size: 17px;
}

.zYfy66Qts0SfolOtzJ8w3yo22N00psJU {
  font-size: 11.5px;
  line-height: 1.4;
  color: #8F96A3;
}

/* Nur Dichte — Kachelspalten und Versionsumbruch laufen containerbasiert. */
@media screen and (max-width: 600px) {
  .OQAVkZzyf4_yBJGmM5L7wPQoqW4vzi4f {
    gap: 10px;
    padding: 12px 13px;
  }

  .u3HL18zehAPS0h9l7Ee8VAEH__8Zqoug {
    font-size: 22px;
  }

  .X01Y2nZdLbsGY666vcT1WQYomS4t2f4e {
    padding: 10px 12px;
  }
}

/* Ob das Label überhaupt gesetzt wird, entscheidet der Button selbst anhand von
   breakpointNarrow — hier gibt es deshalb keine Breite mehr. */

/* Maße der übrigen Icon-Buttons im Menü (Favoriten, Einstellungen): MUI
   IconButton size="large" ergibt 24px Icon plus 12px Innenabstand, den Radius
   setzt das Theme auf 8px. Ohne Label tritt der Statusbutton genauso auf. */

/* Die Kachel ist eine 16%-Tinte der jeweiligen Statusfarbe. Aus der Farbe
   berechnet statt als rgba ausgeschrieben — sonst müsste jeder Zustand seinen
   Farbwert zweimal tragen und beide könnten auseinanderlaufen. */
.yah7xF4obCXzGTkWYs6B8Qc8jjiB6TsW {
  display: flex;
  align-items: center;
  align-self: center;
  gap: 6px;
  height: 26px;
  padding: 0 10px;
  /* Abstand zur AQ-Version rechts daneben — das Icon sitzt im selben Block. */
  margin-right: 0.5rem;
  border: 1px solid var(--toolbar-status-color);
  border-radius: 13px;
  background: color-mix(in srgb, var(--toolbar-status-color) 16%, transparent);
  color: var(--toolbar-status-color);
  font-size: 0.75rem;
  font-weight: 500;
  letter-spacing: 0.02em;
  white-space: nowrap;
  transition: box-shadow 150ms cubic-bezier(0.2, 0.6, 0.2, 1);
}

.yah7xF4obCXzGTkWYs6B8Qc8jjiB6TsW:hover {
  box-shadow: inset 0 0 0 999px rgba(255, 255, 255, 0.08);
}

/* Ruhige Zustände: nur das Icon, keine Kachel. UpToDate braucht keinen Hinweis,
   und CheckFailed ist auf Anlagen ohne Internetzugang dauerhaft — eine Kachel
   wäre dort ein stehender Fehlalarm. */
.gOGGCIkVVNlkZom_e9o9QSraHCgrsUA1,
.v1XAXfwfjIAmUkcziSSz3wNWNh6Yrhyv {
  padding: 0;
  border-color: transparent;
  background: transparent;
}

/* Ohne Label ist keine Kachel zu tragen — der Button richtet sich stattdessen
   nach den übrigen Icon-Buttons der Leiste. justify-content ist nötig, weil die
   feste Breite sonst das Icon linksbündig stehen lässt. */
.WyRFY7MLOa9WKtdjmgQrZJXiRZ3D6f4P {
  justify-content: center;
  width: 48px;
  height: 48px;
  padding: 0;
  border-radius: 8px;
}

.WyRFY7MLOa9WKtdjmgQrZJXiRZ3D6f4P .bJvW73XeS94iDglRZK3QEBJw_nB1iZXH {
  font-size: 24px;
}

/* Die Basisfarben sind auf dieses dunkle Menü ausgelegt, siehe Hinweis in
   variables.css. Die Statuskarte im Dialog nutzt dieselben Werte für ihre Icons;
   nur CheckFailed weicht dort ab, weil der Grauwert auf hellem Grund zu schwach
   ist. Hier braucht es deshalb keine eigenen Varianten. */
.gOGGCIkVVNlkZom_e9o9QSraHCgrsUA1 {
  --toolbar-status-color: #0A8B2E;
}

.unPdESsNV8PRC0T4ngERZwBa147J_zmB {
  --toolbar-status-color: #0288D1;
}

.pFimcgv0wFofCAZvJQSKRA15LQXBfuXW {
  --toolbar-status-color: #f9a825;
}

.Jo0W_Htux976ewG5bKB5fgOTyzz_J8Pb {
  --toolbar-status-color: #db5b00;
}

.iYSQCe_w8_1t7sculeIYeQGpCQQEl_3f {
  --toolbar-status-color: #e44444;
}

.v1XAXfwfjIAmUkcziSSz3wNWNh6Yrhyv {
  --toolbar-status-color: #8F96A3;
}

.bJvW73XeS94iDglRZK3QEBJw_nB1iZXH {
  flex: none;
  font-size: 18px;
}

/* TOP-MENU */
.p88BVk7bLzOxLzlgojVQeQkzdKzajwDZ {
  display: flex;
  align-items: center;

  font-size: 1.5rem;
  font-weight: 500;
  color: white;

  padding-left: 1rem;
  margin: 12px 1rem 12px 0;
  border-left: 1px solid #CED1D9;
}

.fPtSlMKAGmvprzPd9PBlQwdj9M9XbNyL {
  color: #F9C112;
}

@media (max-width: 1280px) {
  .p88BVk7bLzOxLzlgojVQeQkzdKzajwDZ {
    margin-right: 2rem;
  }
}

/* Gleiche Grenze wie der Autologout (theme.breakpoints.up("md") = 960px): dort
   endet die Desktop-Belegung der Leiste, dann trägt auch der Trennstrich
   nichts mehr. */
@media (max-width: 960px) {
  .p88BVk7bLzOxLzlgojVQeQkzdKzajwDZ {
    border-left: none;
    padding-left: 0;
  }
}

/* Zu schmal für "AQ 12" — das Statusicon daneben bleibt. */
@media (max-width: 400px) {
  .VKETu36IBLXuuo4Ru0SzA9oopnx9dmTZ {
    display: none;
  }

  /* Ohne Text trägt der Block nur noch das Statusicon — der rechte Abstand
     stammt dann von dessen eigener Margin. */
  .p88BVk7bLzOxLzlgojVQeQkzdKzajwDZ {
    margin-right: 0;
  }
}

/* LOGIN PAGE */

.aRYobyE_8CEpKzTOs3NYwfgTqCUtClTK {
  display: flex;
  align-items: center;
  color: #486284;
}

.PQYObM3hoRmURxX7OyKwbXmJ0TOe9251 {
  font-weight: 400;
  letter-spacing: 0.5px;
  margin: 0;
  white-space: nowrap;
}

.LlINxOagI3oXkU5eKFo9RgrkopexbG1O {
  font-weight: 600;
  font-size: xx-large;
}

.kV7yq6FcAPH_OXFiyIgrJAZ7cIe97S5y {
  font-size: large;
  letter-spacing: 1.2px;
  font-weight: 500;
  color: #486284;
}

.nRhzWgJMu6ZmRWZLTwr8FwVConpFHO3f {
  color: #F9C112;
  font-weight: 700;
}

.fVmoUUPtv2uBQIxcJN2d2gMIyqQfS0On {
  width: 1px;
  background-color: #486284;
  height: 26px;
  margin: 0 0.75rem;
}

@media (max-width: 960px) {
  .LlINxOagI3oXkU5eKFo9RgrkopexbG1O {
    font-size: large;
  }
  .kV7yq6FcAPH_OXFiyIgrJAZ7cIe97S5y {
    font-size: medium;
  }
}

/* 8px Luft unter dem Element in der 48px-Leiste plus 10px aus der Vorlage. */

/* currentColor kommt aus dem style-Attribut der Komponente (Branding); alle
   abgestuften Toene dieser Datei leiten sich davon ab. */
.pNF2AFHl24a0JBp3npdTFADFaTjICY4K {
  display: flex;
  flex-direction: column;
  justify-content: center;
  /* Gegen align-items: center aus MUI ButtonBase — sonst schrumpft der
     Fortschrittsbalken auf Inhaltsbreite. */
  align-items: stretch;
  align-self: center;
  gap: 4px;
  height: 32px;
  padding: 0 8px;
  border: 1px solid transparent;
  border-radius: 8px;
  background-color: transparent;
  transition: background-color 150ms cubic-bezier(0.2, 0.6, 0.2, 1);
}

.pNF2AFHl24a0JBp3npdTFADFaTjICY4K:hover {
  background-color: color-mix(in srgb, #ffffff 8%, transparent);
}

.a6aygtRa0P_IHfigkMaUgbiJ4jkbmwBT {
  display: flex;
  align-items: center;
  gap: 6px;
  white-space: nowrap;
}

/* Vertritt unterhalb von breakpointLg die Beschriftung der Restzeit. */
.smqVDfORdj0DPFW0XN6gBEE7wrX3shHj {
  flex: none;
  font-size: 14px;
  color: color-mix(in srgb, currentColor 62%, transparent);
}

.mJHdEyWNhwQNZ5XH1jv4Vw5Gd0aHieAw {
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  font-weight: 600;
  color: color-mix(in srgb, currentColor 62%, transparent);
}

/* Nur die Beschriftung der Restzeit weicht dem Uhr-Icon; der Aus-Zustand
   bleibt auf jeder Breite sichtbar. */
.DajFA9fnMVTHOlcQIj1WMwhbQS9Lqwvz {
  display: none;
}

/* tabular-nums: sonst springt die Breite bei jedem Ticken. */
.Fh_aOE_bKA6HTXWUBQXTugY0L57lY0Yb {
  font-size: 13px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.2px;
}

.fuXMkR4eIk4XyumsoEX2AaN0teH8fDOE {
  flex: none;
  font-size: 12px;
  color: color-mix(in srgb, currentColor 40%, transparent);
}

.E07DY_KaSw6_tcjBEK25uwtItjJq0BvL {
  flex: none;
  height: 2px;
  border-radius: 2px;
  background-color: color-mix(in srgb, currentColor 18%, transparent);
  overflow: hidden;
}

/* 900ms auf den Sekundentakt: der Balken laeuft durch, statt zu springen.
   display: block ist Pflicht — als inline-Element ignoriert das span width. */
.NNLhtbZct_wZaN3mtK5GHwfycGTTpqgF {
  display: block;
  height: 100%;
  border-radius: 2px;
  background-color: #F9C112;
  transition:
    width 900ms linear,
    background-color 150ms cubic-bezier(0.2, 0.6, 0.2, 1);
}

/* Muss nach .control:hover stehen — gleiche Spezifitaet, die Reihenfolge
   entscheidet. */
.xFVuPb5U73kSKHc0FgYsGA3nbheOSGjf {
  background-color: color-mix(in srgb, #f88102 18%, transparent);
}

.xFVuPb5U73kSKHc0FgYsGA3nbheOSGjf:hover {
  background-color: color-mix(in srgb, #f88102 26%, transparent);
}

.xFVuPb5U73kSKHc0FgYsGA3nbheOSGjf .Fh_aOE_bKA6HTXWUBQXTugY0L57lY0Yb {
  color: #f88102;
}

.xFVuPb5U73kSKHc0FgYsGA3nbheOSGjf .NNLhtbZct_wZaN3mtK5GHwfycGTTpqgF {
  background-color: #f88102;
}

.nL_67l_OSBdMAQ2xm5QwgP7Jas6VTvfn {
  width: 246px;
  margin-top: 18px;
  border: 1px solid #DBE2EA;
  border-radius: 10px;
  overflow: hidden;
}

.kcmMoqN3JQXN7n4rMAc_MQBa_4XrzzIi {
  padding: 11px 14px;
  border-bottom: 1px solid #E8EDF2;
  font-size: 12.5px;
  font-weight: 600;
  color: #1E293E;
}

.OPBQzx1eHCWLWIW1nmZsQaa0ivJw11Ub {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 11px 14px;
  cursor: pointer;
}

.rRMojhPaatKpWFMm1xWeXgfyYJbx0ES2 {
  font-size: 13px;
  color: #212B35;
}

/* Gleicht die 7px Innenabstand des MUI-Schalters aus. */
.rSBMN_80s_t8GU0U8IF8rQpmkVEFd5Xi {
  margin-right: -7px;
}

.W8URb8Tlc3RFgUAvm0C1ZQFLypy3KAuQ {
  margin: 0;
  padding: 0 14px 13px;
  font-size: 11.5px;
  line-height: 1.45;
  color: #737B8C;
}

@media (min-width: 1280px) {
  .smqVDfORdj0DPFW0XN6gBEE7wrX3shHj {
    display: none;
  }

  .DajFA9fnMVTHOlcQIj1WMwhbQS9Lqwvz {
    display: inline;
  }

  .a6aygtRa0P_IHfigkMaUgbiJ4jkbmwBT {
    gap: 7px;
  }
}

.nVg0hZrP1qt62AtGOZxwHha09otRZtAl {
  display: inline;
  color: #ffffff;
}

/* Reine Anzeige — darf keine Klicks abfangen. */
.Vpumw9JChUHzdhYv84k8QdgmxpfUtb34 {
  pointer-events: none;
}

.Kmv7vIDaqbPGq2mCl8uAEBFW2Atvkxif {
  display: flex;
  flex-direction: row;
}

.Xc13QPkCErc888I3stSfw0Wv3SwUxw5b {
  margin-top: 1rem;
}

.Frrp_IAeNH0gVIxqURkXygsEQl9Aw1se {
  margin-top: 1rem;
  font-size: 0.75rem;
  color: #9e9e9e;
}

.WRbrQvyhcNgfwPMwSd5w1c4JDiY_PuKm {
  margin: 4px;
}

.sydtycbQWrU570XjwAgu7Sh1PVSJnHAK {
  max-height: 32px;
  width: auto;
  max-width: 200px;
}

.bF8r13B0rTElB7V6_HOyowpnidtjAB7m {
  display: flex;
  flex-direction: row;
}

.ZT4NiSfqP2uy7M8rh9QsYgo5MMkO0FuR {
  display: flex;
  flex-direction: column-reverse;
}

.ZT4NiSfqP2uy7M8rh9QsYgo5MMkO0FuR button {
  width: 100%;
}

@media screen and (orientation: portrait) and (max-width: 400px) {
}

@media print {
  .g5iHfo8pAbXIQIpuP1GDQBCGub6bsBPJ {
    display: none;
  }
}

.nIrq8GydZf9s5HBuYD69SgooVOWQFMeN {
  margin-left: -12px;
  margin-right: -8px;
}

.m3mDjrKtUIo1fvPNQfdbQ83atX5lQfAe ._g7MewFE24n_saoRzhsOkA4MGQrXVvmZ {
}

.m3mDjrKtUIo1fvPNQfdbQ83atX5lQfAe .kAdQEYpwKP0FDfMydA3ddVX8slZzf7bM {
  background-color: #CED1D9;
}

.WW0d44UkOUhm7iQHp4vw7yJ9MCpK8FEQ {
  margin: 10px 40px;
}

.hOVr6Ix3czsQyMQck3PIjQTBQfj4W84c {
  margin-bottom: 30px;
}

.XEACaRs85tEKap0iZheLbwkiSios4ipA {
  width: 100%;
  margin-bottom: 0.8rem;
}

@media screen {
  .OMvABrz4iAdsvlfyWbA91ApJeT7ZMNPt {
    display: none;
  }
}

@media print {
  .vJ4rPp75aULCo9CZ7fDyAQsGMpWemWgn {
    display: none;
  }

  .dQ1c6QvU2HOktDsQCHBYnQasNQkea7am {
    margin-top: 80px;
  }
}

.T2LpRAYeHZA0i6o0W0_LcAkIEkKmy77p {
  width: 100%;
}

ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.dwlAsr5cUCczDpMcjCahAxkhrDRXMMMw {
  z-index: 1300;
}

.yUj8d9IXWsIpVq7gLheQYIy1KkuGsgAb {
  display: flex;
  flex-direction: row;
  max-height: 48px;
}

.kGNAzqGreNiw9GVxcMJxwUH5DBYiA1k2 {
  text-decoration: none;
  color: inherit;
}

.lolZQHRecyK6ky3XYpgxHQk3nDxc7aji {
  min-width: 48px;
  max-height: 48px;
  text-transform: none;
  opacity: 1;
  font-size: 0.9rem;
  letter-spacing: 0.7px;
}

.lolZQHRecyK6ky3XYpgxHQk3nDxc7aji button {
  border-radius: 16px;
}

.CdAclrXxrJiZCXJgr7OeQRwgLhBGSZQ4 {
  display: flex;
  flex-direction: row;
  flex-grow: 1;
  margin-right: 1rem;
}

.ZUW6IbtI4bAKKOr6Jjy1YQGuSFF81EGu {
  flex-grow: 1;
  margin-right: 1rem;
  position: relative;
}

.fRaeUIBy9semibq4db_n0wymVkSp562T {
  position: absolute;
  top: 50%;
  left: 10px;
  transform: translateY(-50%);
  display: flex;
  flex-direction: row;
}

.KoJPAj3EOVvYlztv9BNUAAIzphm_TbUm {
  position: absolute;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
}

.h3DyU0ftULp5YLdE4Q90ngMrO5Z1d1a4 {
  z-index: 2000;
  overflow-y: auto;
  max-height: calc(100vh - 3rem);
  min-width: 360px;
}

.h3DyU0ftULp5YLdE4Q90ngMrO5Z1d1a4:nth-last-child(1) {
  border-bottom-left-radius: 16px;
  border-bottom-right-radius: 16px;
}

.DoSNsjq6DCmxFtpWrXigXABWbURLyeer {
  border-bottom-left-radius: 0 !important;
  border-top-left-radius: 0;
  border-top-right-radius: 16px;
}

.L6mx5Fdsekny2AoKp9lgaVjPIXedpwet {
  z-index: 1000;
  position: fixed;
  top: 48px;
  left: 0;
  right: 0;
  bottom: 0;
}

.DbcxAbH9JzeaRUL3RRIGgFslBIhrqStG {
  text-decoration: none;
}

.T_bcKATy7CeKBMEBG91Qwr8vhniwFiyx {
  color: #889EBB;
  margin-right: 16px;
}

/* Center the 24px MUI/mdi (svg) icons on the 32px image icons' vertical axis */
.T_bcKATy7CeKBMEBG91Qwr8vhniwFiyx svg {
  margin-left: 4px;
}

.slf_4M2C57ScvNLkmbOxNwubz75T16Cb,
.h3DyU0ftULp5YLdE4Q90ngMrO5Z1d1a4 a li {
  height: 48px;
  padding-left: 36px;
  padding-right: 24px;
}

.H6DhjYlupYj_lxcAoQWyweY18OBDrAGO {
  height: 48px;
  padding-left: 36px;
  padding-right: 24px;
}

.EhzdXTFBdhg_fp4_iw_77gEVLuJdujq4 {
  margin-right: 40px;
}

.b5Cd1Om8dfpPT_R4cmlDmQjqN5LwC_Mc {
  color: #F9C112;
  min-height: 40px;
  min-width: 40px;
  margin: 2px;
  right: 6px;
}

.b5Cd1Om8dfpPT_R4cmlDmQjqN5LwC_Mc > svg {
  min-height: 40px;
  min-width: 40px;
}

.CVn3DqL8LdTKpp_53qg36A8cqkID3RqO {
  display: block;
  width: 100%;
  text-overflow: ellipsis;
  overflow: hidden;
}

.oUL5GALiL1SKc5JXE1N1wg0e90dc9k7N {
  text-transform: uppercase;
  letter-spacing: 0.8px;
  font-size: smaller;
  font-weight: 500;
  color: #F9C112;
}

.LKWslbQy83IUPQOyb07CdgjiciILNOeF {
  position: relative;
  height: 2px;
  border: none;
  background: none;
}

.LKWslbQy83IUPQOyb07CdgjiciILNOeF::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  height: 1px;
  background: linear-gradient(
    to right,
    transparent,
    rgba(192, 192, 192, 0.4),
    rgba(219, 215, 215, 0.45),
    rgba(192, 192, 192, 0.4),
    transparent
  );
}

.X5nrcvrY3royFc70cqngfwxmPmsfzqEf {
  margin: auto;
}

.S80Deyc1lGDK99CvNrW2Q75KEJZuliSz {
  width: 0.5rem;
}

.mohyvYciQnFtxwvsOIvUAGvbUSFX3aEe {
  margin-bottom: -6px;
  padding-bottom: 10px;
}

/* Compact Menu - drawer */

.QOwrHBAz6nCwmn7yolxcNgqNhD6iP4gO {
  width: 380px;
  height: 100vh;
  position: relative;
  overflow: hidden;
}

._C0PK5xijYJj030G3cwl7QImlLK6JrTP {
  height: 100%;
  overflow: auto;
}

.q3xbrYg1_9s0Ro0EEUomcQ0qJplVDjBh {
  position: unset;
  padding-right: 0;
  padding-top: 1.25rem;
  padding-bottom: 1.25rem;
}

.vTB1Yz9713ABsY4Kn5wLgoQBaY7C9Tyx > span {
  font-size: 1.2rem;
  font-size: 1.2rem;
  font-weight: 500;
}

.Mj5xmYzSsdjJvEAIcpHBlwjc4frgMuj6 {
  position: sticky;
  top: 0;
  right: 0;
  padding-top: 8px;
  display: flex;
  margin-bottom: 1rem;
  justify-content: space-between;
}

.Mj5xmYzSsdjJvEAIcpHBlwjc4frgMuj6 > button:nth-child(1) {
  width: auto;
  padding-left: 16px;
  padding-right: 60px;
}
.Mj5xmYzSsdjJvEAIcpHBlwjc4frgMuj6 > button:nth-child(2) {
  width: auto;
}

.z4BmH1Qu4feIxNO7z1fgZcxRpT_HuY0t {
  font-size: 2.3rem;
  padding-left: 20px;
}

.TiGuOf1j0rYEbuKgpKhLwgf6bNG5Tp6H {
  font-size: 2.3rem;
}

.STYD6VIKN2w6P4Ez5D1XIARlDhV0bVD0 {
  font-size: 2rem;
}

.NYxqKThH6uihYj1WAiUqqQb3rLflkfLE {
  padding-left: 30px;
}

.X8fV07Pl0PZqCtRIGaJYZACisE7cNayo,
.G924x7wjw_OUfLhm_7vh0Quiulb9vT2T {
  width: 32px;
  font-size: 1.8rem;
}
.X8fV07Pl0PZqCtRIGaJYZACisE7cNayo {
  margin-right: 28px;
}

.lMj1shalK0_Y5ZOVLQ_FQgD3vL2pD3M4 {
  margin-right: 10px;
}

.RNWJLI9tVPIBZXZB_KbaPAQ4og_yIDQU {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow-y: auto;
  transform: translateX(380px);
  transition: transform 0.2s ease-in-out, visibility 0.2s ease-in-out;
  visibility: hidden;
  z-index: 10;
}

.RNWJLI9tVPIBZXZB_KbaPAQ4og_yIDQU.sOTxruqYUtQJI1kkPnb2QguX_PaPKy5e {
  transform: translateX(0);
  visibility: visible;
}

.m65QMNYT_VWiHxz9L7tRNgF90OdHrp4k {
  position: sticky;
  top: 0;
  right: 0;
  z-index: 2100;
  display: flex;
  justify-content: space-between;
  width: 100%;
  margin-bottom: 1rem;
  font-size: 1.5rem;
  margin-top: 8px;
}

.JpYavHtYZN2_4a6QQLCcgfsbRwgOoPZM {
  justify-content: space-between;
}
.JX4xiqU35oCc0pazfEg6C0QeWffbkl22 {
  flex-grow: 1;
  font-size: 1.2rem;
  font-weight: 500;
}

@media (max-width: 400px) {
  .RNWJLI9tVPIBZXZB_KbaPAQ4og_yIDQU {
    transform: translateX(100vw);
  }
  .QOwrHBAz6nCwmn7yolxcNgqNhD6iP4gO {
    width: 100vw;
  }
}

@media print {
  .dwlAsr5cUCczDpMcjCahAxkhrDRXMMMw {
    display: none;
  }
  .yUj8d9IXWsIpVq7gLheQYIy1KkuGsgAb {
    display: none;
  }
}

/* Maße und Farben laut Design-Handoff "SystemInfoDialog mit Update-Status"
   (AQPV-10941). Die 560 px Dialogbreite des Entwurfs ergeben sich aus dem
   Inhalt plus dem seitlichen Padding des MUI-DialogContent. */

/* Breite der Labelspalte. Auf schmalen Geräten schrumpft sie, damit für den
   Wert genug Platz bleibt — die Tabelle bleibt immer im Container. */

.TvAhNlgpcPxwZxnxDzSFAbgSJ6UeiP1d {
  display: flex;
  flex-direction: column;
  gap: 20px;
  width: 512px;
  max-width: 100%;
}

/* minmax(0, 1fr) statt 1fr: die Untergrenze von 1fr ist min-content, langer
   Text würde Tabelle und Dialog aufziehen statt umzubrechen. */
.cwEuqB9OL0rC6GqrFj1bAaB4lEf4kz8j {
  display: grid;
  grid-template-columns: 190px minmax(0, 1fr);
  font-size: 13px;
}

.cwEuqB9OL0rC6GqrFj1bAaB4lEf4kz8j > * {
  padding: 9px 0;
  border-bottom: 1px solid #edf0f2;
  /* Für Werte ohne Trennstelle, z. B. lange Anlagen- oder Betreibernamen. */
  overflow-wrap: anywhere;
}

/* Letzte Zeile ohne Trennlinie — je Zeile zwei Grid-Kinder. */
.cwEuqB9OL0rC6GqrFj1bAaB4lEf4kz8j > *:nth-last-child(-n + 2) {
  border-bottom: none;
}

.aNTCD1NZrRX2jdlUYnRRgnbWeDmjoZAi {
  color: #6b7a85;
}

.X19r4t2rdjz2jQ6H1Hw1zQ4GkMeCPhpM {
  color: #2b3b47;
}

.ToeGqw3zZLyeAuQ57M3KZAeJDz0HxJ7A {
  font-variant-numeric: tabular-nums;
}

.K2ZShdlCc_9XluWUqkBiQJ8ibAxRtuy_ {
  font-weight: 500;
}

@media screen and (max-width: 600px) {
  /* Vollbild: DialogContent ist breiter als die Entwurfsbreite — ausfüllen,
     nicht linksbündig stehen lassen. */
  .TvAhNlgpcPxwZxnxDzSFAbgSJ6UeiP1d {
    width: 100%;
  }

  /* Schmalere Labelspalte, dafür explizite Spaltenlücke — bei 190px käme der
     Wert zu kurz. */
  .cwEuqB9OL0rC6GqrFj1bAaB4lEf4kz8j {
    grid-template-columns: 100px minmax(0, 1fr);
    column-gap: 12px;
  }
}