:root{--bg:#0b1220;--bg2:#0a0f1c;--card:#111a2e;--text:#e6eaf2;--muted:#9ba7bf;--accent:#4da3ff;--ok:#2dd4bf;--border:rgba(255,255,255,.08);--border2:rgba(255,255,255,.16)}
*{box-sizing:border-box}html,body{height:100%}
body{margin:0;background:radial-gradient(1200px 600px at 80% -10%,#1a2750 0%,transparent 60%),linear-gradient(180deg,var(--bg) 0%,var(--bg2) 100%);color:var(--text);font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
.container{max-width:1200px;margin:0 auto;padding:24px}
.header{display:grid;grid-template-columns:1fr auto;gap:16px;align-items:center;margin-bottom:20px}
.actions{display:flex;gap:10px;justify-content:flex-end;flex-wrap:wrap}
.btn{background:var(--card);border:1px solid var(--border2);color:var(--text);padding:8px 12px;border-radius:12px;text-decoration:none}
.btn:hover{border-color:var(--accent)}.btn-primary{background:linear-gradient(145deg,#87c1ff33,#4da3ff33);border-color:rgba(77,163,255,.5)}
.topbar{display:flex;gap:10px;align-items:center;flex-wrap:wrap;grid-column:1/-1}
.pill{border:1px solid rgba(255,255,255,.12);color:var(--text);padding:8px 12px;border-radius:999px;background:rgba(255,255,255,.04);display:flex;align-items:center;gap:8px}
.ok{background:rgba(45,212,191,.12);border-color:rgba(45,212,191,.3)}
.avatar{width:36px;height:36px;border-radius:50%;object-fit:cover;border:1px solid rgba(255,255,255,.2)}
.grid{display:grid;grid-template-columns:repeat(1,minmax(0,1fr));gap:16px}
@media (min-width:640px){.grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:960px){.grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
.card{position:relative;overflow:hidden;border-radius:18px;background:linear-gradient(180deg,var(--card) 0%,#0c1530 100%);border:1px solid var(--border);box-shadow:0 6px 24px rgba(0,0,0,.35);transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
.card::after{content:"";pointer-events:none;position:absolute;inset:-40%;background:radial-gradient(500px 220px at 120% -20%,rgba(77,163,255,.12),transparent 60%)}
.card:hover{transform:translateY(-3px);box-shadow:0 10px 28px rgba(0,0,0,.45);border-color:rgba(77,163,255,.25)}
.card-inner{position:relative;z-index:2;padding:20px;display:flex;gap:14px;align-items:center}
.icon{flex:0 0 48px;width:48px;height:48px;border-radius:12px;display:grid;place-items:center;background:rgba(77,163,255,.12);border:1px solid rgba(77,163,255,.25)}
.icon svg{width:26px;height:26px}.info{display:flex;flex-direction:column;gap:4px}
.info h3{margin:0;font-size:16px}.info p{margin:0;color:var(--muted);font-size:13px}
.grid > .card > a{position:absolute;inset:0;z-index:1}.row{display:flex;gap:10px;flex-wrap:wrap;margin-top:4px}
.tag{font-size:11px;color:#0c1326;background:linear-gradient(145deg,#87c1ff,#4da3ff);border:1px solid rgba(255,255,255,.35);padding:4px 8px;border-radius:999px}
.field{display:flex;flex-direction:column;gap:6px;margin:8px 0}
.field input,.field select{background:#0e1730;border:1px solid #ffffffaa;color:var(--text);padding:10px 12px;border-radius:12px;outline:none}
.field input:focus,.field select:focus{border-color:#fff}

/* Globale helle Umrandung für Eingabefelder (auch ohne .field) */
.card input[type="text"],
.card input[type="password"],
.card input[type="email"],
.card input[type="search"],
.card input[type="date"],
.card select,
.card textarea,
.input{
  border:1px solid #fff !important;
  background:#0e1730;
  color:var(--text);
  border-radius:12px;
}
.card input[type="text"]:focus,
.card input[type="password"]:focus,
.card input[type="email"]:focus,
.card input[type="search"]:focus,
.card input[type="date"]:focus,
.card select:focus,
.card textarea:focus{
  border-color:#fff !important;
  box-shadow:0 0 0 2px rgba(255,255,255,.08) inset;
}
/* Fix: Klick/Fokus in Formular-Karten */
.card input,.card select,.card textarea,.card button{position:relative;z-index:3}

/* --- click fix nur für Dashboard-Karten im Grid, nicht für Links in Tabellen --- */
.grid > .card{position:relative;}
.grid > .card > a{position:absolute;inset:0;display:block;z-index:10;}
.grid > .card > .card-inner{position:relative;z-index:1;}

/* Tabellen-Styles (sichtbar im Dark-Theme) */
.table-wrap{overflow:auto}
.table{width:100%;border-collapse:separate;border-spacing:0}
.table thead th{position:sticky;top:0;background:#0f1730;color:var(--text);text-align:left;padding:10px;border-bottom:1px solid var(--border2);white-space:normal}
.table tbody td{padding:10px;border-bottom:1px solid var(--border);word-break:break-word;white-space:normal;text-align:left}
.table .text-center{text-align:center}
.copy-icon{opacity:.6;margin-left:6px}