/* ENNO SOLO 0.5.2 | Vollständig vereinheitlichte Oberfläche nach TINA-Vorbild.
   Eine Designquelle für alle Anwendungsseiten, kein nachträglicher CSS-Regelstapel. */
:root {
  color-scheme: light;
  --bg: #f4f7f9;
  --surface: #fff;
  --surface-soft: #eef3f5;
  --surface-hover: #e7eef1;
  --text: #1e2c34;
  --muted: #657680;
  --border: #dce5e9;
  --border-strong: #c9d6dd;
  --accent: #0c535b;
  --accent-hover: #093e45;
  --accent-soft: #dcebed;
  --danger: #ad3442;
  --focus: #2779ad;
  --shadow: 0 3px 18px rgba(28,55,68,.055);
  --radius: 19px;
  --radius-small: 12px;
  --content-width: 1520px;
  --sidebar-width: 390px;
}
*,*::before,*::after{box-sizing:border-box}
html{font-size:16px}
body{margin:0;background:var(--bg);color:var(--text);font:17px/1.55 system-ui,-apple-system,"Segoe UI",Arial,sans-serif}
a{color:var(--accent);text-decoration:none}
a:hover{text-decoration:underline}
button,input,select,textarea{font:inherit}
button{cursor:pointer}
[hidden]{display:none!important}
.wrap{width:min(var(--content-width),calc(100% - 52px));margin-inline:auto}
:where(a,button,input,select,textarea):focus-visible{outline:3px solid var(--focus);outline-offset:3px}

/* Kopfbereich und Anmeldeseite */
.top{background:var(--surface);border-bottom:1px solid var(--border)}
.topin{display:flex;align-items:center;min-height:96px}
.logo{display:inline-flex;align-items:center;gap:14px;color:var(--text);font-size:28px;line-height:1.15;font-weight:850;text-decoration:none}
.logo:hover{text-decoration:none}
.logo small{display:block;margin-top:5px;color:var(--muted);font-size:12px;letter-spacing:.13em;font-weight:600}
.mark{display:grid;place-items:center;flex:0 0 54px;width:54px;height:54px;border-radius:15px;color:white;background:var(--accent);font-size:29px}
.app-frame{min-height:100vh}
.app-content-shell{min-height:100vh;display:flex;flex-direction:column}
.app-header{background:var(--surface);border-bottom:1px solid var(--border)}
.app-header-inner{display:flex;justify-content:space-between;align-items:center;gap:24px;min-height:114px;padding-block:17px}
.app-header-left{display:flex;align-items:center;gap:20px;min-width:0}
.menu-toggle{display:grid;align-content:center;justify-content:center;gap:6px;flex:0 0 58px;width:58px;height:58px;padding:0;border:1px solid var(--border);border-radius:15px;background:var(--surface-soft)}
.menu-toggle span{display:block;width:25px;height:3px;background:var(--text);border-radius:2px}
.menu-toggle:hover{background:var(--surface-hover)}
.app-kicker{color:var(--muted);font-size:13px;font-weight:800;letter-spacing:.12em;text-transform:uppercase}
.app-heading h1{margin:4px 0 0;font-size:32px}
.app-header-user{display:flex;flex-direction:column;align-items:flex-end;text-align:right}
.app-header-user strong{font-size:19px;line-height:1.3}
.app-header-user span{font-size:14px;color:var(--muted)}
.app-main{flex:1;padding-block:30px}
.foot{color:var(--muted);font-size:13px;padding-block:22px 32px}

/* Das Menü ist bei JEDEM Viewport zunächst geschlossen.
   Kein permanenter Desktop-Sidebar-Modus. */
