@font-face {
  font-family: 'Roboto Condensed';
  src: url('/static/fonts/RobotoCondensed-Regular.ttf') format('truetype');
  font-weight: 400;
}
@font-face {
  font-family: 'Roboto Condensed';
  src: url('/static/fonts/RobotoCondensed-Bold.ttf') format('truetype');
  font-weight: 700;
}
:root{--bg:#151820;--bg2:#1c2030;--bg3:#232840;--card:#1f2435;--border:rgba(255,255,255,0.07);--text:#e8eaf0;--muted:#6b7280;--green:#22c55e;--red:#ef4444;--accent:#009ed0;--warn:#eab308}
*{margin:0;padding:0;box-sizing:border-box}
body{font-family:'Roboto Condensed',sans-serif;background:transparent;min-height:100vh;color:var(--text);position:relative}#bg-fixed{position:fixed;top:0;left:0;width:100vw;height:100vh;background:url('/static/bg-fluxerum.jpeg?v=1780165926') center bottom/cover no-repeat;z-index:-2;pointer-events:none}#bg-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background:rgba(0,0,0,0.6);z-index:-1;pointer-events:none}
header{background:rgba(15,17,23,0.95);border-bottom:1px solid var(--border);padding:1rem 1.5rem;display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;z-index:100;backdrop-filter:blur(20px)}
.logo{font-size:1.2rem;font-weight:600}.logo span{color:var(--accent)}
nav a{color:var(--muted);text-decoration:none;margin-left:1.5rem;font-size:.85rem;transition:color .2s}nav a:visited{color:var(--muted)}a:visited{color:var(--accent)}
nav a:hover{color:var(--text)}
.container{max-width:900px;margin:0 auto;padding:2rem 1rem}
.card{background-color:rgba(31,36,53,0.5);border:1px solid rgba(0,158,208,0.6);border-radius:16px;padding:1.5rem;margin-bottom:1rem;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);cursor:pointer;transition:all 0.2s ease}
.card:hover{background-color:rgba(31,36,53,0.7);border-color:rgba(0,158,208,0.6)}
.btn{padding:.6rem 1.25rem;border-radius:10px;font-family:'Roboto Condensed',sans-serif;font-size:.85rem;font-weight:500;cursor:pointer;border:none;transition:all .2s;text-decoration:none;display:inline-block}
.btn-primary{background:var(--accent);color:#fff}.btn-primary:hover{opacity:.9}
.btn-danger{background:var(--red);color:#fff}.btn-danger:hover{opacity:.9}
.btn-secondary{background:var(--bg3);color:var(--text);border:1px solid var(--border)}.btn-secondary:hover{background:rgba(255,255,255,.05)}
input,select{width:100%;padding:.65rem .9rem;background:var(--bg3);border:1px solid var(--border);border-radius:10px;color:var(--text);font-family:'Roboto Condensed',sans-serif;font-size:.9rem;margin-bottom:.75rem;outline:none;transition:border .2s}
input:focus,select:focus{border-color:var(--accent)}
label{font-size:.75rem;color:var(--muted);text-transform:uppercase;letter-spacing:.06em;display:block;margin-bottom:.3rem}
.flash{padding:.75rem 1rem;border-radius:10px;margin-bottom:1rem;font-size:.85rem}
.flash.error{background:rgba(239,68,68,.1);border:1px solid rgba(239,68,68,.3);color:#fca5a5}
.flash.success{background:rgba(34,197,94,.1);border:1px solid rgba(34,197,94,.3);color:#86efac}
.flash.info{background:rgba(99,102,241,.1);border:1px solid rgba(99,102,241,.3);color:#a5b4fc}
table{width:100%;border-collapse:collapse;font-size:.85rem}
th{text-align:left;padding:.5rem .75rem;color:var(--muted);font-size:.7rem;text-transform:uppercase;letter-spacing:.06em;border-bottom:1px solid var(--border)}
td{padding:.6rem .75rem;border-bottom:1px solid rgba(255,255,255,.03)}
tr:last-child td{border-bottom:none}
.badge{display:inline-block;padding:.2rem .5rem;border-radius:6px;font-size:.65rem;font-weight:600}
.badge-admin{background:rgba(99,102,241,.2);color:#a5b4fc}
.badge-user{background:rgba(107,114,128,.2);color:#9ca3af}
h1{font-size:1.5rem;font-weight:600;margin-bottom:1.5rem}
h2{font-size:1rem;font-weight:600;margin-bottom:1rem;color:var(--muted);text-transform:uppercase;letter-spacing:.06em}

/* === Layout-Helper === */
.auth-container{max-width:400px;margin:4rem auto}
.page-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:1rem}

/* === Atomare Helfer === */
.center{text-align:center}
.mb-l{margin-bottom:1.5rem}
.mt-s{margin-top:.5rem}
.mt-m{margin-top:1rem}
.w-full{width:100%}

/* === Links === */
.link-muted{color:var(--muted);font-size:.8rem;text-decoration:none}
.link-plain{text-decoration:none;color:var(--text)}
.link-plain-no-color{text-decoration:none}

/* === Portal Page Cards === */
.page-card-icon{font-size:1.5rem;margin-bottom:.75rem;color:var(--accent)}
.page-card-icon i{color:#c9c9c9}
.page-card-title{font-weight:600;margin-bottom:.25rem}
.page-card-desc{font-size:.8rem;color:var(--muted)}
.card-empty{color:var(--muted)}

/* === Lucide Icon-Sizing in Headings === */
.h1-icon{width:1.3rem;height:1.3rem;vertical-align:-3px;margin-right:.4rem;color:var(--accent)}

/* === Admin-Layout === */
.grid-2col{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.h-100{height:100px}
.my-s{margin:.5rem 0}
.section-divider{margin-bottom:1rem;padding-bottom:1rem;border-bottom:1px solid var(--border)}

/* === Admin-Buttons === */
.btn-sm{padding:.3rem .6rem;font-size:.75rem}
.btn-md{padding:.4rem .8rem;font-size:.8rem}

/* === Admin Text-Helper === */
.text-mono{font-family:monospace;font-size:.8rem}
.text-mono-muted{font-family:monospace;font-size:.75rem;color:var(--muted)}
.text-muted-sm{color:var(--muted);font-size:.8rem}
.icon-cell-large{font-size:1.2rem;color:var(--accent)}
.label-bold{font-weight:600;margin-bottom:.5rem}

/* === Admin Form-Elements === */
.check-input{width:auto;margin-bottom:0}
.check-input-tight{width:auto;margin:0}
.check-label{display:inline;text-transform:none;font-size:.85rem;margin-left:.3rem}
.input-flex{flex:1;margin-bottom:0}

/* === Admin Flex/List-Layouts === */
.flex-gap-s{display:flex;gap:.5rem}
.flex-align-row{display:flex;gap:.5rem;align-items:center;margin-bottom:.75rem}
.checkbox-list{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:.5rem}
.checkbox-label{display:flex;align-items:center;gap:.3rem;font-size:.85rem;cursor:pointer}

/* === Admin Icon-Picker === */
.icon-preview{width:2.5rem;height:2.5rem;background:var(--bg3);border:1px solid var(--border);border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:1.2rem}
.icon-grid{display:grid;grid-template-columns:repeat(8,1fr);gap:.35rem;max-height:200px;overflow-y:auto;background:var(--bg3);border:1px solid var(--border);border-radius:10px;padding:.5rem;margin-bottom:.75rem}
.icon-cell{cursor:pointer;width:100%;aspect-ratio:1;background:var(--bg2);border:1px solid var(--border);border-radius:6px;display:flex;align-items:center;justify-content:center;font-size:1.1rem;transition:all .15s}
.icon-cell:hover{background:var(--accent);color:#fff}

/* === Mobile: Bild center top, kein cover (Originalgroesse) === */
@media (max-width: 768px) {
  #bg-fixed {
    background-position: center top;
  }
}