@font-face{font-family:DINOT;src:url("/fonts/DINOT-Regular.ttf") format("truetype");font-weight:400}
@font-face{font-family:DINOT;src:url("/fonts/DINOT-Bold.ttf") format("truetype");font-weight:700}
:root{font-family:Arial,sans-serif;color:#171717;background:#f1f3f5}
*{box-sizing:border-box}
body{margin:0}
header{min-height:92px;background:#fff;border-bottom:1px solid #ddd;display:flex;align-items:center;justify-content:space-between;padding:0 18px;position:sticky;top:0;z-index:20}
header span{display:block;font-size:12px;color:#666;margin-top:3px}
nav{display:flex;gap:8px}
button,input,select{font:inherit}
button{padding:8px 10px;border:1px solid #b9b9b9;background:#fff;border-radius:7px;cursor:pointer}
button:hover{background:#f4f4f4}
button.primary{background:#111;color:#fff}
button.danger{color:#b00020}
main{display:grid;grid-template-columns:285px 1fr;gap:18px;padding:18px}
aside{background:#fff;padding:14px;border-radius:10px;height:max-content;position:sticky;top:110px}
aside h3{margin:8px 0}
aside label{font-size:12px;font-weight:bold;display:block;margin:8px 0 5px}
aside input,aside select{width:100%;padding:8px;border:1px solid #bbb;border-radius:6px}
.hint{font-size:12px;color:#666;line-height:1.45;margin:8px 0}
.wide{width:100%;margin-top:6px}
.btnrow{display:grid;grid-template-columns:repeat(3,1fr);gap:4px}
.btnrow button{padding:6px 2px;font-size:12px}
.symbols{display:grid;grid-template-columns:repeat(6,1fr);gap:5px}
.symbols button{padding:6px 2px;font-size:18px}
.symbol-add{display:grid;grid-template-columns:1fr 42px;gap:5px}
.page-wrap{margin:0 auto 22px;max-width:1180px}
.page-title{display:flex;justify-content:space-between;align-items:center;margin:0 0 8px}
.page{width:297mm;min-height:210mm;background:#fff;margin:auto;padding:5mm 0;box-shadow:0 3px 16px #bbb;overflow:hidden}
.strip-row{height:20mm;width:216mm;margin:0 auto;display:flex;position:relative;border-top:.2mm solid #999;border-bottom:.2mm solid #999}
.strip-row:before,.strip-row:after{content:"";position:absolute;top:-2mm;height:24mm;border-left:.2mm solid #000;z-index:8}
.strip-row:before{left:0}.strip-row:after{right:0}
.group{height:100%;position:relative;border-right:.3mm solid #111;display:flex;padding:1mm;overflow:hidden;user-select:none}
.group:last-child{border-right:none}
.group.selected{outline:.8mm solid rgba(0,90,255,.45);outline-offset:-.8mm;background:rgba(0,90,255,.05)}
.label-render{font-family:DINOT,Arial,sans-serif;white-space:pre-wrap;overflow-wrap:anywhere;word-break:normal;line-height:1.05;width:100%;height:100%;display:flex;pointer-events:none;overflow:hidden;text-wrap:wrap}
.label-render.left{justify-content:flex-start;text-align:left}
.label-render.center{justify-content:center;text-align:center}
.label-render.right{justify-content:flex-end;text-align:right}
.label-render.top{align-items:flex-start}
.label-render.middle{align-items:center}
.label-render.bottom{align-items:flex-end}
.symbol-overlay{position:absolute;transform:translate(-50%,-50%);cursor:move;z-index:6;line-height:1;touch-action:none}
.symbol-overlay:hover{outline:1px dashed #888}
.editor-pop{position:absolute;left:2px;bottom:2px;right:2px;z-index:10;display:none;background:rgba(255,255,255,.96);border:1px solid #aaa;border-radius:5px;padding:3px;gap:3px}
.group.selected .editor-pop{display:flex}
.editor-pop input[type=text]{min-width:0;flex:1}
.editor-pop input[type=number]{width:48px}
.editor-pop button{padding:2px 5px;font-size:11px}

@media(max-width:1000px){
  main{grid-template-columns:1fr}
  aside{position:relative;top:0}
  .page{transform-origin:top left}
}

.brand{display:flex;align-items:center;gap:14px}
.brand img{height:64px;width:auto;max-width:150px;object-fit:contain}

header nav{flex-wrap:wrap;justify-content:flex-end}
.brand b{font-size:20px}
.brand span{font-size:13px}
.symbols button.symbol-picked{outline:3px solid #111;background:#e8eefc}
.symbol-hint-active{font-weight:bold;color:#111}

.print-hint{border-top:1px solid #ddd;padding-top:10px;margin-top:12px}

@media print{
  @page{
    size:A4 landscape;
    margin:0;
  }

  html,body{
    width:297mm;
    min-height:210mm;
    margin:0!important;
    padding:0!important;
    background:#fff!important;
  }

  header,
  aside,
  .page-title,
  .editor-pop,
  .page-controls,
  .group-toolbar,
  nav{
    display:none!important;
  }

  main{
    display:block!important;
    padding:0!important;
    margin:0!important;
  }

  #workspace{
    display:block!important;
    margin:0!important;
    padding:0!important;
  }

  .page-wrap{
    width:297mm!important;
    height:210mm!important;
    min-height:210mm!important;
    max-width:none!important;
    margin:0!important;
    padding:0!important;
    break-after:page!important;
    page-break-after:always!important;
    overflow:hidden!important;
  }

  .page-wrap:last-child{
    break-after:auto!important;
    page-break-after:auto!important;
  }

  .page{
    width:297mm!important;
    height:210mm!important;
    min-height:210mm!important;
    margin:0!important;
    padding:5mm 0!important;
    box-shadow:none!important;
    overflow:hidden!important;
    transform:none!important;
    background:#fff!important;
  }

  .strip-row{
    width:216mm!important;
    height:20mm!important;
    margin:0 auto!important;
    break-inside:avoid!important;
    page-break-inside:avoid!important;
  }

  .group.selected{
    outline:none!important;
    background:transparent!important;
  }

  .symbol-overlay{
    cursor:default!important;
  }

  *{
    -webkit-print-color-adjust:exact!important;
    print-color-adjust:exact!important;
  }
}

.login-body{min-height:100vh;display:flex;align-items:center;justify-content:center;background:#eef1f4}
.login-card{width:min(420px,92vw);background:#fff;padding:28px;border-radius:14px;box-shadow:0 8px 30px rgba(0,0,0,.12)}
.login-card img{height:72px;max-width:200px}
.login-card h1{margin:18px 0 5px}
.login-card label{display:block;font-size:12px;font-weight:bold;margin:12px 0 5px}
.login-card input{width:100%;padding:10px;border:1px solid #bbb;border-radius:7px}
.login-error{background:#fee;border:1px solid #d88;padding:10px;border-radius:7px;color:#900;margin:12px 0}

.modal{position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:100;display:flex;align-items:center;justify-content:center;padding:20px}
.modal.hidden{display:none}
.modal-card{background:#fff;width:min(850px,95vw);max-height:88vh;overflow:auto;border-radius:12px;padding:18px}
.modal-head{display:flex;justify-content:space-between;align-items:center}
.modal-head h2{margin:0}
.user-create{display:grid;grid-template-columns:1fr 1fr 130px auto;gap:8px;margin:18px 0}
.user-create input,.user-create select{padding:9px;border:1px solid #bbb;border-radius:7px}
.user-row{display:flex;justify-content:space-between;align-items:center;border-top:1px solid #ddd;padding:12px 0;gap:12px}
.user-row span{display:block;font-size:12px;color:#666;margin-top:3px}
.user-actions{display:flex;gap:6px;flex-wrap:wrap}
@media(max-width:700px){.user-create{grid-template-columns:1fr}.user-row{align-items:flex-start;flex-direction:column}}

.selected-field-editor textarea{
  width:100%;
  min-height:110px;
  resize:vertical;
  padding:10px;
  border:1px solid #bbb;
  border-radius:7px;
  font-family:DINOT,Arial,sans-serif;
  font-size:16px;
  line-height:1.25;
}
.selected-editor-controls{
  display:flex;
  align-items:center;
  gap:8px;
  margin-top:8px;
}
.selected-editor-controls label{
  display:flex;
  align-items:center;
  gap:6px;
  margin:0;
}
.selected-editor-controls input{
  width:70px;
}
.active-btn{
  background:#111!important;
  color:#fff!important;
}
.selected-symbol-list{
  margin-top:12px;
  border-top:1px solid #ddd;
  padding-top:10px;
}
.selected-symbol-row{
  display:grid;
  grid-template-columns:38px 1fr auto;
  align-items:center;
  gap:8px;
  padding:6px 0;
  border-bottom:1px solid #eee;
}
.selected-symbol-preview{
  font-size:24px;
  text-align:center;
}
.selected-symbol-row button{
  padding:4px 7px;
  font-size:12px;
}

/* Browser preview: center text and show at most three visual lines. */
.label-render{
  display:-webkit-box!important;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:3;
  line-clamp:3;
  align-content:center;
  justify-content:center;
}
.label-render.left{text-align:left}
.label-render.center{text-align:center}
.label-render.right{text-align:right}

.brand{display:flex;align-items:center;gap:16px;min-width:360px}
.brand img{height:64px;width:auto;max-width:180px;object-fit:contain;display:block}
.brand b{font-size:22px;line-height:1.1}
.brand span{font-size:13px;color:#666;margin-top:5px}

.symbol-category{margin-top:12px}
.symbol-category-title{
  font-size:12px;
  font-weight:700;
  color:#444;
  margin-bottom:6px;
  text-transform:uppercase;
  letter-spacing:.03em;
}
.symbol-category .symbols{
  grid-template-columns:repeat(6,1fr);
}
.symbol-category .symbols button{
  min-height:38px;
  font-size:18px;
}
.custom-symbols{
  margin-top:8px;
}

/* V12: Firmenlogo sicher oben links sichtbar */
header{
  min-height:100px!important;
  padding:10px 18px!important;
  display:flex!important;
  align-items:center!important;
}
header .brand{
  display:flex!important;
  align-items:center!important;
  gap:18px!important;
  flex:0 0 auto!important;
  min-width:430px!important;
}
header .header-logo{
  display:block!important;
  visibility:visible!important;
  opacity:1!important;
  width:auto!important;
  height:72px!important;
  max-width:190px!important;
  object-fit:contain!important;
  flex:0 0 auto!important;
}

/* V14: großes Texteingabefeld für das aktuell markierte Beschriftungsfeld */
.selected-field-editor{
  margin-top:8px;
}
.selected-field-editor textarea#selectedTextArea{
  width:100%!important;
  min-height:220px!important;
  height:220px!important;
  resize:vertical!important;
  padding:14px!important;
  box-sizing:border-box!important;
  font-family:DINOT,Arial,sans-serif!important;
  font-size:20px!important;
  line-height:1.35!important;
  border:2px solid #777!important;
  border-radius:9px!important;
  background:#fff!important;
}
.selected-field-editor textarea#selectedTextArea:focus{
  min-height:280px!important;
  height:280px!important;
  outline:3px solid rgba(0,0,0,.12)!important;
  border-color:#222!important;
}

/* V15 */
.editor-pop{display:none!important}
header{min-height:108px!important;padding:10px 18px!important}
header .brand{display:flex!important;align-items:center!important;gap:18px!important;min-width:470px!important}
header .header-logo{display:block!important;visibility:visible!important;opacity:1!important;height:78px!important;width:auto!important;max-width:220px!important;object-fit:contain!important;flex:0 0 auto!important}
header .brand-text{display:flex!important;flex-direction:column!important;justify-content:center!important}
header .brand-text b{font-size:22px!important}
header .brand-text span{margin-top:5px!important}
.selected-field-editor textarea#selectedTextArea{width:100%!important;height:280px!important;min-height:280px!important;resize:vertical!important;padding:14px!important;font-family:DINOT,Arial,sans-serif!important;font-size:20px!important;line-height:1.35!important;border:2px solid #666!important;border-radius:9px!important;box-sizing:border-box!important}
.selected-field-editor textarea#selectedTextArea:focus{height:340px!important;min-height:340px!important;border-color:#111!important;outline:3px solid rgba(0,0,0,.10)!important}
.selected-field-editor>input[type=number]{width:100%!important;padding:9px!important;border:1px solid #bbb!important;border-radius:7px!important}
.segmented{display:flex;gap:5px;margin-bottom:10px}
.segmented button{flex:1}
.split-button{margin-top:12px!important;font-weight:700}

/* V16: Header uses a real PNG instead of the problematic SVG wrapper */
header .header-logo{
  display:block!important;
  width:210px!important;
  height:auto!important;
  max-width:210px!important;
  min-width:210px!important;
  object-fit:contain!important;
  visibility:visible!important;
  opacity:1!important;
}

/* V17: horizontale Ausrichtung der Beschriftung zuverlässig über Flex */
.label-render{
  display:flex!important;
  width:100%!important;
  height:100%!important;
  box-sizing:border-box!important;
}
.label-render.left{
  justify-content:flex-start!important;
  text-align:left!important;
}
.label-render.center{
  justify-content:center!important;
  text-align:center!important;
}
.label-render.right{
  justify-content:flex-end!important;
  text-align:right!important;
}
.label-render.top{
  align-items:flex-start!important;
}
.label-render.middle{
  align-items:center!important;
}
.label-render.bottom{
  align-items:flex-end!important;
}

/* Split button belongs to TE actions section */
#splitTeSidebarBtn{
  margin-top:6px;
}
#splitTeSidebarBtn:disabled{
  opacity:.45;
  cursor:not-allowed;
}

/* V18: vertikale Ausrichtung unabhängig von Textzeilen/Zeilenumbruch */
.group{
  position:relative!important;
}
.label-render{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  box-sizing:border-box!important;
  padding:2px 3px!important;
  display:flex!important;
  flex-direction:column!important;
  overflow:hidden!important;
  pointer-events:none!important;
}

/* horizontal */
.label-render.left{align-items:flex-start!important;text-align:left!important}
.label-render.center{align-items:center!important;text-align:center!important}
.label-render.right{align-items:flex-end!important;text-align:right!important}

/* vertical */
.label-render.top{justify-content:flex-start!important}
.label-render.middle{justify-content:center!important}
.label-render.bottom{justify-content:flex-end!important}

/* Legacy projects may contain valign=center */
.label-render.center.center{justify-content:center!important}

.numbering-box input{
  width:100%;
  padding:8px;
  border:1px solid #bbb;
  border-radius:6px;
  box-sizing:border-box;
}
.numbering-box .wide{
  margin-top:6px;
}

/* V21: Texteingabefeld kompakt auf 3 Zeilen */
.selected-field-editor textarea#selectedTextArea{
  height:auto!important;
  min-height:88px!important;
  max-height:none!important;
  resize:vertical!important;
  font-size:18px!important;
  line-height:1.3!important;
}
.selected-field-editor textarea#selectedTextArea:focus{
  height:auto!important;
  min-height:88px!important;
}

/* V22 */
header .header-logo{
  width:105px!important;
  min-width:105px!important;
  max-width:105px!important;
  height:auto!important;
}
header .brand{min-width:350px!important}
header{min-height:76px!important}
aside{top:94px!important}

.sidebar-title-row,.section-heading{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
}
.sidebar-title-row label{margin-bottom:5px}
.distributor-heading{margin-top:12px}
.distributor-actions{
  display:grid;
  grid-template-columns:42px 1fr;
  gap:5px;
  margin-top:6px;
}
.distributor-actions button{padding:6px}

.icon-btn{
  width:26px!important;
  height:26px!important;
  min-width:26px!important;
  padding:0!important;
  border-radius:50%!important;
  font-weight:700;
  line-height:24px;
}
.info-inline{margin:4px 0 8px}
.tooltip-box{
  position:fixed;
  z-index:500;
  width:min(310px,80vw);
  padding:10px 12px;
  background:#171717;
  color:#fff;
  border-radius:7px;
  font-size:12px;
  line-height:1.45;
  box-shadow:0 6px 20px rgba(0,0,0,.25);
}
.tooltip-box.hidden{display:none}

.project-modal-card{width:min(1080px,95vw)}
.modal-subtitle{font-size:13px;color:#666;margin-top:3px}
.project-toolbar{display:flex;gap:8px;margin:18px 0}
.project-toolbar input{flex:1;padding:10px;border:1px solid #bbb;border-radius:7px}
.project-table-wrap{overflow:auto;max-height:65vh}
.project-table{width:100%;border-collapse:collapse}
.project-table th,.project-table td{text-align:left;padding:10px;border-bottom:1px solid #ddd;white-space:nowrap}
.project-table th{position:sticky;top:0;background:#fff;z-index:1}
.project-table tr{cursor:default}
.project-table tr:hover,.project-table tr.current-project{background:#f4f6f8}
.project-actions{display:flex;gap:5px}
.project-actions button{padding:5px 7px;font-size:12px}

#printAllDistributors{display:none}

/* 9 rows × 20 mm = 180 mm. Compact print margin fits cleanly on A4 landscape. */
@media print{
  body.print-mode #workspace{display:none!important}
  body.print-mode #printAllDistributors{display:block!important}
  .page{
    padding:7mm 0!important;
  }
  .strip-row:before,.strip-row:after{
    top:0!important;
    height:20mm!important;
  }
  .print-page-wrap{
    width:297mm!important;
    height:210mm!important;
    margin:0!important;
    break-after:page!important;
    page-break-after:always!important;
  }
  .print-page-wrap:last-child{break-after:auto!important;page-break-after:auto!important}
}

.strip-row:before,.strip-row:after{
  top:0!important;
  height:20mm!important;
}

/* V23: Produktlink unter Beschriftungsmanager */
.brand .product-link{
  color:inherit;
  text-decoration:none;
}
.brand .product-link:hover{
  text-decoration:underline;
}

/* V24: Verteiler-Aktionen klar und ohne abgeschnittene Beschriftungen */
.distributor-actions{
  display:grid!important;
  grid-template-columns:1fr 1fr!important;
  gap:6px!important;
  margin-top:8px!important;
}
.distributor-actions button{
  width:100%!important;
  min-width:0!important;
  padding:7px 8px!important;
  font-size:12px!important;
  white-space:normal!important;
  line-height:1.2!important;
}
.distributor-actions button:first-child{
  grid-column:1 / -1!important;
}

/* V25: Hilfe-Kästchen vollständig ohne JavaScript */
.info-trigger{
  position:relative!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  cursor:help!important;
  overflow:visible!important;
  user-select:none!important;
}

.info-trigger .info-tooltip{
  display:none;
  position:absolute;
  z-index:9999;
  left:calc(100% + 8px);
  top:50%;
  transform:translateY(-50%);
  width:290px;
  max-width:70vw;
  padding:10px 12px;
  background:#171717;
  color:#fff;
  border-radius:7px;
  box-shadow:0 6px 20px rgba(0,0,0,.28);
  font-size:12px;
  font-weight:400;
  line-height:1.45;
  text-align:left;
  white-space:normal;
  pointer-events:none;
}

.info-trigger .info-tooltip::before{
  content:"";
  position:absolute;
  right:100%;
  top:50%;
  transform:translateY(-50%);
  border:6px solid transparent;
  border-right-color:#171717;
}

.info-trigger:hover .info-tooltip,
.info-trigger:focus .info-tooltip,
.info-trigger:focus-visible .info-tooltip{
  display:block!important;
}

/* In the narrow sidebar keep tooltips inside the viewport more reliably */
aside .info-trigger .info-tooltip{
  left:calc(100% + 8px);
}

/* Ensure no parent clips the tooltip */
aside,
.section-heading,
.sidebar-title-row,
.numbering-box,
.symbol-category{
  overflow:visible!important;
}

/* V26: Projekt- und Verteilername im Ausdruck */
.print-distributor-head{
  display:none;
}
@media print{
  .print-distributor-head{
    display:flex!important;
    width:216mm;
    height:8mm;
    margin:0 auto 3mm auto;
    align-items:center;
    justify-content:space-between;
    box-sizing:border-box;
    font-family:DINOT,Arial,sans-serif;
    font-size:10pt;
    line-height:1;
  }
  .print-page-wrap .page{
    padding-top:5mm!important;
    padding-bottom:5mm!important;
  }
}

/* V27: Logo im normalen Header nicht mehr angeschnitten */
header{
  overflow:visible!important;
}
header .brand{
  overflow:visible!important;
}
header .header-logo{
  margin-top:2px!important;
  margin-bottom:2px!important;
  object-fit:contain!important;
  object-position:left center!important;
  max-height:58px!important;
}

/* Druck: 9 x 20 mm + kompakter Kopf passen sicher auf A4 quer */
@media print{
  @page{
    size:A4 landscape;
    margin:0;
  }

  html,body{
    width:297mm!important;
    height:210mm!important;
    margin:0!important;
    padding:0!important;
  }

  .print-page-wrap{
    width:297mm!important;
    height:210mm!important;
    min-height:210mm!important;
    max-height:210mm!important;
    margin:0!important;
    padding:0!important;
    overflow:hidden!important;
    break-after:page!important;
    page-break-after:always!important;
  }

  .print-page-wrap .page{
    position:relative!important;
    width:297mm!important;
    height:210mm!important;
    min-height:210mm!important;
    max-height:210mm!important;
    margin:0!important;
    padding:0!important;
    box-sizing:border-box!important;
    overflow:hidden!important;
  }

  /* Kopfbereich 12 mm hoch, innerhalb der Seite */
  .print-distributor-head{
    display:block!important;
    position:absolute!important;
    top:3mm!important;
    left:0!important;
    right:0!important;
    width:auto!important;
    height:9mm!important;
    margin:0!important;
    padding:0 10mm 0 10mm!important;
    box-sizing:border-box!important;
    font-family:DINOT,Arial,sans-serif!important;
    font-size:9pt!important;
    line-height:1.15!important;
  }

  .print-distributor-head .print-meta{
    margin-left:auto!important;
    width:max-content!important;
    max-width:120mm!important;
    text-align:right!important;
    white-space:nowrap!important;
  }

  /* 9 Streifen = 180 mm, Start bei 18 mm -> Ende bei 198 mm */
  .print-page-wrap .strip-row:first-of-type{
    margin-top:18mm!important;
  }

  .print-page-wrap .strip-row{
    width:216mm!important;
    height:20mm!important;
    margin-left:auto!important;
    margin-right:auto!important;
    margin-bottom:0!important;
    break-inside:avoid!important;
    page-break-inside:avoid!important;
  }

  .print-page-wrap .strip-row:before,
  .print-page-wrap .strip-row:after{
    top:0!important;
    height:20mm!important;
  }

  .print-page-wrap:last-child{
    break-after:auto!important;
    page-break-after:auto!important;
  }
}

/* V28: Symbolhilfe oben + Admin-Verwaltung eigene Symbolbibliothek */
.symbol-main-heading{margin-top:0}
.symbol-main-heading h3{margin:0}
.custom-symbol-title{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:6px;
  margin-top:8px;
}
.admin-symbol-hint{
  font-size:10px;
  color:#666;
  white-space:nowrap;
}
.custom-symbols{
  display:flex!important;
  flex-wrap:wrap!important;
  gap:5px!important;
  overflow:visible!important;
}
.custom-symbol-item{
  position:relative;
  display:inline-flex;
  overflow:visible;
}
.custom-symbol-item>button:first-child{
  min-width:36px;
}
.custom-symbol-delete{
  position:absolute!important;
  top:-7px!important;
  right:-7px!important;
  width:18px!important;
  height:18px!important;
  min-width:18px!important;
  padding:0!important;
  border-radius:50%!important;
  font-size:13px!important;
  line-height:16px!important;
  font-weight:700!important;
  z-index:3;
}

/* V29: Eignungsprüfung für eigene Symbole */
.symbol-validation{
  min-height:16px;
  margin-top:5px;
  font-size:11px;
  line-height:1.35;
}
.symbol-validation.checking{color:#666}
.symbol-validation.valid{color:#176b2c}
.symbol-validation.invalid{color:#a40000;font-weight:600}

/* V31: Druckkopf – Projekt/Verteiler auf Höhe der Überschrift */
@media print{
  .print-distributor-head{
    top:3mm!important;
    height:11mm!important;
    display:flex!important;
    align-items:flex-start!important;
    justify-content:flex-end!important;
    padding-top:0!important;
  }
  .print-distributor-head .print-meta{
    margin:0 0 0 auto!important;
    text-align:right!important;
    font-size:9pt!important;
    line-height:1.35!important;
  }
}

/* V32: erweiterte Funktions-/Gerätebibliothek */
.symbol-category{
  margin-top:14px;
}
.symbol-category-title{
  margin-bottom:6px;
}
.symbol-category .symbols{
  grid-template-columns:repeat(6,1fr);
}
.symbol-category .symbols button{
  min-height:40px;
  font-size:20px;
}

/* V33 */
.icon-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.icon-choice{min-height:72px;padding:7px 4px!important;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px}.icon-choice img{width:32px;height:32px;object-fit:contain}.icon-choice span{font-size:10px;line-height:1.1;text-align:center}.icon-overlay{display:flex!important;align-items:center!important;justify-content:center!important}.icon-overlay img{width:100%;height:100%;object-fit:contain}.selected-symbol-preview img{width:28px;height:28px;object-fit:contain}

/* V34: Icon-Auswahl besser lesbar */
.icon-grid{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:8px!important;
}

.icon-choice{
  min-height:96px!important;
  padding:10px 6px!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:8px!important;
  background:#fff!important;
  border:1px solid #c9c9c9!important;
}

.icon-choice:hover{
  background:#f4f6f8!important;
  border-color:#888!important;
}

.icon-choice img{
  width:48px!important;
  height:48px!important;
  object-fit:contain!important;
  display:block!important;
}

.icon-choice span{
  display:block!important;
  width:100%!important;
  font-size:11px!important;
  line-height:1.15!important;
  text-align:center!important;
  white-space:normal!important;
  overflow-wrap:anywhere!important;
}

.symbol-category{
  margin-top:16px!important;
}

.symbol-category-title{
  font-size:12px!important;
  font-weight:700!important;
  margin-bottom:7px!important;
  padding-bottom:4px!important;
  border-bottom:1px solid #ddd!important;
}

.icon-overlay img{
  filter:contrast(1.25)!important;
}

/* V35: zuletzt hinzugefügte SmartHome-/SVG-Iconbibliothek entfernt */
.icon-grid,
.icon-choice,
.icon-overlay{
  display:none!important;
}

/* V36: Direkter Browserdruck – Druckkopf sicher sichtbar */
@media print{
  body.print-mode #printAllDistributors{
    display:block!important;
  }

  body.print-mode .print-page-wrap .page{
    position:relative!important;
    width:297mm!important;
    height:210mm!important;
    padding:0!important;
    margin:0!important;
    overflow:hidden!important;
  }

  body.print-mode .print-distributor-head{
    display:block!important;
    position:absolute!important;
    top:4mm!important;
    right:10mm!important;
    left:auto!important;
    width:130mm!important;
    height:10mm!important;
    margin:0!important;
    padding:0!important;
    z-index:50!important;
    background:#fff!important;
    color:#000!important;
    font-family:DINOT,Arial,sans-serif!important;
    font-size:9pt!important;
    line-height:1.3!important;
    text-align:right!important;
  }

  body.print-mode .print-distributor-head .print-meta{
    display:block!important;
    width:100%!important;
    margin:0!important;
    padding:0!important;
    text-align:right!important;
    white-space:nowrap!important;
  }

  /* Entscheidend: erste Streifenzeile startet fest unterhalb des Druckkopfs.
     16 mm Start + 9 x 20 mm = 196 mm, passt sicher auf 210 mm A4-Höhe. */
  body.print-mode .print-distributor-head + .strip-row{
    margin-top:16mm!important;
  }

  body.print-mode .print-page-wrap .strip-row{
    width:216mm!important;
    height:20mm!important;
    margin-left:auto!important;
    margin-right:auto!important;
    margin-bottom:0!important;
  }
}

/* V37: Projekt- und Verteilerangaben exakt bündig */
@media print{
  body.print-mode .print-distributor-head .print-meta{
    display:grid!important;
    grid-template-columns:32mm 1fr!important;
    grid-auto-rows:auto!important;
    column-gap:3mm!important;
    row-gap:0!important;
    width:100%!important;
    text-align:left!important;
  }

  body.print-mode .print-distributor-head .print-meta-row{
    display:contents!important;
  }

  body.print-mode .print-distributor-head .print-meta-row b{
    grid-column:1!important;
    text-align:left!important;
    white-space:nowrap!important;
  }

  body.print-mode .print-distributor-head .print-meta-row span{
    grid-column:2!important;
    text-align:left!important;
    white-space:nowrap!important;
  }
}

/* V38: Direkter Ausdruck stabil auf genau 1 A4-Seite pro Verteiler */
@media print{
  @page{
    size:A4 landscape;
    margin:0;
  }

  html,body{
    width:297mm!important;
    height:auto!important;
    margin:0!important;
    padding:0!important;
  }

  body.print-mode #workspace{
    display:none!important;
  }

  body.print-mode #printAllDistributors{
    display:block!important;
    margin:0!important;
    padding:0!important;
  }

  body.print-mode .print-page-wrap{
    width:297mm!important;
    height:210mm!important;
    min-height:210mm!important;
    max-height:210mm!important;
    margin:0!important;
    padding:0!important;
    overflow:hidden!important;
    break-after:page!important;
    page-break-after:always!important;
  }

  body.print-mode .print-page-wrap:last-child{
    break-after:auto!important;
    page-break-after:auto!important;
  }

  body.print-mode .print-page-wrap .page{
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    width:297mm!important;
    height:210mm!important;
    min-height:210mm!important;
    max-height:210mm!important;
    margin:0!important;
    padding:0!important;
    overflow:hidden!important;
    box-sizing:border-box!important;
  }

  /* Druckkopf im normalen Seitenfluss:
     12 mm Kopf + 9 x 20 mm = 192 mm, damit 18 mm Reserve auf A4. */
  body.print-mode .print-distributor-head{
    position:static!important;
    display:block!important;
    width:216mm!important;
    height:12mm!important;
    min-height:12mm!important;
    max-height:12mm!important;
    margin:3mm auto 0 auto!important;
    padding:0!important;
    box-sizing:border-box!important;
    background:#fff!important;
    color:#000!important;
    font-family:DINOT,Arial,sans-serif!important;
    font-size:9pt!important;
    line-height:1.25!important;
  }

  body.print-mode .print-distributor-head .print-meta{
    display:grid!important;
    grid-template-columns:31mm 1fr!important;
    grid-auto-rows:5mm!important;
    column-gap:3mm!important;
    row-gap:0!important;
    width:100%!important;
    height:10mm!important;
    margin:0!important;
    padding:0!important;
    align-content:start!important;
    text-align:left!important;
  }

  body.print-mode .print-distributor-head .print-meta-row{
    display:contents!important;
  }

  body.print-mode .print-distributor-head .print-meta-row b{
    grid-column:1!important;
    text-align:left!important;
    white-space:nowrap!important;
  }

  body.print-mode .print-distributor-head .print-meta-row span{
    grid-column:2!important;
    text-align:left!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }

  body.print-mode .print-page-wrap .strip-row{
    flex:0 0 20mm!important;
    width:216mm!important;
    height:20mm!important;
    min-height:20mm!important;
    max-height:20mm!important;
    margin:0 auto!important;
    break-inside:avoid!important;
    page-break-inside:avoid!important;
  }

  body.print-mode .print-page-wrap .strip-row:first-of-type{
    margin-top:0!important;
  }
}

/* V39 FINALER DIREKTDRUCK – EIN Verteiler = EXAKT EINE A4-Seite */
@media print {
  @page { size: A4 landscape; margin: 0; }

  html, body {
    margin:0!important;
    padding:0!important;
    width:297mm!important;
    height:auto!important;
  }

  body.print-mode header,
  body.print-mode aside,
  body.print-mode nav,
  body.print-mode main,
  body.print-mode #workspace {
    display:none!important;
  }

  body.print-mode #printAllDistributors {
    display:block!important;
    position:static!important;
    width:297mm!important;
    margin:0!important;
    padding:0!important;
  }

  body.print-mode .print-page-wrap {
    display:block!important;
    position:relative!important;
    width:297mm!important;
    height:199mm!important;
    min-height:0!important;
    max-height:199mm!important;
    margin:0!important;
    padding:0!important;
    overflow:hidden!important;
    box-sizing:border-box!important;
    break-inside:avoid!important;
    page-break-inside:avoid!important;
    break-after:page!important;
    page-break-after:always!important;
  }

  body.print-mode .print-page-wrap:last-child {
    break-after:auto!important;
    page-break-after:auto!important;
  }

  body.print-mode .print-page-wrap .page {
    display:block!important;
    position:relative!important;
    width:297mm!important;
    height:199mm!important;
    min-height:0!important;
    max-height:199mm!important;
    margin:0!important;
    padding:0!important;
    overflow:hidden!important;
    box-shadow:none!important;
    box-sizing:border-box!important;
    transform:none!important;
    background:#fff!important;
  }

  /* Kopf absolut positioniert: beansprucht KEINE zusätzliche Seitenhöhe. */
  body.print-mode .print-distributor-head {
    display:block!important;
    position:absolute!important;
    left:40.5mm!important;
    top:2mm!important;
    width:216mm!important;
    height:10mm!important;
    min-height:0!important;
    max-height:10mm!important;
    margin:0!important;
    padding:0!important;
    z-index:100!important;
    overflow:visible!important;
    background:#fff!important;
    color:#000!important;
    font-family:DINOT,Arial,sans-serif!important;
    font-size:8.5pt!important;
    line-height:4.2mm!important;
  }

  body.print-mode .print-distributor-head .print-meta {
    display:grid!important;
    grid-template-columns:31mm 1fr!important;
    grid-template-rows:4.2mm 4.2mm!important;
    column-gap:3mm!important;
    row-gap:0!important;
    width:100%!important;
    height:8.4mm!important;
    margin:0!important;
    padding:0!important;
    text-align:left!important;
  }

  body.print-mode .print-distributor-head .print-meta-row {
    display:contents!important;
  }

  body.print-mode .print-distributor-head .print-meta-row b,
  body.print-mode .print-distributor-head .print-meta-row span {
    display:block!important;
    margin:0!important;
    padding:0!important;
    white-space:nowrap!important;
    text-align:left!important;
  }

  /* 9 Streifen exakt als absoluter Block: 14 mm + 180 mm = 194 mm.
     Damit gibt es keinerlei Flex-/Margin-/Pagination-Effekt. */
  body.print-mode .print-page-wrap .strip-row {
    position:absolute!important;
    left:40.5mm!important;
    width:216mm!important;
    height:20mm!important;
    min-height:20mm!important;
    max-height:20mm!important;
    margin:0!important;
    padding:0!important;
    box-sizing:border-box!important;
    break-inside:avoid!important;
    page-break-inside:avoid!important;
  }

  body.print-mode .print-page-wrap .strip-row:nth-of-type(2)  { top:14mm!important; }
  body.print-mode .print-page-wrap .strip-row:nth-of-type(3)  { top:34mm!important; }
  body.print-mode .print-page-wrap .strip-row:nth-of-type(4)  { top:54mm!important; }
  body.print-mode .print-page-wrap .strip-row:nth-of-type(5)  { top:74mm!important; }
  body.print-mode .print-page-wrap .strip-row:nth-of-type(6)  { top:94mm!important; }
  body.print-mode .print-page-wrap .strip-row:nth-of-type(7)  { top:114mm!important; }
  body.print-mode .print-page-wrap .strip-row:nth-of-type(8)  { top:134mm!important; }
  body.print-mode .print-page-wrap .strip-row:nth-of-type(9)  { top:154mm!important; }
  body.print-mode .print-page-wrap .strip-row:nth-of-type(10) { top:174mm!important; }

  body.print-mode .print-page-wrap .strip-row:before,
  body.print-mode .print-page-wrap .strip-row:after {
    top:0!important;
    height:20mm!important;
  }
}

/* V42 – Desktop / Tablet / iPhone responsive */
.mobile-tools-btn,
.mobile-aside-overlay{
  display:none;
}

/* Tablet / iPad */
@media (min-width:768px) and (max-width:1180px){
  header{
    position:sticky;
    min-height:72px!important;
    padding:8px 12px!important;
    gap:10px;
  }

  header .brand{
    min-width:260px!important;
    gap:10px!important;
  }

  header .header-logo{
    width:84px!important;
    min-width:84px!important;
    max-width:84px!important;
  }

  header .brand-text b{
    font-size:18px!important;
  }

  header nav{
    gap:5px!important;
  }

  header nav button{
    padding:7px 8px!important;
    font-size:12px!important;
    min-height:38px!important;
  }

  main{
    grid-template-columns:250px minmax(0,1fr)!important;
    gap:12px!important;
    padding:12px!important;
  }

  aside{
    top:88px!important;
    padding:12px!important;
    max-height:calc(100vh - 100px);
    overflow-y:auto;
    -webkit-overflow-scrolling:touch;
  }

  aside button,
  aside input,
  aside select,
  aside textarea{
    min-height:42px;
  }

  #workspace{
    min-width:0;
    overflow:hidden;
  }

  .page-wrap{
    max-width:100%!important;
    overflow:visible!important;
  }

  .group{
    min-height:20mm;
    touch-action:manipulation;
  }

  .symbol-overlay{
    touch-action:none!important;
  }

  .info-trigger{
    min-width:32px!important;
    width:32px!important;
    height:32px!important;
  }
}

/* iPhone / small mobile */
@media (max-width:767px){
  body{
    overflow-x:hidden;
  }

  header{
    position:sticky!important;
    top:0!important;
    min-height:64px!important;
    padding:7px 8px!important;
    display:grid!important;
    grid-template-columns:1fr auto!important;
    gap:6px!important;
    align-items:center!important;
  }

  header .brand{
    min-width:0!important;
    gap:8px!important;
  }

  header .header-logo{
    width:62px!important;
    min-width:62px!important;
    max-width:62px!important;
  }

  header .brand-text{
    min-width:0;
  }

  header .brand-text b{
    font-size:16px!important;
  }

  header .brand-text span{
    font-size:10px!important;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
    max-width:210px;
  }

  header nav{
    grid-column:1 / -1;
    display:flex!important;
    flex-wrap:nowrap!important;
    overflow-x:auto!important;
    gap:5px!important;
    padding-bottom:2px;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
  }
  header nav::-webkit-scrollbar{display:none}

  header nav button{
    flex:0 0 auto;
    min-height:42px!important;
    padding:8px 10px!important;
    font-size:12px!important;
  }

  .mobile-tools-btn{
    display:block!important;
    min-height:42px!important;
    padding:7px 10px!important;
    font-size:12px!important;
  }

  main{
    display:block!important;
    padding:8px!important;
  }

  aside{
    position:fixed!important;
    z-index:300!important;
    left:0!important;
    top:0!important;
    bottom:0!important;
    width:min(88vw,360px)!important;
    max-height:none!important;
    overflow-y:auto!important;
    -webkit-overflow-scrolling:touch;
    border-radius:0 12px 12px 0!important;
    transform:translateX(-105%);
    transition:transform .2s ease;
    padding:calc(14px + env(safe-area-inset-top)) 14px calc(20px + env(safe-area-inset-bottom))!important;
    box-shadow:8px 0 24px rgba(0,0,0,.20);
  }

  aside.mobile-open{
    transform:translateX(0);
  }

  .mobile-aside-overlay{
    display:none;
    position:fixed;
    inset:0;
    z-index:250;
    background:rgba(0,0,0,.38);
  }

  .mobile-aside-overlay.show{
    display:block!important;
  }

  aside button,
  aside input,
  aside select{
    min-height:44px!important;
    font-size:16px!important;
  }

  aside textarea{
    min-height:92px!important;
    font-size:16px!important;
  }

  .segmented button{
    min-height:44px!important;
  }

  .symbols button{
    min-height:44px!important;
    font-size:20px!important;
  }

  .icon-btn{
    width:34px!important;
    min-width:34px!important;
    height:34px!important;
    min-height:34px!important;
  }

  .info-trigger .info-tooltip{
    position:fixed!important;
    left:12px!important;
    right:12px!important;
    top:auto!important;
    bottom:calc(18px + env(safe-area-inset-bottom))!important;
    transform:none!important;
    width:auto!important;
    max-width:none!important;
    font-size:13px!important;
    z-index:10000!important;
    pointer-events:auto!important;
  }

  .info-trigger .info-tooltip::before{
    display:none!important;
  }

  #workspace{
    width:100%!important;
    overflow:hidden!important;
  }

  .page-wrap{
    max-width:100%!important;
    margin:0!important;
  }

  .page-title{
    font-size:12px;
    margin-bottom:5px!important;
  }

  .page{
    margin:0!important;
    transform-origin:top left!important;
  }

  .group{
    touch-action:manipulation;
  }

  .symbol-overlay{
    touch-action:none!important;
  }

  .project-modal-card,
  .modal-card{
    width:96vw!important;
    max-height:92vh!important;
    padding:12px!important;
  }

  .project-toolbar{
    flex-direction:column;
  }

  .project-table{
    font-size:12px;
  }

  .project-table th,
  .project-table td{
    padding:7px!important;
  }

  .project-actions{
    min-width:200px;
  }

  .user-create{
    grid-template-columns:1fr!important;
  }

  .user-row{
    align-items:stretch!important;
  }

  .user-actions button{
    min-height:42px!important;
  }
}

/* Touch-specific refinement */
@media (hover:none) and (pointer:coarse){
  button{
    min-height:42px;
  }

  .group{
    -webkit-tap-highlight-color:rgba(0,90,255,.15);
  }

  .info-trigger:hover .info-tooltip{
    display:none;
  }

  .info-trigger:focus .info-tooltip,
  .info-trigger:focus-visible .info-tooltip{
    display:block!important;
  }
}

/* V43 – Touch-Mehrfachauswahl für TE */
.touch-clear-btn:disabled{
  opacity:.45;
  cursor:not-allowed;
}

@media (hover:none) and (pointer:coarse){
  .group.selected{
    outline:1mm solid rgba(0,90,255,.70)!important;
    outline-offset:-1mm!important;
    background:rgba(0,90,255,.12)!important;
  }

  .group{
    cursor:pointer!important;
  }

  /* Mehrfachauswahl per Tipp: deutlicher Touch-Zustand */
  .group:active{
    background:rgba(0,90,255,.18)!important;
  }

  .touch-clear-btn{
    display:block!important;
    min-height:44px!important;
  }

  /* Kleine Bedienhilfe nur auf Touch */
  .section-heading + .wide::before{
    content:"";
  }
}

/* V44 */
#userAdminBtn.hidden-admin{display:none!important}
#userAdminBtn:not(.hidden-admin){display:inline-flex!important}
#clearSelectionBtn{display:block!important;width:100%!important;margin-top:6px!important}
#clearSelectionBtn:disabled{opacity:.5!important}

/* V45: Admin-Button wird serverseitig gerendert und darf nicht versteckt werden */
#userAdminBtn{
  display:inline-flex!important;
}

/* V46 – einmalige Ersteinrichtung */
.setup-card{
  width:min(480px,92vw)!important;
}
.setup-card h2{
  margin:4px 0 14px;
  font-size:18px;
}
.setup-info{
  font-size:13px;
  line-height:1.45;
  color:#555;
  margin-bottom:18px;
}
.setup-card form{
  display:grid;
  gap:8px;
}
.setup-card form label{
  margin-top:5px;
  font-weight:700;
  font-size:12px;
}
.setup-card form input{
  min-height:42px;
  padding:9px 10px;
  border:1px solid #bbb;
  border-radius:7px;
  box-sizing:border-box;
}
.setup-note{
  margin-top:16px;
  font-size:11px;
  line-height:1.4;
  color:#777;
}

/* V47 – unabhängiges Scrollen der linken Werkzeugleiste */
:root{--app-header-height:94px}
html,body{height:100%}
body{overflow:hidden}
header{
  position:fixed!important;
  top:0!important;
  left:0!important;
  right:0!important;
  z-index:200!important;
}
main{
  position:fixed!important;
  top:var(--app-header-height)!important;
  left:0!important;
  right:0!important;
  bottom:0!important;
  height:auto!important;
  overflow:hidden!important;
  box-sizing:border-box!important;
}
aside{
  position:relative!important;
  top:auto!important;
  height:100%!important;
  max-height:none!important;
  overflow-y:auto!important;
  overflow-x:visible!important;
  overscroll-behavior:contain;
  scrollbar-gutter:stable;
  -webkit-overflow-scrolling:touch;
}
#workspace{
  height:100%!important;
  min-height:0!important;
  overflow:auto!important;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
}
@media (min-width:768px) and (max-width:1180px){
  :root{--app-header-height:88px}
  body{overflow:hidden!important}
  main{
    position:fixed!important;
    top:var(--app-header-height)!important;
    left:0!important;
    right:0!important;
    bottom:0!important;
    overflow:hidden!important;
  }
  aside{
    position:relative!important;
    top:auto!important;
    height:100%!important;
    max-height:none!important;
    overflow-y:auto!important;
    overflow-x:visible!important;
  }
  #workspace{
    height:100%!important;
    min-height:0!important;
    overflow:auto!important;
  }
}
@media (max-width:767px){
  :root{--app-header-height:112px}
  body{overflow:hidden!important}
  main{
    position:fixed!important;
    top:var(--app-header-height)!important;
    left:0!important;
    right:0!important;
    bottom:0!important;
    overflow:hidden!important;
    padding:8px!important;
  }
  aside{
    position:fixed!important;
    top:0!important;
    bottom:0!important;
    height:auto!important;
    max-height:none!important;
    overflow-y:auto!important;
    overflow-x:visible!important;
  }
  #workspace{
    height:100%!important;
    min-height:0!important;
    overflow:auto!important;
  }
}
@media print{
  html,body{height:auto!important;overflow:visible!important}
  header,main,aside,#workspace{position:static!important}
}

/* V48 – globale Info-Popups */
.info-trigger .info-tooltip{
  display:none!important;
}

.global-info-tooltip{
  position:fixed!important;
  display:none;
  visibility:hidden;
  z-index:2147483647!important;
  width:min(320px,calc(100vw - 24px));
  max-width:320px;
  padding:10px 12px;
  background:#171717;
  color:#fff;
  border-radius:8px;
  box-shadow:0 8px 28px rgba(0,0,0,.35);
  font-family:DINOT,Arial,sans-serif;
  font-size:12px;
  font-weight:400;
  line-height:1.45;
  text-align:left;
  white-space:normal;
  pointer-events:none;
}

.global-info-tooltip.show{
  display:block!important;
}

aside{z-index:20!important}
#workspace{position:relative;z-index:1!important}

@media (max-width:767px){
  .global-info-tooltip{
    left:12px!important;
    right:12px!important;
    top:auto!important;
    bottom:calc(16px + env(safe-area-inset-bottom))!important;
    width:auto!important;
    max-width:none!important;
    font-size:13px!important;
  }
}

/* V49 – Header-Kontext, Autosave und integrierte Projektverwaltung */
.header-context{
  display:flex;
  align-items:center;
  gap:9px;
  min-width:260px;
  max-width:440px;
  padding:7px 11px;
  border:1px solid #d4d4d4;
  border-radius:9px;
  background:#fff;
  cursor:pointer;
}
.header-context:hover{background:#f6f7f8}
.header-context-item{display:flex;flex-direction:column;min-width:0}
.header-context-label{font-size:9px;text-transform:uppercase;letter-spacing:.05em;color:#777}
.header-context strong{font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:175px}
.header-context-separator{font-size:22px;color:#aaa}
.save-status{
  flex:0 0 auto;
  padding:5px 8px;
  border-radius:7px;
  font-size:11px;
  white-space:nowrap;
}
.save-status.saved{color:#26723a;background:#edf8f0}
.save-status.saving{color:#715500;background:#fff8dc}
.save-status.dirty{color:#666;background:#f2f2f2}
.save-status.error{color:#a00000;background:#fff0f0;font-weight:700}

.project-manager-v49{width:min(1180px,96vw)!important}
.project-manager-grid{
  display:grid;
  grid-template-columns:minmax(330px,42%) minmax(420px,1fr);
  gap:18px;
  margin-top:14px;
  min-height:480px;
}
.project-manager-list{border-right:1px solid #ddd;padding-right:18px;min-width:0}
.project-manager-detail{min-width:0}
.project-manager-empty{display:flex;height:100%;align-items:center;justify-content:center;color:#777}
.project-table tr.manager-selected{background:#eaf1f8!important}
.current-badge{
  display:inline-block;
  margin-left:7px;
  padding:2px 5px;
  border-radius:8px;
  font-size:9px;
  background:#e6f5ea;
  color:#26723a;
  vertical-align:middle;
}
.manager-name-row{display:grid;grid-template-columns:1fr auto;gap:7px;margin:5px 0 10px}
.manager-name-row input{padding:9px;border:1px solid #bbb;border-radius:7px}
.manager-project-actions{display:flex;gap:6px;flex-wrap:wrap}
.manager-section-head{display:flex;justify-content:space-between;align-items:flex-start;gap:10px}
.manager-section-head h3{margin:0 0 3px}
.manager-distributor-list{display:grid;gap:7px;margin-top:12px}
.manager-distributor-row{
  display:grid;
  grid-template-columns:minmax(160px,1fr) auto;
  gap:7px;
  align-items:stretch;
  padding:7px;
  border:1px solid #ddd;
  border-radius:8px;
}
.manager-distributor-open{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:center;
  text-align:left;
  border:none!important;
  background:transparent!important;
}
.manager-distributor-open span{font-weight:700}
.manager-distributor-open small{color:#777;margin-top:2px}
.manager-distributor-open.active{background:#edf5fb!important;border-radius:6px!important}
.manager-distributor-actions{display:flex;align-items:center;gap:4px}
.manager-distributor-actions button{font-size:11px;padding:6px}

@media (max-width:1180px){
  .header-context{min-width:180px;max-width:300px}
  .header-context strong{max-width:110px}
}
@media (max-width:767px){
  .header-context{
    grid-column:1 / -1;
    order:3;
    width:100%;
    max-width:none;
    min-width:0;
    box-sizing:border-box;
  }
  .header-context-item{flex:1}
  .header-context strong{max-width:100%}
  .save-status{position:absolute;right:8px;top:66px;z-index:2}
  .project-manager-grid{grid-template-columns:1fr;min-height:0}
  .project-manager-list{border-right:none;border-bottom:1px solid #ddd;padding-right:0;padding-bottom:12px}
  .manager-distributor-row{grid-template-columns:1fr}
  .manager-distributor-actions{flex-wrap:wrap}
}

/* V50 – Projektfenster: nur Projektliste scrollbar, Details dauerhaft sichtbar */
.project-manager-v49{
  width:min(1180px,96vw)!important;
  height:min(760px,88vh)!important;
  max-height:88vh!important;
  overflow:hidden!important;
  display:flex!important;
  flex-direction:column!important;
}

.project-manager-v49 .modal-head{
  flex:0 0 auto;
}

.project-manager-grid{
  flex:1 1 auto!important;
  min-height:0!important;
  height:auto!important;
  overflow:hidden!important;
  display:grid!important;
  grid-template-columns:minmax(330px,42%) minmax(420px,1fr)!important;
  gap:18px!important;
  margin-top:14px!important;
}

.project-manager-list{
  min-height:0!important;
  height:100%!important;
  display:flex!important;
  flex-direction:column!important;
  overflow:hidden!important;
  border-right:1px solid #ddd!important;
  padding-right:18px!important;
}

.project-manager-list .project-toolbar{
  flex:0 0 auto!important;
  margin:0 0 10px!important;
}

.project-manager-list .project-table-wrap{
  flex:1 1 auto!important;
  min-height:0!important;
  max-height:none!important;
  overflow-y:auto!important;
  overflow-x:auto!important;
  border:1px solid #e2e2e2;
  border-radius:8px;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
}

.project-manager-detail{
  min-height:0!important;
  height:100%!important;
  overflow:hidden!important;
  display:flex!important;
  flex-direction:column!important;
}

#projectManagerDetail{
  min-height:0!important;
  height:100%!important;
  overflow:hidden!important;
  display:flex;
  flex-direction:column;
}

#projectManagerDetail.hidden{
  display:none!important;
}

.project-manager-empty{
  flex:0 0 auto!important;
  height:auto!important;
  min-height:0!important;
  padding:14px!important;
  border:1px dashed #ccc;
  border-radius:8px;
  background:#fafafa;
  color:#777;
  align-items:center!important;
  justify-content:flex-start!important;
}

.manager-name-row,
.manager-project-actions,
.manager-section-head{
  flex:0 0 auto!important;
}

.manager-section-head{
  margin-top:4px;
}

.manager-distributor-list{
  flex:1 1 auto!important;
  min-height:0!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  padding-right:4px;
  margin-top:12px!important;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
}

/* Rechter Bereich soll ohne Seitenscrollen direkt nutzbar bleiben */
.project-manager-detail hr{
  flex:0 0 auto;
  margin:14px 0!important;
}

@media (max-width:767px){
  .project-manager-v49{
    height:92vh!important;
    max-height:92vh!important;
    overflow:hidden!important;
  }

  .project-manager-grid{
    grid-template-columns:1fr!important;
    grid-template-rows:minmax(180px,34%) minmax(0,1fr)!important;
    gap:10px!important;
  }

  .project-manager-list{
    border-right:none!important;
    border-bottom:1px solid #ddd!important;
    padding-right:0!important;
    padding-bottom:10px!important;
  }

  .project-manager-detail{
    min-height:0!important;
  }
}

/* V51 – Projekte/Verteiler 35/65 und Server-Reload */
.project-manager-grid{
  grid-template-columns:minmax(300px,35%) minmax(520px,65%)!important;
}
.project-manager-list .project-table-wrap{
  overflow-y:auto!important;
}
.project-manager-detail{
  overflow:hidden!important;
}
@media (max-width:900px){
  .project-manager-grid{
    grid-template-columns:1fr!important;
  }
}