.app-sidebar{position:fixed;z-index:101;inset:0 auto 0 0;width:min(var(--sidebar-width),94vw);padding:24px 26px 26px;background:var(--surface);box-shadow:18px 0 45px rgba(18,36,46,.2);overflow-y:auto;overscroll-behavior:contain;transform:translateX(-105%);visibility:hidden;transition:transform .2s ease,visibility .2s ease}
.nav-open{overflow:hidden}
.nav-open .app-sidebar{transform:translateX(0);visibility:visible}
.sidebar-overlay{position:fixed;z-index:100;inset:0;background:rgba(19,31,38,.42)}
.sidebar-head{display:flex;justify-content:space-between;align-items:center;gap:15px;padding-bottom:20px;border-bottom:1px solid var(--border)}
.sidebar-logo{font-size:27px}
.sidebar-close{display:grid;place-items:center;flex:0 0 52px;width:52px;height:52px;border:0;border-radius:15px;background:var(--surface-soft);color:var(--text);font-size:36px;line-height:1}
.sidebar-close:hover{background:var(--surface-hover)}
.sidebar-user{display:flex;flex-direction:column;gap:2px;padding:20px 4px 22px}
.sidebar-user strong{font-size:20px}
.sidebar-user span{font-size:16px;color:var(--muted)}
.sidebar-nav{display:flex;flex-direction:column;gap:27px}
.nav-section-title{margin:0 8px 12px;color:var(--muted);font-size:14px;font-weight:850;letter-spacing:.065em}
.nav-section-links{display:grid;gap:9px}
.nav-tile{display:flex;align-items:center;min-height:67px;padding:12px 16px;border-radius:15px;border:1px solid transparent;background:var(--surface-soft);color:var(--text);font-weight:800;font-size:20px;line-height:1.25}
.nav-tile:hover{background:var(--surface-hover);text-decoration:none}
.nav-tile.active{background:var(--accent-soft);border-color:#c6dce0;color:#153e45}
.sidebar-logout{margin-top:30px;border-top:1px solid var(--border);padding-top:20px}
.sidebar-logout-btn{width:100%}

/* Typografie und Layout */
h1,h2,h3{letter-spacing:-.018em;line-height:1.2;color:var(--text)}
h1{font-size:34px;margin:0 0 10px}
h2{font-size:25px;margin:0 0 16px}
h3{font-size:20px;margin:0 0 12px}
p{margin:8px 0 16px}
.muted{font-size:15px;color:var(--muted)}
.pagehead{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;flex-wrap:wrap;margin-bottom:24px}
.pagehead h1{margin-bottom:8px}
.panel,.stat{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow)}
.panel{padding:29px;margin-bottom:22px}
.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:19px}
.stat{padding:29px;min-height:130px}
.stat strong{display:block;font-size:36px;line-height:1.1;margin-bottom:8px}
.stat span{color:var(--muted);font-size:16px}
.row{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.actions{display:flex;align-items:center;gap:11px;flex-wrap:wrap}
.split{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:19px}
.notice,.error{padding:17px 19px;border-radius:var(--radius-small);margin:12px 0 21px;font-size:16px}
.notice{background:#e9f6f1;border:1px solid #b6ded0;color:#1a624e}
.error{background:#fff0f1;border:1px solid #f0b5b9;color:#8f2330}

/* Buttons, Formulare und Zustände */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:55px;padding:12px 21px;border:1px solid var(--accent);border-radius:13px;background:var(--accent);color:#fff;font-size:17px;font-weight:750;line-height:1.25;text-decoration:none}
.btn:hover{background:var(--accent-hover);border-color:var(--accent-hover);color:#fff;text-decoration:none}
.btn.alt{background:var(--surface-soft);border-color:var(--border);color:var(--text)}
.btn.alt:hover{background:var(--surface-hover);border-color:var(--border-strong);color:var(--text)}
.btn.danger{background:var(--danger);border-color:var(--danger)}
.btn.danger:hover{background:#8b2935;border-color:#8b2935}
label{display:block;margin:0 0 16px;font-size:16px;font-weight:700}
input:not([type=checkbox]):not([type=radio]):not([type=hidden]),select,textarea{display:block;width:100%;max-width:100%;min-height:53px;margin-top:7px;padding:11px 14px;border:1px solid var(--border-strong);border-radius:12px;background:#fff;color:var(--text);font-size:17px;font-weight:400}
textarea{min-height:110px;resize:vertical}
input[type=checkbox],input[type=radio]{display:inline-block;vertical-align:middle;flex:none;width:21px;height:21px;min-height:0;margin:0 8px 0 0;accent-color:var(--accent)}
label.checkbox{display:flex;align-items:flex-start;gap:8px;line-height:1.4}
label.checkbox input{margin-top:2px}
input:disabled,select:disabled,textarea:disabled,button:disabled{opacity:.58;cursor:not-allowed}
.formgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 20px}
.formgrid.three{grid-template-columns:repeat(3,minmax(0,1fr))}
.formgrid>*,.lineitem>*{min-width:0}
.wide{grid-column:1/-1}
.help,.control-note{color:var(--muted);font-size:14px}
.featuregrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 16px}
.featuregrid>label{display:flex;align-items:center;gap:10px;margin:0;padding:13px 16px;border:1px solid var(--border);border-radius:13px;background:#f8fafb}
.featuregrid input[type=checkbox]{margin:0}
.featuregrid>label input[type=number]{max-width:98px;margin:0 0 0 auto}

/* Datentabellen */
.tablewrap{overflow:auto;max-width:100%;border-radius:14px}
table{border-collapse:collapse;width:100%;font-size:16px}
th,td{padding:15px 13px;text-align:left;vertical-align:top;border-bottom:1px solid var(--border)}
th{background:#f7f9fa;color:var(--muted);font-size:14px;font-weight:750;white-space:nowrap}
td small{display:block;color:var(--muted);margin-top:4px}
tbody tr:hover{background:#f9fbfc}
.right{text-align:right}
.pill{display:inline-flex;border-radius:99px;background:#e3f1ee;color:var(--accent);padding:5px 11px;font-size:13px;font-weight:750}

/* Kalkulation, Angebote */
.lineitem{display:grid;grid-template-columns:minmax(0,2fr) repeat(3,minmax(110px,.9fr)) minmax(90px,.7fr);gap:12px;align-items:end;padding:16px 0;border-bottom:1px solid var(--border)}
.lineitem label{margin:0}
.lineitem .checkbox{display:flex;align-items:center;gap:9px}
.lineitem input[type=checkbox]{margin:0}
.summary{background:#ecf6f3;border:1px solid #c8ded6;border-radius:16px;padding:22px}
.summary strong{font-size:29px}
.quote-head{display:flex;justify-content:space-between;gap:20px}
.price{font-size:23px;font-weight:800}
.quote-paper{background:#fff;border:1px solid var(--border);border-radius:18px;padding:42px;max-width:980px;min-height:850px;margin-inline:auto;box-shadow:var(--shadow)}
.quote-paper h1{font-size:28px}
.quote-paper .brand{display:flex;align-items:center;gap:16px;font-size:24px;font-weight:800;color:var(--accent)}
.offer-logo{width:auto;height:66px;max-width:190px;object-fit:contain}
.quote-paper .sign{margin-top:65px}
.quote-paper table{margin:24px 0}
.quote-paper th{background:#f4f7f8}
.quote-paper td{border-bottom:1px solid #e9eef0}
.install{max-width:760px;padding-top:40px}
.login{max-width:510px;margin:55px auto}
.login h1{font-size:32px}

@media(max-width:1000px){
  .cards{grid-template-columns:repeat(2,minmax(0,1fr))}
  .split{grid-template-columns:1fr}
  .formgrid.three{grid-template-columns:repeat(2,minmax(0,1fr))}
  .lineitem{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .lineitem>div:first-child{grid-column:1/-1}
}
@media(max-width:700px){
  .wrap{width:calc(100% - 28px)}
  .app-header-inner{min-height:98px}
  .app-header-left{gap:13px}
  .app-header-user{display:none}
  .app-heading h1{font-size:26px}
  h1{font-size:28px}
  h2{font-size:22px}
  .cards,.formgrid,.formgrid.three,.featuregrid{grid-template-columns:1fr}
  .panel,.stat{padding:20px}
  .stat{min-height:110px}
  .stat strong{font-size:32px}
  .nav-tile{font-size:18px;min-height:63px}
  .sidebar-logo{font-size:24px}
  .quote-paper{padding:21px;min-height:0}
  .quote-head{flex-direction:column}
  .wide{grid-column:auto}
}
@media(max-width:480px){
  .wrap{width:calc(100% - 22px)}
  .app-header-inner{min-height:90px}
  .app-heading h1{font-size:24px}
  .app-kicker{font-size:11px}
  .menu-toggle{flex-basis:54px;width:54px;height:54px}
  .app-sidebar{width:min(390px,94vw);padding:19px}
  .nav-section-title{font-size:12px}
  .btn{min-height:51px}
  .actions>.btn{flex:1 1 auto}
  .quote-paper .brand{flex-direction:column;align-items:flex-start}
}
@media(prefers-reduced-motion:reduce){.app-sidebar{transition:none}}
@media print{
  @page{size:A4;margin:15mm}
  body{background:#fff;color:#000;font:11pt/1.45 Arial,sans-serif}
  .top,.app-header,.app-sidebar,.sidebar-overlay,.foot,.hide-on-print,.notice{display:none!important}
  .wrap{width:100%}
  .app-main{padding:0}
  .panel,.stat,.quote-paper{box-shadow:none!important}
  .quote-paper{max-width:100%;min-height:0;border:0;padding:0;font-size:11pt}
  .quote-paper h1{font-size:22pt}
  table{font-size:10pt}
  tr{break-inside:avoid}
}

/* ENNO 0.5.4 Quickstart */
.quickstart-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.quickstart-option{border:1px solid var(--line,#d8e2e8);border-radius:16px;padding:22px;background:var(--surface,#fff)}
.quickstart-option h3{margin-top:0}.quickstart-option .btn{margin-top:6px}
.quickstart-choice[hidden]{display:none!important}
.quickstart-option .checkbox{display:flex;align-items:flex-start;gap:12px}
.quickstart-option .checkbox input{width:22px;min-width:22px;height:22px;min-height:22px;margin-top:4px}
@media(max-width:760px){.quickstart-options{grid-template-columns:1fr}.quickstart-option{padding:17px}}

/* ENNO 0.5.7 Besichtigungsdokumentation */
.evidence-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:16px;margin:18px 0}
.evidence-card{background:var(--surface-2);border:1px solid var(--line);padding:14px;border-radius:var(--radius-sm);min-width:0}
.evidence-card img{width:100%;height:165px;object-fit:cover;border-radius:10px;display:block}
.evidence-card audio{width:100%;max-width:100%}
.evidence-card p{overflow-wrap:anywhere;margin:12px 0 3px}
.evidence-card small{color:var(--muted)}
.check-card{display:grid;gap:7px;padding:17px 0;border-bottom:1px solid var(--line)}
.check-resolution{display:flex;align-items:end;flex-wrap:wrap;gap:12px}
.check-resolution label{flex:1;min-width:210px;margin:0}
.check-resolution button{align-self:end}
.details-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:14px}
.details-grid>div{background:var(--surface-2);border-radius:12px;padding:14px}
.details-grid strong,.details-grid span{display:block}
.details-grid span{color:var(--muted)}