:root{
  --kc48-sidebar:244px;--kc48-rail:72px;--kc48-bg:#f3f1ed;--kc48-panel:#fff;
  --kc48-ink:#202428;--kc48-muted:#697077;--kc48-line:#ddd8d0;--kc48-accent:#d9782a;
  --kc48-dark:#171b1e;--kc48-dark-2:#22272b;--kc48-shadow:0 8px 28px rgba(25,30,34,.08)
}
*,*::before,*::after{box-sizing:border-box}
html,body{max-width:100%;overflow-x:hidden}
body{background:var(--kc48-bg);color:var(--kc48-ink)}
img,svg,video,canvas{max-width:100%}
.app-shell{display:grid!important;grid-template-columns:var(--kc48-sidebar) minmax(0,1fr)!important;min-height:100dvh;transition:grid-template-columns .22s ease}
.sidebar{position:sticky!important;top:0;width:auto!important;height:100dvh;background:var(--kc48-dark)!important;color:#fff;border:0!important;overflow:hidden;transition:width .22s ease,transform .22s ease}
.sidebar .brand{min-height:88px;padding:16px 14px!important;border-bottom:1px solid rgba(255,255,255,.09);gap:11px}
.sidebar .brand img{width:44px;height:44px;flex:0 0 44px}
.sidebar .brand strong{color:#fff;white-space:nowrap}.sidebar .brand small{color:#aeb5ba;white-space:nowrap}
.sidebar nav{padding:10px 9px!important;overflow-y:auto;overflow-x:hidden;scrollbar-width:thin}
.sidebar .nav-item{display:flex!important;align-items:center;gap:11px;width:100%;min-height:40px;padding:8px 10px!important;border-radius:7px!important;color:#d5d9dc!important;background:transparent!important;border:1px solid transparent!important;white-space:nowrap;text-align:left;font-size:.88rem!important}
.sidebar .nav-item:hover{background:var(--kc48-dark-2)!important;color:#fff!important}.sidebar .nav-item.active{background:rgba(217,120,42,.15)!important;color:#fff!important;border-color:rgba(217,120,42,.35)!important;box-shadow:inset 3px 0 var(--kc48-accent)}
.kc48-nav-icon{display:grid;place-items:center;width:26px;height:26px;flex:0 0 26px;color:#c9cdd0;font-size:1.05rem}.nav-item.active .kc48-nav-icon{color:#f2a15d}
.sidebar-footer{border-top:1px solid rgba(255,255,255,.09)!important;color:#b4bbc0!important;padding:12px 14px!important}
.main-column{width:auto!important;min-width:0!important;max-width:none!important;margin-left:0!important;overflow:visible!important}
.topbar{position:sticky!important;top:0;z-index:45;min-height:76px;padding:11px 22px!important;background:rgba(255,255,255,.94)!important;border-bottom:1px solid var(--kc48-line)!important;backdrop-filter:blur(14px);gap:14px}
.topbar h1{font-size:1.4rem!important;line-height:1.15;margin:1px 0}.topbar .eyebrow{font-size:.67rem!important}.topbar-actions{min-width:0;flex-wrap:wrap!important;justify-content:flex-end}.topbar-actions select{min-width:210px;max-width:320px}
#menuToggle{display:grid!important;place-items:center!important;flex:0 0 42px;width:42px!important;height:42px!important;padding:0!important;background:#fff!important;color:var(--kc48-ink)!important;border:1px solid var(--kc48-line)!important;box-shadow:0 2px 8px rgba(0,0,0,.06);font-size:0!important}
#menuToggle::before{content:'‹';font-size:1.8rem;line-height:1;transform:translateY(-1px)}
.content{width:100%!important;max-width:1600px!important;margin:0 auto;padding:20px 22px 36px!important;overflow:visible!important}.view,.view>div,.card,.grid>*{min-width:0;max-width:100%}
.view[data-view-panel="needs"]>#needsView{width:min(100%,1420px);margin-inline:auto}
.view[data-view-panel="needs"] .kc41-entry,.view[data-view-panel="needs"] .kc43-step-nav,.view[data-view-panel="needs"] #needsForm{width:100%;margin-inline:auto}
.card,.wf40-customer-list,.kc-login-card{border:1px solid var(--kc48-line)!important;border-radius:9px!important;box-shadow:var(--kc48-shadow)!important;background:var(--kc48-panel)!important}.card{padding:18px!important;margin-bottom:14px!important}.card h2{font-size:1.1rem;margin-bottom:10px}.section-head{gap:12px!important;margin-bottom:14px!important}
button,input,select,textarea{border-radius:6px!important}button{min-height:38px;padding:8px 13px!important}input,select,textarea{max-width:100%;min-width:0}
.grid{gap:12px!important}.grid-4{grid-template-columns:repeat(4,minmax(0,1fr))!important}.grid-3{grid-template-columns:repeat(3,minmax(0,1fr))!important}.grid-2{grid-template-columns:repeat(2,minmax(0,1fr))!important}
.button-row{display:flex;flex-wrap:wrap;gap:8px!important}.table-wrap,.scroll-table{max-width:100%;overflow:auto}

/* Schmale Material- und Farbauswahl: der Rahmen folgt der eigentlichen Probe. */
.material-grid{grid-template-columns:repeat(auto-fill,minmax(230px,1fr))!important;gap:10px!important}
.material-selection-card{grid-template-columns:66px minmax(0,1fr)!important;gap:10px!important;padding:9px!important;align-items:center!important}
.material-preview{width:66px!important;height:66px!important;min-height:66px!important;padding:2px!important;border:1px solid var(--kc48-line)!important;border-radius:5px!important;overflow:hidden}
.material-preview img{width:100%!important;height:100%!important;object-fit:cover!important;border-radius:3px!important}
.material-tile{grid-template-columns:58px minmax(0,1fr)!important;gap:9px!important;padding:8px!important}.material-swatch{width:58px!important;height:58px!important;min-height:58px!important;padding:2px!important;border-radius:5px!important}
.kc-color-choice{padding:5px!important;gap:6px!important;border-radius:6px!important}.kc-color-choice span{width:30px!important;height:30px!important;border-radius:4px!important;border:2px solid #fff!important;outline:1px solid var(--kc48-line)}
.v12-card,.selection-card{padding:10px!important;border-radius:7px!important}.v12-card img,.selection-card img{max-height:110px!important;object-fit:cover}

.kc43-step-nav{top:76px!important;grid-template-columns:repeat(8,minmax(130px,1fr))!important;padding:7px!important;border-radius:8px!important;box-shadow:0 5px 18px rgba(25,30,34,.08)}
.kc43-step-nav button{padding:7px 8px!important;min-height:42px!important;font-size:.76rem!important}.kc43-step-nav button span{width:22px!important;height:22px!important}
.kc47-carat-card,.kc47-assistant{max-width:none!important}.kc47-preview,.kc47-plan-preview{min-height:360px!important;max-height:62vh!important}.kc47-preview img,.kc47-plan-preview img{width:100%;height:100%;object-fit:contain}

.kc-password-field{position:relative;display:block;width:100%}.kc-password-field input{width:100%!important;padding-right:46px!important}.kc-password-toggle{position:absolute!important;right:5px;top:50%;transform:translateY(-50%);width:34px!important;height:32px!important;min-height:32px!important;padding:0!important;background:transparent!important;color:#4e565c!important;border:0!important;box-shadow:none!important;display:grid!important;place-items:center}.kc-password-toggle:hover{background:#eeeae4!important}.kc-password-toggle svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8}

body.kc-sidebar-collapsed .app-shell{grid-template-columns:var(--kc48-rail) minmax(0,1fr)!important}
body.kc-sidebar-collapsed .sidebar .brand>div,body.kc-sidebar-collapsed .kc48-nav-label,body.kc-sidebar-collapsed .sidebar-footer{display:none!important}
body.kc-sidebar-collapsed .sidebar .brand{justify-content:center;padding-inline:8px!important}body.kc-sidebar-collapsed .sidebar nav{padding-inline:8px!important}body.kc-sidebar-collapsed .sidebar .nav-item{justify-content:center;padding-inline:7px!important}
body.kc-sidebar-collapsed #menuToggle::before{content:'›'}

@media(max-width:1280px){.grid-4{grid-template-columns:repeat(2,minmax(0,1fr))!important}.content{padding-inline:16px!important}.wf40-list-grid,.wf40-customer-grid{grid-template-columns:minmax(260px,.9fr) minmax(0,1.4fr)!important}}
@media(max-width:900px){
  html,body,.app-shell,.main-column,.content,.view,.view>div{width:100%!important;max-width:100%!important;min-width:0!important}
  .app-shell{display:block!important}.sidebar{position:fixed!important;left:0;top:0;z-index:90;width:min(300px,88vw)!important;transform:translateX(-105%);box-shadow:18px 0 45px rgba(0,0,0,.3)}.sidebar.open{transform:translateX(0)}
  body.kc-sidebar-collapsed .sidebar .brand>div,body.kc-sidebar-collapsed .kc48-nav-label,body.kc-sidebar-collapsed .sidebar-footer{display:block!important}body.kc-sidebar-collapsed .sidebar .nav-item{justify-content:flex-start}
  .topbar{display:grid!important;grid-template-columns:auto minmax(0,1fr);padding:9px 12px!important}.topbar>div:nth-child(2){min-width:0}.topbar .eyebrow{display:none}.topbar h1{font-size:1.1rem!important;overflow-wrap:anywhere}.topbar-actions{grid-column:1/-1;width:100%;order:3;display:grid!important;grid-template-columns:minmax(0,1fr) auto auto;margin-left:0!important}.topbar-actions select{min-width:0!important;max-width:none!important;width:100%}
  .content{padding:12px!important}.card,form,fieldset,section,article,.section-head{min-width:0!important;max-width:100%!important}
  .kc43-step-nav{position:sticky!important;top:116px!important;display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;overflow:visible!important}.kc43-step-nav button{min-width:0!important;white-space:normal!important;overflow-wrap:anywhere}
  .wf40-list-grid,.wf40-customer-grid{grid-template-columns:1fr!important}
  .table-wrap,.scroll-table,.wf20-calendar{width:100%;max-width:100%;overflow:visible!important}table{width:100%!important;min-width:0!important;table-layout:fixed}th,td{padding:7px 5px!important;overflow-wrap:anywhere;word-break:break-word}
  .wf20-weekdays,.wf20-month-grid{width:100%!important;min-width:0!important;grid-template-columns:repeat(7,minmax(0,1fr))!important}.wf20-tabs,.stepper{flex-wrap:wrap!important;overflow-x:visible!important}.wf20-tabs button,.step{white-space:normal!important}
  .dynamic-row-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}.project-list .project-card,.wf39-front-card,.wf39-device-card{min-width:0!important}
  dialog,.modal-card{width:min(94vw,760px)!important;max-width:94vw!important}.kc45-update-warning{left:10px!important;right:10px!important;max-width:none!important}
}
@media(max-width:620px){
  .topbar-actions{grid-template-columns:minmax(0,1fr) auto!important}.topbar-actions #adminPlus{display:none}.topbar-actions button{padding-inline:9px!important}
  .grid,.grid-2,.grid-3,.grid-4,.dynamic-row-grid,.wf20-event{grid-template-columns:1fr!important}.card{padding:12px!important}.content{padding:8px!important}
  .kc43-step-nav{top:112px!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:5px!important;padding:5px!important}.kc43-step-nav button{font-size:.72rem!important;padding:6px!important}.kc43-step-nav button span{width:20px!important;height:20px!important}
  .kc47-preview,.kc47-plan-preview{min-height:220px!important}.material-grid{grid-template-columns:1fr!important}
  .section-head,.kc47-carat-head,.wf40-detail-head{align-items:stretch!important;flex-direction:column!important}.button-row{align-items:stretch!important}.button-row>button,.button-row>.button,.button-row>.button-link{flex:1 1 100%;width:100%!important}
  .sync-grid,.kc-sync-grid{grid-template-columns:1fr!important}.stats,.wf38-kpis{grid-template-columns:1fr 1fr!important}
  table{font-size:.72rem!important}th,td{padding:5px 3px!important}.wf20-weekdays,.wf20-month-grid{gap:2px!important;font-size:.68rem}
}
@media(max-width:420px){.topbar h1{font-size:1rem!important}.topbar-actions{grid-template-columns:1fr!important}.topbar-actions button{width:100%!important}.stats,.wf38-kpis{grid-template-columns:1fr!important}.v12-program-grid,.v12-card-grid,.v13-product-grid{grid-template-columns:1fr!important}}
@media(max-width:900px) and (orientation:landscape){
  .topbar{grid-template-columns:auto minmax(150px,.65fr) minmax(0,1.35fr)!important;min-height:58px!important}.topbar-actions{grid-column:3;order:initial;grid-template-columns:minmax(0,1fr) auto!important}.topbar-actions #adminPlus{display:none}.content{padding-top:8px!important}.kc43-step-nav{top:58px!important;grid-template-columns:repeat(4,minmax(0,1fr))!important}
}

/* Letzte Schutzschicht: dynamisch erzeugte Altmodule dürfen nie die Seite verbreitern. */
body.kc48-viewport-repair main *,body.kc48-viewport-repair dialog *{min-width:0;max-width:100%}
body.kc48-viewport-repair .kc48-overflow-item{width:100%!important;min-width:0!important;max-width:100%!important;white-space:normal!important;overflow-wrap:anywhere!important}
