
:root{
  --bg:#f4f5f6; --fg:#2b2b2b; --card-bg:#fff; --border:#e0e0e0; --border-strong:#c7c7c7;
  --accent:#5a9c2f; --accent-fg:#fff; --accent-bg:#eef8e4; --th-bg:#fafafa; --link:#3f7a1f;
  --muted:#555; --disabled-fg:#8a8a8a;
  --warn-bg:#fff3cd; --warn-fg:#6b5300; --warn-border:#e6c65c;
  --success-bg:#d4edda; --success-fg:#155724; --success-border:#c3e6cb;
  --focus-ring:#1a5fb4; --row-hover:#f7f9f5; --shadow:rgba(0,0,0,.1);
}
:root[data-theme="dark"]{
  --bg:#181a1b; --fg:#e7e7e7; --card-bg:#242628; --border:#3a3d40; --border-strong:#4b4f53;
  --accent:#8fd15c; --accent-fg:#12210a; --accent-bg:#25341a; --th-bg:#1f2224; --link:#9be06d;
  --muted:#b3b8bd; --disabled-fg:#75797d;
  --warn-bg:#3a3016; --warn-fg:#ffd873; --warn-border:#6b5626;
  --success-bg:#1c3324; --success-fg:#8fe6a8; --success-border:#2e5a3d;
  --focus-ring:#7fb2f0; --row-hover:#2b2e30; --shadow:rgba(0,0,0,.4);
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme]){
    --bg:#181a1b; --fg:#e7e7e7; --card-bg:#242628; --border:#3a3d40; --border-strong:#4b4f53;
    --accent:#8fd15c; --accent-fg:#12210a; --accent-bg:#25341a; --th-bg:#1f2224; --link:#9be06d;
    --muted:#b3b8bd; --disabled-fg:#75797d;
    --warn-bg:#3a3016; --warn-fg:#ffd873; --warn-border:#6b5626;
    --success-bg:#1c3324; --success-fg:#8fe6a8; --success-border:#2e5a3d;
    --focus-ring:#7fb2f0; --row-hover:#2b2e30; --shadow:rgba(0,0,0,.4);
  }
}
*{box-sizing:border-box;}
body{font-family:Arial,Helvetica,sans-serif;background:var(--bg);margin:0;padding:24px;color:var(--fg);}
h1{font-size:20px;}
a{color:var(--link);}
:focus-visible{outline:3px solid var(--focus-ring);outline-offset:2px;}
.kopfbereich{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px;}
.kopf-aktionen{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:12px;}
.badge{display:inline-block;padding:4px 10px;border-radius:4px;font-size:12px;font-weight:bold;margin-bottom:14px;}
.badge-staging{background:var(--warn-bg);color:var(--warn-fg);border:1px solid var(--warn-border);}
.badge-production{background:var(--success-bg);color:var(--success-fg);border:1px solid var(--success-border);}
.darstellungsmodus{display:inline-flex;border:1px solid var(--border-strong);border-radius:6px;overflow:hidden;}
.darstellungsmodus button{padding:5px 10px;font-size:12px;background:var(--card-bg);color:var(--fg);border:none;border-right:1px solid var(--border-strong);cursor:pointer;border-radius:0;}
.darstellungsmodus button:last-child{border-right:none;}
.darstellungsmodus button[aria-pressed="true"]{background:var(--accent);color:var(--accent-fg);font-weight:bold;}
.logout-form{margin:0;}
.logout-form button{padding:6px 12px;font-size:12px;background:transparent;color:var(--fg);border:1px solid var(--border-strong);}
.logout-form button:hover{background:var(--row-hover);filter:none;}
.kacheln{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:20px;}
.kachel{background:var(--card-bg);border-radius:6px;padding:14px 18px;box-shadow:0 1px 3px var(--shadow);flex:1 1 140px;min-width:140px;max-width:220px;box-sizing:border-box;text-decoration:none;color:inherit;display:inline-block;cursor:pointer;border:2px solid transparent;}
.kachel.aktiv{border-color:var(--accent);background:var(--accent-bg);}
.kachel .zahl{font-size:26px;font-weight:bold;}
.kachel .label{font-size:13px;color:var(--muted);}
.steuerleiste{display:flex;flex-wrap:wrap;align-items:center;gap:14px;margin-bottom:14px;padding:10px 14px;background:var(--card-bg);border:1px solid var(--border);border-radius:6px;font-size:13px;}
.steuerleiste .gruppe{display:inline-flex;align-items:center;gap:6px;}
.steuerleiste select{padding:3px 6px;}
.steuerleiste button{padding:5px 12px;}
.aktualisiert-status{color:var(--muted);}
.aktualisiert-status .fehler-text{color:var(--warn-fg);font-weight:600;}
.hinweise{margin-bottom:14px;}
.hinweise:empty{display:none;}
.hinweis-eintrag{display:flex;align-items:center;gap:8px;padding:8px 12px;margin-bottom:6px;background:var(--warn-bg);color:var(--warn-fg);border:1px solid var(--warn-border);border-radius:6px;font-size:13px;}
.hinweis-eintrag.gelesen{opacity:.55;}
.hinweis-eintrag button.hinweis-link{flex:1;text-align:left;background:none;border:none;color:inherit;font:inherit;cursor:pointer;padding:0;}
.hinweis-eintrag button.hinweis-gelesen-btn{background:none;border:1px solid currentColor;color:inherit;border-radius:4px;padding:2px 8px;font-size:12px;cursor:pointer;}
.suche{margin-bottom:16px;font-size:13px;}
.suche label{margin-right:14px;}
.suche input{width:auto;display:inline-block;margin:0 8px 0 4px;padding:4px 6px;box-sizing:content-box;background:var(--card-bg);color:var(--fg);border:1px solid var(--border-strong);}
.suche button{padding:5px 14px;margin-right:12px;}
.suche a{text-decoration:none;}
.suche .testvorgaenge-feld{margin-right:14px;}
.tabelle-wrapper{overflow-x:auto;}
table{border-collapse:collapse;width:100%;background:var(--card-bg);}
th,td{padding:8px 10px;border-bottom:1px solid var(--border);text-align:left;font-size:14px;}
th{background:var(--th-bg);}
th a{color:var(--fg);text-decoration:none;}
th a:hover{text-decoration:underline;}
tbody tr:hover{background:var(--row-hover);}
.test-badge{display:inline-block;margin-left:6px;padding:1px 6px;font-size:11px;font-weight:bold;border-radius:3px;background:var(--warn-bg);color:var(--warn-fg);border:1px solid var(--warn-border);vertical-align:middle;}
.paginierung{margin-top:14px;padding-top:10px;border-top:1px solid var(--border);font-size:13px;display:flex;flex-wrap:wrap;align-items:center;gap:16px;}
.paginierung .seitengroesse-form{display:inline-flex;align-items:center;gap:6px;}
.paginierung .seitengroesse-form select{width:auto;display:inline-block;margin:0;padding:4px 6px;box-sizing:content-box;}
.paginierung .seitengroesse-form button{padding:4px 10px;}
.paginierung .seiten-info,.paginierung .gefiltert-info{color:var(--muted);}
.paginierung .seiten-nav{display:inline-flex;gap:10px;}
.paginierung .seiten-nav a{text-decoration:none;}
.paginierung .seiten-nav a:hover{text-decoration:underline;}
.paginierung .seiten-nav .deaktiviert{color:var(--disabled-fg);cursor:default;}
.fehler{background:var(--warn-bg);color:var(--warn-fg);border:1px solid var(--warn-border);padding:16px;border-radius:6px;}
.login-box{max-width:340px;margin:60px auto;background:var(--card-bg);padding:24px;border-radius:6px;box-shadow:0 1px 3px var(--shadow);}
input{width:100%;padding:8px;margin:6px 0 14px;box-sizing:border-box;background:var(--card-bg);color:var(--fg);border:1px solid var(--border-strong);border-radius:4px;}
button{padding:8px 16px;background:var(--accent);color:var(--accent-fg);border:none;border-radius:4px;cursor:pointer;}
button:hover{filter:brightness(1.05);}
.verlauf-link{padding:4px 10px;font-size:12px;margin-left:6px;}
.verlauf-panel{position:fixed;inset:0;background:rgba(0,0,0,.5);display:flex;align-items:flex-start;justify-content:center;padding:40px 16px;z-index:100;}
.verlauf-panel[hidden]{display:none !important;}
.verlauf-panel-inner{background:var(--card-bg);color:var(--fg);border-radius:8px;max-width:640px;width:100%;max-height:85vh;overflow-y:auto;padding:20px 24px;box-shadow:0 4px 20px var(--shadow);}
.verlauf-panel-kopf{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px;}
.verlauf-panel-kopf h2{margin:0;font-size:17px;}
.verlauf-panel-kopf button{padding:4px 10px;background:transparent;color:var(--fg);border:1px solid var(--border-strong);}
.verlauf-refresh-hinweis{font-size:12px;color:var(--muted);margin:0 0 14px;}
.verlauf-eintrag{border-left:3px solid var(--border-strong);padding:6px 12px;margin-bottom:8px;font-size:13px;}
.verlauf-eintrag.status-erfolgreich{border-left-color:var(--success-border);}
.verlauf-eintrag.status-fehlgeschlagen{border-left-color:var(--warn-border);}
.verlauf-eintrag .verlauf-typ{font-weight:bold;}
.verlauf-eintrag .verlauf-meta{color:var(--muted);font-size:12px;}
@media (max-width:640px){
  .kopfbereich{flex-direction:column;align-items:flex-start;}
  .steuerleiste{flex-direction:column;align-items:flex-start;}
  .kachel{min-width:120px;}
  .paginierung{flex-direction:column;align-items:flex-start;}
  .verlauf-panel{padding:12px;}
}
