/* Glasbau Lehrte Portal – Oberfläche (kein Framework) */
:root{
  --petrol:#0b3a53;--petrol-2:#0f4a69;--cyan:#1fb6c9;--cyan-soft:#e3f6f8;--ink:#16202a;--ink-2:#4a5a68;--muted:#7a8894;
  --bg:#f3f6f8;--card:#fff;--line:#e2e8ed;--line-2:#cfd8df;--rot:#c62828;--rot-soft:#fdecea;--gruen:#1e8e3e;--gruen-soft:#e6f4ea;--gelb:#b26a00;--gelb-soft:#fff4e0;--blau:#1a5fb4;--blau-soft:#e6eefb;
  --radius:12px;--shadow:0 1px 2px rgba(16,32,42,.06),0 4px 14px rgba(16,32,42,.05);
  --font:"Inter","Segoe UI",system-ui,-apple-system,Roboto,Helvetica,Arial,sans-serif;
}
*{box-sizing:border-box}
html{font-size:15px}
body{margin:0;font-family:var(--font);color:var(--ink);background:var(--bg);line-height:1.45;-webkit-font-smoothing:antialiased}
a{color:var(--petrol-2);text-decoration:none}a:hover{text-decoration:underline}
h1,h2,h3{margin:0;font-weight:650;letter-spacing:-.01em}
h1{font-size:1.45rem}h2{font-size:1.02rem;margin-bottom:.6rem}h3{font-size:.92rem;margin:.6rem 0 .3rem;color:var(--ink-2)}
small,.klein{font-size:.84rem}.muted{color:var(--muted)}.mono{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.92em}
.r{text-align:right}.nowrap{white-space:nowrap}.text-rot{color:var(--rot)}.text-ok{color:var(--gruen)}
code{background:var(--cyan-soft);padding:.05em .35em;border-radius:4px;font-size:.88em}
.ic{width:18px;height:18px;flex:none;vertical-align:-4px}

