@font-face{font-family:"Poppins";font-weight:400;font-display:swap;src:url("poppins-400.woff") format("woff")}
@font-face{font-family:"Poppins";font-weight:500;font-display:swap;src:url("poppins-500.woff") format("woff")}
@font-face{font-family:"Poppins";font-weight:700;font-display:swap;src:url("poppins-700.woff") format("woff")}
:root{--petrol:#0B3C49;--petrol-2:#0F4B5B;--teal:#0F8C84;--teal-dark:#0B6F69;--mint:#5FD4C8;--mint-soft:#E3F4F2;--ink:#12262C;--muted:#51646A;--bg:#F4F8F8;--line:#DCE7E7;--amber:#9A5B00;--amber-bg:#FFF4E0;--red:#B42318;--red-bg:#FDECEA}
*{box-sizing:border-box}
body{margin:0;font-family:"Poppins",system-ui,sans-serif;font-size:15.5px;line-height:1.6;color:var(--ink);background:var(--bg)}
a{color:var(--teal-dark)}
h1,h2,h3{color:var(--petrol);line-height:1.2;margin:0}
h1{font-size:30px;letter-spacing:-.01em}
h2{font-size:20px;margin:34px 0 14px}
.wrap{max-width:980px;margin:0 auto;padding:0 22px}
.wrap.wide{max-width:1200px}
.bar{background:#fff;border-bottom:1px solid var(--line)}
.bar .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;height:66px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none}
.brand .logo{height:30px;width:auto}
.portal{font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--teal-dark);background:var(--mint-soft);padding:3px 9px;border-radius:99px}
.topnav{display:flex;align-items:center;gap:22px;font-size:14.5px}
.topnav a{color:var(--ink);text-decoration:none;font-weight:500}
.topnav a:hover{color:var(--teal-dark)}
.topnav form{margin:0}
button.link{background:none;border:0;padding:0;font:inherit;color:var(--muted);cursor:pointer}
main.wrap{padding-top:34px;padding-bottom:60px}
.foot{color:var(--muted);font-size:13px;padding:24px 0;border-top:1px solid var(--line)}
.muted{color:var(--muted)}
.small{font-size:13.5px}
.kicker{font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--teal-dark);margin-bottom:6px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:10px 22px;border-radius:99px;border:2px solid var(--teal-dark);background:var(--teal-dark);color:#fff;font:inherit;font-weight:500;text-decoration:none;cursor:pointer}
.btn:hover{background:var(--petrol);border-color:var(--petrol);color:#fff}
.btn.ghost{background:#fff;color:var(--petrol);border-color:var(--line)}
.btn.ghost:hover{border-color:var(--petrol)}
.panel{background:#fff;border:1px solid var(--line);border-radius:16px;padding:24px;margin-bottom:20px}
.panel h2{margin-top:0}
.flash{border-radius:12px;padding:14px 18px;margin-bottom:20px;font-size:14.5px}
.flash.ok{background:var(--mint-soft);color:var(--teal-dark)}
.flash.err{background:var(--red-bg);color:var(--red)}
.flash.warn{background:var(--amber-bg);color:var(--amber)}
.flash.big{font-size:18px}
.flash code{font-size:20px;font-weight:700;letter-spacing:.06em}
.notice{background:var(--amber-bg);color:var(--amber);border-radius:10px;padding:10px 14px;font-size:14px}
.hello{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;flex-wrap:wrap;margin-bottom:22px}
/* Formulare */
.form label{display:flex;flex-direction:column;gap:6px;font-size:14px;font-weight:500;color:var(--petrol);margin-bottom:14px}
.form label small{font-weight:400;color:var(--muted)}
.form input,.form select{font:inherit;font-size:15px;font-weight:400;color:var(--ink);padding:11px 13px;border:1.5px solid var(--line);border-radius:10px;background:#fff;width:100%}
.form input:focus,.form select:focus{outline:none;border-color:var(--teal);box-shadow:0 0 0 3px rgba(15,140,132,.15)}
.form label.check{flex-direction:row;align-items:flex-start;gap:10px;font-weight:400;color:var(--ink)}
.form label.check input{width:18px;height:18px;margin-top:3px;flex:none;accent-color:var(--teal-dark)}
.form label.check.strong{font-weight:500;background:var(--mint-soft);padding:12px 14px;border-radius:10px}
.grid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 18px}
.grid2 .full{grid-column:1/-1}
.auth{max-width:440px;margin:30px auto;background:#fff;border:1px solid var(--line);border-radius:20px;padding:34px}
.auth.wide{max-width:680px}
.auth h1{margin-bottom:8px}
.auth .form{margin-top:22px}
.auth .btn{width:100%}
.num{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:50%;background:var(--petrol);color:var(--mint);font-size:15px;margin-right:10px}
fieldset{border:1px solid var(--line);border-radius:14px;padding:18px 20px 8px;margin:0 0 16px}
legend{font-weight:700;color:var(--petrol);padding:0 6px}
fieldset.mittel p{margin:0 0 10px}
.pinfo{margin:10px 0 12px}
.pcard{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px 18px;background:var(--bg);border-radius:10px;padding:12px 14px;font-size:13.5px}
.pcard div span{display:block;font-size:11.5px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}
.pcard div b{color:var(--petrol)}
.pcard .wide{grid-column:1/-1}
.eigen{margin-top:10px}
.eigen .notice{margin-bottom:12px}
.hidden{display:none}
.savebar{position:sticky;bottom:0;background:rgba(244,248,248,.95);backdrop-filter:blur(6px);padding:14px 0;display:flex;align-items:center;gap:16px;border-top:1px solid var(--line)}
/* Dashboard */
.docs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.doccard{display:grid;grid-template-columns:auto 1fr;gap:6px 16px;align-items:start;background:#fff;border:1px solid var(--line);border-radius:16px;padding:20px;text-decoration:none;color:var(--ink);transition:border-color .15s,box-shadow .15s}
.doccard:hover{border-color:var(--teal);box-shadow:0 10px 30px rgba(11,60,73,.08)}
.dc-ic{grid-row:span 2;width:52px;height:52px;border-radius:14px;background:var(--petrol);color:var(--mint);display:flex;align-items:center;justify-content:center}
.doccard b{display:block;color:var(--petrol);font-size:16.5px}
.doccard small{color:var(--muted);font-size:13.5px}
.dc-go{color:var(--teal-dark);font-weight:500;font-size:14px}
.dl{display:grid;grid-template-columns:140px 1fr;gap:8px 16px;margin:0 0 12px}
.dl dt{color:var(--muted)}
.dl dd{margin:0;font-weight:500}
/* Admin */
.tbl{width:100%;border-collapse:collapse;font-size:14px}
.tbl th{text-align:left;font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);padding:8px 10px;border-bottom:2px solid var(--line)}
.tbl td{padding:12px 10px;border-bottom:1px solid var(--line);vertical-align:top}
.tbl tr.off td{opacity:.6}
.badge{display:inline-block;font-size:12px;font-weight:500;padding:3px 10px;border-radius:99px;background:#EEF2F2;color:var(--muted)}
.badge.ok{background:var(--mint-soft);color:var(--teal-dark)}
.badge.warn{background:var(--amber-bg);color:var(--amber)}
.cols{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:20px;align-items:start}
.inline{display:inline}
.inlineform{display:flex;gap:16px;align-items:flex-end;flex-wrap:wrap}
.inlineform label{margin:0;flex:1;min-width:200px}
code{font-family:ui-monospace,Menlo,monospace}
@media (max-width:760px){
  .grid2,.docs,.cols,.pcard{grid-template-columns:minmax(0,1fr)}
  .topnav{gap:14px;font-size:13.5px}
  .brand .logo{height:24px}
  .portal{display:none}
  h1{font-size:25px}
  .auth{padding:24px}
  .tbl{display:block;overflow-x:auto}
}

.flash.alert{background:#FDECEA;color:#912018;display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px}
.flash.alert form{margin-left:auto}
.btn.sm{min-height:34px;padding:5px 14px;font-size:13.5px}
.warnbox{background:#FDECEA!important;color:#912018!important}
/* Tarife & Bestellung */
fieldset.wrapper{border:0;padding:0;margin:0}
fieldset.wrapper[disabled]{opacity:.6}
input.locked{background:#F4F8F8!important;color:var(--muted)!important}
.panel.tarif{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;flex-wrap:wrap}
.panel.tarif p{margin:6px 0 0}
.tcards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.tcard{position:relative;display:flex!important;flex-direction:column;gap:10px!important;border:2px solid var(--line);border-radius:14px;padding:18px!important;cursor:pointer;font-weight:400!important;color:var(--ink)!important;background:#fff;margin:0!important}
.tcard:has(input:checked){border-color:var(--teal);box-shadow:0 0 0 3px rgba(15,140,132,.15)}
.tcard input{position:absolute;top:16px;right:16px;width:20px!important;height:20px;accent-color:var(--teal-dark)}
.tc-top b{display:block;font-size:17px;color:var(--petrol)}
.tc-top small{color:var(--muted);font-size:13px}
.tc-badge{display:inline-block;font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;background:var(--mint-soft);color:var(--teal-dark);padding:2px 8px;border-radius:99px;margin-bottom:6px}
.tc-preis{font-size:26px;font-weight:700;color:var(--petrol);line-height:1}
.tc-preis small{display:block;font-size:13px;font-weight:400;color:var(--muted);margin-top:6px}
.tc-plus{display:block;font-size:17px;font-weight:700;color:var(--teal-dark);padding:8px 10px;border-radius:10px;background:var(--mint-soft)}
.tc-plus small{font-size:13px;font-weight:400;color:var(--muted)}
.tcard ul{margin:0;padding:0;list-style:none;font-size:13.5px;color:var(--ink);display:flex;flex-direction:column;gap:6px}
.tcard li{display:flex;gap:8px;align-items:flex-start}
.tcard li svg{flex:none;margin-top:2px;color:var(--teal)}
.tcard li.no{color:var(--muted)}.tcard li.no svg{color:#B6C4C6}
.tcard li{margin-bottom:4px}
.form.order .btn{margin-top:8px}
@media (max-width:760px){.tcards{grid-template-columns:minmax(0,1fr)}}
.badge.info{background:#E6F0FA;color:#1D4F86}
.panel.todo{border-left:4px solid var(--teal)}
.panel.todo ul{margin:6px 0 14px;padding-left:20px}
.panel.todo li{margin:4px 0}
.panel.tarif.alert{border-color:#F3B8B0;background:#FDF3F1}
/* Buchhaltung */
.subnav{display:flex;flex-wrap:wrap;gap:6px;margin:-8px 0 26px;padding:6px;background:#fff;border:1px solid var(--line);border-radius:99px;width:max-content;max-width:100%}
.subnav a{padding:7px 16px;border-radius:99px;text-decoration:none;color:var(--ink);font-size:14px;font-weight:500}
.subnav a:hover{background:var(--bg)}
.subnav a.on{background:var(--petrol);color:#fff}
.kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:20px}
.kpi{background:#fff;border:1px solid var(--line);border-radius:16px;padding:18px 20px;display:flex;flex-direction:column;gap:2px}
.kpi span{font-size:13px;color:var(--muted)}
.kpi b{font-size:24px;color:var(--petrol)}
.kpi small{font-size:12.5px;color:var(--muted)}
.kpi.hl{background:var(--mint-soft);border-color:#BFE6E1}
.grid3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 18px}
.sel{font:inherit;font-size:14px;padding:9px 12px;border:1.5px solid var(--line);border-radius:10px;background:#fff}
.tbl .r,.tbl th.r{text-align:right;white-space:nowrap}
.tbl tr.sumrow td{border-top:2px solid var(--petrol);font-size:16px}
.form textarea{font:inherit;font-size:15px;color:var(--ink);padding:10px 12px;border:1.5px solid var(--line);border-radius:10px;width:100%;resize:vertical}
.postbl input{font:inherit;font-size:15px;padding:9px 11px;border:1.5px solid var(--line);border-radius:10px;width:100%}
.postbl td{padding:8px 6px}
.elster .tbl td b{color:var(--petrol)}
@media (max-width:820px){.kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.grid3{grid-template-columns:minmax(0,1fr)}.subnav{border-radius:16px}}
@media print{.bar,.subnav,.foot,form,.btn{display:none!important}.panel{border:0;padding:0}}
.zahlwege{display:flex;flex-direction:column;gap:10px;margin-bottom:14px}
.zahlwege label.check span{line-height:1.5}
.verlust,.bleibt{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:12px;font-size:14.5px}
.verlust li,.bleibt li{padding-left:28px;position:relative;line-height:1.5}
.verlust li::before{content:"✕";position:absolute;left:0;top:0;color:var(--red);font-weight:700}
.bleibt li::before{content:"✓";position:absolute;left:0;top:0;color:var(--teal-dark);font-weight:700}
.form.kuendigen{border-top:1px solid var(--line);padding-top:20px;max-width:620px}