/* Generated by style.php (DB-driven CSS) */

/* ====== THEME COLORS & LAYOUT VARS (:root) ====== */
:root{
  --bg: #f7f7f7;
  --surface: #ffffff;
  --text: #111111;
  --muted: #666666;
  --border: #e5e5e5;
  --primary: #e67e22;
  --primary-hover: #cf6d15;
  --primary-contrast: #ffffff;
  --nav-bg: #CADCEB;
  --nav-text: #0F5289;
  --hero-bg1: #0581BF;
  --hero-bg2: #13A3EC;
  --radius: 12px;
  --gap: 12px;
  --shadow: 0 1px 2px rgba(0,0,0,.04), 0 6px 14px rgba(0,0,0,.06);
  --header-h: 140px;
  --nav-h: 40px;
  --footer-h: 56px;
  --header-h-mobile: 52px;
  --hero-bg: #0581BF;
  --nav-h-mobile: 42px;
}

/* ====== DARK THEME VARS ====== */
@media (prefers-color-scheme: dark){
  :root{
  --bg: #000000;
  --surface: #131720;
  --text: #e9e9e9;
  --muted: #e9e9e9;
  --border: #444444;
  --nav-bg: #0b0d11;
  --nav-text: #e9e9e9;
  --hero-bg1: #0b0d11;
  --hero-bg2: #151923;
  --shadow: none;
  --hero-bg: #0b0d11;
  }
}

/* ====== MOBILE SIZE VARS (optional) ====== */
@media (max-width: 899px){
  :root{
    --header-h: 52px;
    --nav-h: 42px;
  }
}

/* ====== BASE ====== */
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  background:var(--bg); color:var(--text);
  /* Platz für fixierten Header (Header+Navbar) + fixierten Footer reservieren */
  padding-top: calc(var(--header-h) + var(--nav-h));
  padding-bottom: var(--footer-h);
}
a{color:inherit; text-decoration:none}
a:hover{opacity:.9}

/* ====== FIXED HEADER: Headergrafik ====== */
.hero-header{
  position:fixed;
  top:0; left:0; right:0;
  height: var(--header-h);
  z-index:100;
  background: var(--hero-bg1);
  background: linear-gradient(to bottom, var(--hero-bg1), var(--hero-bg2));
  display:flex; align-items:center; justify-content:center;
  padding:0; margin:0; border:0;
  box-shadow: 0 1px 0 var(--border);
}
.hero-header a{display:block; line-height:0; height:100%}
.hero-header img{
  display:block;
  height:100%;
  width:auto;
  max-width:100%;
  object-fit:contain;
}

/* ====== FIXED NAVBAR direkt unter dem Header ====== */
.navbar{
  position:fixed;
  top: var(--header-h);
  left:0; right:0;
  height: var(--nav-h);
  z-index:110;
  background: var(--nav-bg);
  color: var(--nav-text);
  display:flex; align-items:center; justify-content:space-between;
  gap:10px; padding:12px 16px; margin:0; border:0;
  box-shadow: 0 1px 0 rgba(0,0,0,.06) inset, 0 1px 0 rgba(255,255,255,.06);
}
.nav-right{display:flex; align-items:center; gap:12px; flex-wrap:nowrap; overflow-x:auto; -webkit-overflow-scrolling:touch}
.nav-left{display:flex; align-items:center; gap:12px}
.nav-title{font-weight:600; white-space:nowrap}
.nav-links{display:flex; gap:8px; flex-wrap:nowrap; overflow-x:auto; -webkit-overflow-scrolling:touch}
.navlink{
  position:relative;
  padding:8px 14px;
  border-radius:10px; border:1px solid rgba(255,255,255,.14);
  font-size:15px; background:rgba(255,255,255,.08); color:var(--nav-text);
  white-space:nowrap; line-height:1.1;
}
.navlink:hover{background:rgba(255,255,255,.16)}
.subtle{opacity:.8; font-size:14px; white-space:nowrap}

/* ====== LAYOUT ====== */
.wrap{padding:16px; max-width:1300px; margin:0 auto}
.grid-2{display:grid; gap:var(--gap)}
@media(min-width:900px){.grid-2{grid-template-columns:6fr 4fr}}

/* ====== CARDS / ROWS ====== */
.card{
  background:var(--surface); border:1px solid var(--border);
  border-radius:var(--radius); padding:14px; box-shadow:var(--shadow);
}
.row{
  display:flex; align-items:center; justify-content:space-between; gap:var(--gap);
  padding:12px 14px; border:1px solid var(--border); border-radius:var(--radius);
  background:var(--surface); box-shadow:var(--shadow); margin-bottom:var(--gap);
}

/* ====== TEXT UTILS ====== */
.muted{color:var(--muted)}
.h3{font-size:18px; margin:12px 0 6px}
.h2{font-size:20px; margin:0 0 8px}

/* ====== INPUTS / BUTTONS ====== */
input[type="text"], input[type="date"], select{
  width:100%; max-width:360px; font-size:18px; padding:12px 14px;
  border-radius:10px; border:1px solid var(--border);
  background:var(--surface); color:var(--text);
}
.btn{
  font-size:18px; padding:12px 16px; border-radius:12px; border:1px solid var(--border);
  background:var(--surface); color:var(--text); cursor:pointer;
  white-space:nowrap;
}
.btn.primary{
  background:var(--primary); color:var(--primary-contrast); border-color:var(--primary);
}
.btn.primary:hover{background:var(--primary-hover)}
.btn:disabled{opacity:.5; cursor:not-allowed}

/* ====== BADGES ====== */
.badge{
  display:inline-block; padding:4px 8px; border-radius:6px; font-size:14px;
  border:1px solid var(--border); margin-right:10px;
}

/* ====== AD SLOT ====== */
.ad-slot{
  width:100%; min-height:90px; margin:12px 0 6px;
  display:flex; align-items:center; justify-content:center;
  color:var(--muted); border:1px dashed var(--border); border-radius:10px;
  background:var(--surface);
}

/* ====== FIXED FOOTER ====== */
.site-footer{
  position:fixed; left:0; right:0; bottom:0;
  height: var(--footer-h);
  display:flex; align-items:center; justify-content:center;
  padding:0 12px;
  background: var(--surface);
  border-top:1px solid var(--border);
  color: var(--muted);
  font-size:14px;
  z-index: 20;
}
.site-footer a{ text-decoration: underline }

/* ====== RESPONSIVE / LAYOUT FIXES ====== */
.row > div:first-child { flex: 1 1 auto; min-width: 0; }
.row > div:first-child > div { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.row form { flex: 0 0 auto; white-space: nowrap; }

@media (max-width: 640px) {
  .row { flex-wrap: wrap; align-items: flex-start; }
  .row form { order: 2; width: 100%; margin-top: 6px; }
  .row form .btn { width: 100%; }
  .row > div:first-child > div {
    white-space: normal; overflow: visible; text-overflow: clip; word-break: break-word;
  }
}

/* ====== MENÜ-BADGE im Link ====== */
.navlinks-has-badge, .navlink { overflow: visible; }
.navlink { padding-right: 30px; } /* Platz für Badge schaffen */
.navlink .menu-badge{
  position:absolute;
  top: 20px; right: 20px;
  width: 18px; height: 18px; min-width: 18px;
  border-radius: 999px; background: #e53935; color:#fff;
  font-size:12px; font-weight:900; text-align:center; line-height:18px;
  z-index: 999; pointer-events:none;
  box-shadow: 0 0 0 2px rgba(0,0,0,.15);
}