/* Shell */
.shell{display:flex;min-height:100vh}
.sidebar{width:250px;flex:none;background:linear-gradient(180deg,var(--petrol) 0%,#082c40 100%);color:#d6e6ee;display:flex;flex-direction:column;position:sticky;top:0;height:100vh;z-index:30}
.brand{display:flex;align-items:center;gap:.7rem;padding:1.1rem 1.1rem .9rem;color:#fff;text-decoration:none!important}
.brand__mark{width:38px;height:38px;border-radius:10px;background:rgba(31,182,201,.18);border:1px solid rgba(31,182,201,.45);display:grid;place-items:center;color:#7fe2ee}
.brand__mark .ic{width:22px;height:22px}
.brand__text{display:flex;flex-direction:column;line-height:1.15}.brand__text b{font-size:1rem}.brand__text small{color:#8fb3c4;font-size:.74rem}
.nav{display:flex;flex-direction:column;gap:2px;padding:.4rem .7rem}
.nav__item{display:flex;align-items:center;gap:.7rem;padding:.6rem .7rem;border-radius:9px;color:#cfe0ea;text-decoration:none!important;font-weight:500;font-size:.94rem}
.nav__item:hover{background:rgba(255,255,255,.07);color:#fff}
.nav__item.is-active{background:rgba(31,182,201,.2);color:#fff;box-shadow:inset 3px 0 0 var(--cyan)}
.nav__item--muted{color:#8fb3c4}
.nav__item small{display:block;font-size:.72rem;color:#8fb3c4}
.sidebar__foot{margin-top:auto;padding:.7rem;border-top:1px solid rgba(255,255,255,.08)}
.avatar{width:28px;height:28px;border-radius:50%;background:var(--cyan);color:#06303a;display:grid;place-items:center;font-weight:700;font-size:.85rem;flex:none}
.version{font-size:.7rem;color:#5f8499;padding:.4rem .7rem 0}
.main{flex:1;min-width:0;display:flex;flex-direction:column}
.topbar{display:flex;align-items:center;gap:1rem;padding:.7rem 1.6rem;background:#fff;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:20}
.burger{display:none;background:none;border:0;padding:.3rem;cursor:pointer;color:var(--ink)}
.topsearch{display:flex;align-items:center;gap:.5rem;flex:1;max-width:460px;background:var(--bg);border:1px solid var(--line);border-radius:999px;padding:.35rem .8rem;color:var(--muted)}
.topsearch input{border:0;background:none;flex:1;font:inherit;outline:none;color:var(--ink)}
.topbar__actions{margin-left:auto;display:flex;gap:.5rem}
.content{padding:1.4rem 1.6rem 3rem;max-width:1560px;width:100%}

/* Seitenkopf, Karten */
.page-head{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;margin-bottom:1.1rem;flex-wrap:wrap}
.page-head__actions{display:flex;gap:.5rem;flex-wrap:wrap;align-items:center}
.crumbs{font-size:.82rem;color:var(--muted);margin-bottom:.2rem}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:1.1rem 1.2rem;box-shadow:var(--shadow);margin-bottom:1.1rem}
.card--tabelle{padding:0;overflow:hidden}.card--tabelle>h2{padding:1rem 1.2rem 0}.card--tabelle .toolbar{padding:.9rem 1.2rem 0;margin:0}
.card__head{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;margin-bottom:.5rem}
.empty{padding:1.6rem;text-align:center;color:var(--muted)}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:1.1rem}.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:1.1rem}
.dl{display:grid;grid-template-columns:auto 1fr;gap:.25rem 1rem;margin:0}.dl dt{color:var(--muted);font-size:.86rem}.dl dd{margin:0}.dl--klein{font-size:.88rem}
.liste{margin:0 0 .8rem;padding-left:0;list-style:none}.liste li{padding:.25rem 0}

/* Flash, Badges */
.flash{padding:.7rem 1rem;border-radius:10px;margin-bottom:.9rem;border:1px solid;display:flex;gap:.5rem;align-items:center}
.flash--ok{background:var(--gruen-soft);border-color:#bfe3c8;color:#155c2b}.flash--error{background:var(--rot-soft);border-color:#f3bdb8;color:#8d1c14}
.flash--warn{background:var(--gelb-soft);border-color:#f0d9a8;color:#6b4300}.flash--link{text-decoration:none!important}
.badge{display:inline-block;padding:.12rem .55rem;border-radius:999px;font-size:.76rem;font-weight:600;background:#eef2f5;color:var(--ink-2);white-space:nowrap}
.badge--gross{font-size:.84rem;vertical-align:middle}
.badge--grau{background:#eef2f5;color:var(--ink-2)}.badge--blau{background:var(--blau-soft);color:var(--blau)}.badge--gruen{background:var(--gruen-soft);color:var(--gruen)}
.badge--rot{background:var(--rot-soft);color:var(--rot)}.badge--gelb{background:var(--gelb-soft);color:var(--gelb)}

/* KPIs, Balken */
.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;margin-bottom:1.1rem}
.kpi{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:1rem 1.1rem;box-shadow:var(--shadow);display:flex;flex-direction:column;gap:.15rem;color:var(--ink);text-decoration:none!important}
.kpi__label{font-size:.8rem;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}.kpi__wert{font-size:1.45rem;font-weight:700;letter-spacing:-.02em}
.kpi--rot .kpi__wert{color:var(--rot)}.kpi small{color:var(--muted)}
.bars{display:flex;align-items:flex-end;gap:.6rem;height:150px;padding-top:.5rem}
.bar{flex:1;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;height:100%;gap:.3rem}
.bar__fill{width:100%;max-width:46px;background:linear-gradient(180deg,var(--cyan),#1290a0);border-radius:6px 6px 2px 2px;min-height:0}
.bar small{color:var(--muted);font-size:.72rem}

/* Buttons */
.btn{display:inline-flex;align-items:center;gap:.4rem;padding:.5rem .95rem;border-radius:9px;border:1px solid var(--line-2);background:#fff;color:var(--ink);font:inherit;font-weight:550;cursor:pointer;text-decoration:none!important;line-height:1.2;white-space:nowrap}
.btn:hover{background:#f6f9fb;border-color:#b9c6d0}
.btn--primary{background:var(--petrol);border-color:var(--petrol);color:#fff}.btn--primary:hover{background:var(--petrol-2);border-color:var(--petrol-2)}
.btn--ghost{background:transparent}.btn--ok{background:var(--gruen);border-color:var(--gruen);color:#fff}.btn--ok:hover{background:#19732f}
.btn--warn{background:var(--gelb-soft);border-color:#e9c98a;color:var(--gelb)}
.btn--danger{background:#fff;border-color:#f0b3ae;color:var(--rot)}.btn--danger:hover{background:var(--rot-soft)}
.btn--klein{padding:.3rem .6rem;font-size:.84rem}.btn--block{width:100%;justify-content:center}
.btn[disabled]{opacity:.5;cursor:not-allowed}
.ib{background:none;border:0;padding:.2rem;cursor:pointer;color:var(--ink-2);border-radius:6px;font:inherit}.ib:hover{background:var(--bg)}.ib--rot{color:var(--rot)}
.actions{display:flex;gap:.6rem;flex-wrap:wrap;align-items:center;margin-top:.4rem}.actions--right{justify-content:flex-end}
.inline{display:inline}
.aktionen{display:flex;flex-direction:column;gap:.5rem;margin-top:.6rem}.aktionen form{margin:0}.aktionen__status{display:flex;gap:.3rem;flex-wrap:wrap}

/* Dropdown */
.dropdown{position:relative;display:inline-block}
.dropdown__menu{display:none;position:absolute;right:0;top:calc(100% + 4px);background:#fff;border:1px solid var(--line);border-radius:10px;box-shadow:0 10px 30px rgba(16,32,42,.15);min-width:280px;z-index:40;padding:.3rem}
.dropdown.is-open .dropdown__menu{display:block}
.dropdown__menu a{display:flex;align-items:center;gap:.5rem;padding:.5rem .7rem;border-radius:7px;color:var(--ink);text-decoration:none!important;font-size:.92rem}
.dropdown__menu a:hover{background:var(--cyan-soft)}.dropdown__menu hr{border:0;border-top:1px solid var(--line);margin:.3rem 0}

/* Formulare */
label{display:flex;flex-direction:column;gap:.25rem;font-size:.86rem;color:var(--ink-2);font-weight:550}
label.block{margin-bottom:.8rem}label.check{flex-direction:row;align-items:center;gap:.5rem;font-weight:500}
input:not([type=checkbox]):not([type=radio]):not([type=file]):not([type=color]),select,textarea{width:100%;font:inherit;color:var(--ink);background:#fff;border:1px solid var(--line-2);border-radius:8px;padding:.5rem .65rem;outline:none}
input:focus,select:focus,textarea:focus{border-color:var(--cyan);box-shadow:0 0 0 3px rgba(31,182,201,.18)}
input[disabled],textarea[disabled],select[disabled]{background:#f6f8fa;color:var(--ink-2)}
input[type=color]{width:60px;height:38px;padding:2px;border:1px solid var(--line-2);border-radius:8px;background:#fff}
textarea{resize:vertical;min-height:2.2rem}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:.8rem 1rem}.form-grid--4{grid-template-columns:repeat(4,1fr)}
.span2{grid-column:span 2}.span4{grid-column:span 4}
.form-cols{display:grid;grid-template-columns:1.2fr 1fr;gap:1.1rem;align-items:start}.form-cols--rechts{grid-template-columns:1.5fr 1fr}
.form-stack{display:flex;flex-direction:column}
.hint{color:var(--muted);font-weight:400;font-size:.8rem}
.toolbar{display:flex;gap:.5rem;margin-bottom:.9rem;align-items:center}.toolbar input[type=search]{max-width:420px}.toolbar select{max-width:160px}
.tabs{display:flex;gap:.25rem;flex-wrap:wrap;align-items:center;margin-bottom:.9rem;border-bottom:1px solid var(--line)}
.tab{padding:.55rem .85rem;border-bottom:2px solid transparent;color:var(--ink-2);text-decoration:none!important;font-weight:550;font-size:.92rem;margin-bottom:-1px}
.tab.is-active{border-color:var(--petrol);color:var(--petrol)}.tab--rot{color:var(--rot)}
.tabs__search{margin-left:auto;padding:.3rem 0}.tabs__search input{min-width:240px}

/* Tabellen */
.tbl{width:100%;border-collapse:collapse}
.tbl th{text-align:left;font-size:.76rem;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);padding:.7rem 1rem;border-bottom:1px solid var(--line);background:#fafcfd}
.tbl td{padding:.7rem 1rem;border-bottom:1px solid var(--line);vertical-align:top}
.tbl tbody tr:last-child td{border-bottom:0}
.tbl--klein th,.tbl--klein td{padding:.5rem .7rem;font-size:.9rem}
.row-link{cursor:pointer}.row-link:hover td{background:#f7fbfc}
.is-inaktiv td{opacity:.55}

/* Kundenwahl / Vorschläge */
.kundenwahl,.artikelwahl{position:relative}
.suggest{position:absolute;left:0;right:0;top:100%;background:#fff;border:1px solid var(--line);border-radius:10px;box-shadow:0 10px 30px rgba(16,32,42,.15);z-index:35;max-height:320px;overflow:auto;padding:.3rem}
.suggest button{display:block;width:100%;text-align:left;background:none;border:0;padding:.5rem .7rem;border-radius:7px;font:inherit;cursor:pointer;color:var(--ink)}
.suggest button:hover,.suggest button.is-hover{background:var(--cyan-soft)}.suggest button small{display:block;color:var(--muted);font-size:.8rem}
.artikelwahl{min-width:360px;flex:1;max-width:520px}

/* Beleg-Editor */
.beleg-layout{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:0 1.1rem;align-items:start}.beleg-side{grid-column:2;grid-row:1 / span 3}
.beleg-side .card{padding:1rem 1.1rem}
.card--zahlung{border-color:#bfe3c8;background:#f6fcf7}
.page-head--beleg h1{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap}
table.pos{table-layout:fixed}
table.pos th,table.pos td{padding:.45rem .3rem}
table.pos th:first-child,table.pos td:first-child{padding-left:.8rem}
.pos__nr{width:72px}.pos__menge{width:70px}.pos__einheit{width:64px}.pos__masse{width:122px}.pos__preis{width:92px}.pos__ust{width:50px}.pos__summe{width:98px}.pos__akt{width:80px}
.masse{display:flex;align-items:center;gap:.15rem}.masse input{width:50px;padding:.35rem .3rem}.masse span{color:var(--ink-2)}.pos__m2{display:block;text-align:right;margin-top:.15rem;font-size:.78rem}
.pos__zeile--titel .pos__masse input,.pos__zeile--text .pos__masse input{visibility:hidden}
.pos__nummer{display:block;font-weight:600;color:var(--ink-2);font-size:.9rem;padding:.3rem 0 .1rem}
.pos__typ{font-size:.72rem;padding:.1rem .15rem;color:var(--muted);width:100%}
.pos input,.pos textarea{padding:.4rem .5rem;font-size:.92rem}
.pos__beschr{margin-top:.3rem;font-size:.86rem!important;color:var(--ink-2)}
.pos__zeile--titel .pos__bez{font-weight:700}
.pos__zeile--titel .pos__menge input,.pos__zeile--titel .pos__einheit input,.pos__zeile--titel .pos__preis input,.pos__zeile--titel .pos__ust input,.pos__zeile--text .pos__menge input,.pos__zeile--text .pos__einheit input,.pos__zeile--text .pos__preis input,.pos__zeile--text .pos__ust input{visibility:hidden}
.pos__zeile--titel td{background:#f7f9fb}
.pos__gesamt{font-weight:600;display:block;padding-top:.4rem}
.pos__akt .ib{padding:.15rem}.pos__hinzu{display:flex;gap:.4rem;padding:.7rem .8rem;border-top:1px dashed var(--line)}
.summen{margin:.6rem 0 0 auto;max-width:380px;padding:.3rem .8rem 0}
.summen>div{display:flex;justify-content:space-between;padding:.25rem 0}.summen>div[data-sum-steuern]{display:block;padding:0}.summen>div>div{display:flex;justify-content:space-between;padding:.2rem 0;color:var(--ink-2)}
.summen__total{border-top:2px solid var(--petrol);margin-top:.3rem;padding-top:.5rem!important;font-size:1.1rem;font-weight:700}
.mailzeile{padding:.45rem 0;border-bottom:1px solid var(--line);font-size:.88rem}.mailzeile:last-child{border-bottom:0}

/* Admin */
.admin-karten{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:1rem}
.admin-karte{display:flex;flex-direction:column;gap:.3rem;color:var(--ink);text-decoration:none!important;margin:0}
.admin-karte p{margin:0;color:var(--ink-2);font-size:.9rem;flex:1}.admin-karte .badge{align-self:flex-start;margin-top:.4rem}
.admin-karte:hover{border-color:var(--cyan)}

/* Login */
body.auth{background:radial-gradient(1200px 600px at 10% -10%,#135a7c 0%,var(--petrol) 45%,#071f2d 100%);min-height:100vh;display:grid;place-items:center;padding:1rem}
.auth__wrap{width:100%;max-width:420px}
.auth__brand{display:flex;align-items:center;gap:.8rem;color:#fff;margin-bottom:1.2rem;justify-content:center}.auth__brand small{display:block;color:#8fb3c4;font-size:.8rem}
.auth__card{padding:1.6rem}.auth__card h1{margin-bottom:1rem}.auth__card label{margin-bottom:.9rem}

/* Mobil */
@media (max-width:1100px){.kpis{grid-template-columns:1fr 1fr}.grid3{grid-template-columns:1fr}.beleg-layout{grid-template-columns:1fr}.form-cols,.form-cols--rechts{grid-template-columns:1fr}}
@media (max-width:860px){
  .sidebar{position:fixed;left:-260px;transition:left .2s;box-shadow:none}.sidebar.is-open{left:0;box-shadow:0 0 0 100vw rgba(0,0,0,.35)}
  .burger{display:inline-flex}.content{padding:1rem}.grid2{grid-template-columns:1fr}.kpis{grid-template-columns:1fr 1fr}
  .form-grid,.form-grid--4{grid-template-columns:1fr}.span2,.span4{grid-column:auto}.topbar__actions .btn span{display:none}
  .topsearch{display:none}html{font-size:14px}.card--tabelle{overflow-x:auto}.tbl{min-width:640px}.artikelwahl{min-width:0}
  table.pos{min-width:900px}
}
/* Import */
.import-satz{padding-bottom:.8rem}.import-kunde{margin-top:.8rem;padding-top:.6rem;border-top:1px dashed var(--line)}.import-kunde h3{display:flex;align-items:center;gap:.4rem;margin:0 0 .5rem}
.import-pos{margin-top:.8rem;border-top:1px dashed var(--line);padding-top:.5rem}.import-pos summary{cursor:pointer;font-weight:600;color:var(--ink-2)}.pos-import td{padding:.25rem .3rem}.pos-import input{padding:.3rem .45rem;font-size:.88rem}.pos-import input.klein{margin-top:.2rem;font-size:.8rem}
.protokoll{white-space:pre-wrap;font-size:.8rem;max-height:420px;overflow:auto;background:var(--bg);padding:.6rem;border-radius:8px}

/* 0.3.0: Briefe, Ablage, Stammkunden */
.stern{color:#e0a800;font-size:1.05em}
.grid-briefe{display:grid;grid-template-columns:1fr 300px;gap:1rem;align-items:start}@media (max-width:1100px){.grid-briefe{grid-template-columns:1fr}}
.vorlage-zeile{padding:.3rem 0;border-bottom:1px solid var(--line);font-size:.9rem}.vorlage-zeile:last-child{border-bottom:0}
.inline-details{display:inline-block;position:relative}.inline-details summary{list-style:none;cursor:pointer}.inline-details summary::-webkit-details-marker{display:none}
.inline-details[open] .form-grid--mini{position:absolute;right:0;top:110%;z-index:20;background:#fff;border:1px solid var(--line);border-radius:10px;padding:.7rem;box-shadow:0 8px 24px rgba(0,0,0,.12);min-width:280px;grid-template-columns:1fr;gap:.4rem}
.tabs__search select{padding:.45rem .5rem;margin-right:.4rem}
.nowrap{white-space:nowrap}
.jahr-vergleich{display:grid;grid-template-columns:repeat(3,1fr);gap:.8rem;margin:.4rem 0 .8rem}.jahr-vergleich>div{background:var(--bg);border-radius:10px;padding:.6rem .8rem}.jahr-vergleich b{display:block;font-size:1.25rem;margin:.1rem 0}.jahr-vergleich small{color:var(--ink-2)}
.bars--jahre{height:120px;margin-bottom:.8rem}.bars--jahre .bar small{font-size:.65rem}.bar--akt .bar__fill{background:#e0a800}
.grid2--breit{grid-template-columns:1.7fr 1fr}.grid2--breit .card{overflow-x:auto}@media (max-width:1100px){.grid2--breit{grid-template-columns:1fr}.jahr-vergleich{grid-template-columns:1fr}}
.text-ok{color:var(--gruen)}
.pos td{position:relative}.suggest--pos{top:auto;left:.3rem;right:auto;min-width:min(520px,80vw);margin-top:-.2rem}
.tbl--jahre td,.tbl--jahre th{padding:.4rem .45rem;white-space:nowrap;font-size:.84rem}