*{box-sizing:border-box}
html,body{margin:0;padding:0;height:100%;font-family:system-ui,-apple-system,Segoe UI,Arial,sans-serif;background:#f5f6f8;color:#1d2329}
body{overflow:hidden}
.topbar{height:76px;background:#fff;border-bottom:1px solid #ddd;padding:14px 22px;display:flex;justify-content:space-between;align-items:center;position:relative;z-index:20}
h1{margin:0;font-size:22px}.muted{color:#69717a;font-size:13px}.actions{display:flex;gap:8px;align-items:center}
main{height:calc(100vh - 76px);padding:18px 22px;display:flex;flex-direction:column;min-height:0}
.planner-fixed{flex:0 0 auto;background:#f5f6f8;position:relative;z-index:10}
.toolbar{background:#fff;padding:12px;display:flex;gap:10px;align-items:end;flex-wrap:wrap;border:1px solid #ddd;border-radius:10px}
label{font-size:13px;display:flex;flex-direction:column;gap:5px}
select,input,button,.button{font:inherit;border:1px solid #cbd0d6;border-radius:7px;padding:8px 10px;background:#fff}
button,.button{cursor:pointer;text-decoration:none;color:#1d2329}button:hover,.button:hover{background:#f0f2f4}
.secondary{background:#f6f6f6}#search{min-width:220px;margin-left:auto}
.legend{display:flex;gap:16px;flex-wrap:wrap;padding:9px 2px;font-size:12px;color:#5d6670}
.swatch{display:inline-block;width:14px;height:14px;border:1px solid #bbb;border-radius:3px;vertical-align:-2px}
.swatch.vacation{background:#f8d7da}.swatch.gray{background:#e9ecef}.swatch.auto{background:#dbeafe}
.weektitle{display:flex;justify-content:space-between;padding:7px 2px 8px;min-height:35px}
.tablewrap{overflow:auto;background:#fff;border:1px solid #d9dde2;border-radius:10px;flex:1 1 auto;min-height:0}
table{border-collapse:separate;border-spacing:0;min-width:1120px;width:100%}
th,td{border-right:1px solid #e0e3e6;border-bottom:1px solid #e0e3e6}
thead th{position:sticky;top:0;background:#eef1f4;z-index:8;padding:11px;text-align:center;font-weight:700;white-space:nowrap}
thead th.employee-head{left:0;z-index:9;text-align:left;min-width:260px}
tbody th{position:sticky;left:0;background:#e9ecef;text-align:left;padding:8px 10px;min-width:260px;z-index:4;font-weight:600}
.employee-row{transition:opacity .15s}.employee-name-cell{text-align:left;background:#e9ecef!important}.employee-row.dragging,.special-row.dragging{opacity:.45}
.drag-handle{display:inline-block;margin-right:7px;color:#8a939c;cursor:grab;font-size:18px;line-height:1;vertical-align:-2px}
.drag-handle:active{cursor:grabbing}.employee-number{display:inline-block;width:34px;text-align:right;margin-right:8px;font-weight:700;color:#5e6872}
td.plan-cell{min-width:180px;padding:0;transition:background-color .12s;background-clip:padding-box;text-align:center;vertical-align:middle}
.cell-wrap{display:flex;align-items:stretch;height:46px;width:100%;background:inherit}
.cell{border:0;border-radius:0;width:100%;height:46px;background:transparent!important;min-width:0;text-align:center;font-weight:700}
.cell:focus{outline:2px solid #7c8b99;outline-offset:-2px;background:transparent!important}
.holiday-row th,.holiday-row td{background:#fff3cd}.holiday-row th{color:#7a5600}
.public-holiday-row th,.public-holiday-row td{background:#ffd9d9}.public-holiday-row th{color:#8b1e1e}
.public-holiday-row td.is-holiday{background:#f6a6a6}
.holiday-cell{padding:10px;font-weight:700;text-align:center;font-size:13px;color:#7a5600;min-height:46px}
.public-holiday-row .holiday-cell{color:#7d1515}
.bold-cell .cell{font-weight:700;color:#111}
.alert{margin:10px 0;padding:10px;border-radius:7px;background:#fff0d6}
.settings{display:flex;gap:30px;flex-wrap:wrap;padding-top:10px}.settings form{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.settings h3{width:100%;margin-bottom:0}.manage-row{display:flex;gap:8px;align-items:center;padding:4px 0}
.manage-row span{min-width:220px}.danger{color:#a00}
details{margin-top:16px;background:#fff;border:1px solid #ddd;border-radius:10px;padding:12px;flex:0 0 auto}
summary{cursor:pointer;font-weight:600}.settings-scroll{max-height:300px;overflow-y:auto;overflow-x:hidden;padding-right:10px}.settings-section{min-width:0}.settings-section h3{margin:10px 0 8px}.settings-section h4{margin:10px 0 5px;font-size:14px}.user-list{margin-top:6px}.settings-section form{max-width:100%}
@media(max-width:900px){
  main{padding:10px}.toolbar{align-items:stretch}.toolbar label{width:100%}#search{margin-left:0;width:100%}
}
@media print{
  @page{
    size:A4 landscape;
    margin:4mm;
  }

  html,body{
    margin:0!important;
    padding:0!important;
    background:#fff!important;
    overflow:visible!important;
    -webkit-print-color-adjust:exact!important;
    print-color-adjust:exact!important;
  }
  *,*::before,*::after{
    -webkit-print-color-adjust:exact!important;
    print-color-adjust:exact!important;
  }

  .topbar,.toolbar,.legend,details,#saveStatus,
  .color-picker,.clear-cell,.cell-actions,.drag-handle,
  #notifyBtn,.release-button{
    display:none!important;
  }

  main{
    display:block!important;
    margin:0!important;
    padding:0!important;
    width:auto!important;
    height:auto!important;
    min-height:0!important;
  }

  .planner-fixed{
    position:static!important;
    display:block!important;
    width:auto!important;
    height:auto!important;
    min-height:0!important;
    margin:0!important;
    padding:0!important;
    background:#fff!important;
  }

  .weektitle{
    display:block!important;
    min-height:0!important;
    margin:0 0 2mm!important;
    padding:0!important;
    font-size:8pt!important;
    line-height:1.1!important;
  }

  .tablewrap{
    display:block!important;
    overflow:visible!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    border:0!important;
    border-radius:0!important;
    background:#fff!important;
  }

  table{
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    height:calc(100vh - 15mm)!important;
    margin:0!important;
    border-collapse:collapse!important;
    border-spacing:0!important;
    table-layout:fixed!important;
    font-size:6.3pt!important;
  }

  thead{
    display:table-header-group!important;
  }

  thead th{
    position:static!important;
    top:auto!important;
    left:auto!important;
    height:7mm!important;
    padding:0.7mm 0.5mm!important;
    font-size:6.5pt!important;
    line-height:1.05!important;
    white-space:normal!important;
    text-align:center!important;
    background:#eef1f4!important;
    border:0.25pt solid #cfd4d8!important;
  }

  th,td{
    border:0.25pt solid #cfd4d8!important;
    padding:0!important;
    overflow:hidden!important;
  }

  .number-head,.number-cell{
    position:static!important;
    left:auto!important;
    width:7mm!important;
    min-width:7mm!important;
    max-width:7mm!important;
    text-align:center!important;
  }

  .employee-head,
  tbody th.employee-name-cell{
    position:static!important;
    left:auto!important;
    width:42mm!important;
    min-width:42mm!important;
    max-width:42mm!important;
    padding:0.6mm 1mm!important;
    text-align:left!important;
    white-space:nowrap!important;
    background:#e9ecef!important;
  }

  .day-head{
    min-width:0!important;
    width:auto!important;
  }

  tbody tr.employee-row{
    height:auto!important;
    break-inside:avoid!important;
    page-break-inside:avoid!important;
  }

  td.plan-cell{
    min-width:0!important;
    width:auto!important;
    height:auto!important;
    padding:0!important;
    vertical-align:middle!important;
  }

  .cell-wrap{
    width:100%!important;
    height:auto!important;
    min-height:7mm!important;
    padding:0!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    background:transparent!important;
  }

  .cell{
    display:block!important;
    width:100%!important;
    height:auto!important;
    min-height:7mm!important;
    margin:0!important;
    padding:0 0.5mm!important;
    border:0!important;
    border-radius:0!important;
    background:transparent!important;
    font-size:6.2pt!important;
    line-height:1.05!important;
    text-align:center!important;
    overflow:hidden!important;
  }

  /* Ferien-/Feiertagszeilen werden nicht separat gedruckt. */
  .holiday-row,.public-holiday-row{
    display:none!important;
  }

  /* Feiertage erscheinen stattdessen direkt im jeweiligen Tag. */
  .print-holiday-label{
    display:none!important;
  }
  .has-print-holiday{
    background:#ffd9d9!important;
  }
  .has-print-holiday .print-holiday-label{
    display:block!important;
    font-size:5.2pt!important;
    line-height:1!important;
    font-weight:700!important;
    text-align:center!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    width:100%!important;
  }
  .has-print-holiday .cell{
    display:none!important;
  }
}

/* Freigabe und Browser-Benachrichtigungen */
.release-button{font-weight:700;border-color:#7b8794;background:#eef3f7}
.release-button:not(:disabled):hover{background:#dfe8ef}
.release-button:disabled{opacity:.5;cursor:not-allowed}
#notifyBtn{white-space:nowrap}
#toastBox{position:fixed;right:20px;bottom:20px;z-index:1000;display:flex;flex-direction:column;gap:10px;max-width:min(420px,calc(100vw - 40px))}
.toast{background:#fff;border:1px solid #cbd0d6;border-radius:10px;box-shadow:0 8px 28px rgba(0,0,0,.16);padding:12px 14px;display:grid;grid-template-columns:1fr auto;gap:3px 12px}
.toast b{font-size:14px}.toast span{font-size:13px;color:#5d6670}.toast button{grid-column:2;grid-row:1 / span 2;border:0;padding:0 4px;font-size:20px;color:#777;background:transparent}
.day-head{font-weight:700;text-align:center;white-space:normal;line-height:1.25;min-width:180px}
.plan-cell .cell-wrap,.plan-cell .cell{ text-align:center }
.plan-cell .cell{font-weight:700}

/* Zusätzliche Zellfunktionen und feste Nummernspalte */
.number-head{position:sticky;left:0;z-index:11;width:34px;min-width:34px;max-width:34px;text-align:center!important;background:#e9ecef!important;padding:4px 2px!important}
.number-cell{position:sticky;left:0;z-index:5;width:34px;min-width:34px;max-width:34px;text-align:center!important;background:#e9ecef!important;font-weight:700;padding:4px 2px!important}
.employee-head{position:sticky!important;left:34px!important;z-index:10!important;background:#e9ecef!important}
tbody th.employee-name-cell{left:34px;background:#e9ecef!important}
.cell-wrap{position:relative;display:flex;align-items:center;height:46px;width:100%;padding-right:31px}
.cell{height:46px;text-align:center;font-weight:700!important;padding:6px 4px}
.cell-actions{position:absolute;right:3px;top:50%;transform:translateY(-50%);height:24px;display:flex;align-items:center;gap:2px;background:rgba(255,255,255,.92);border:1px solid #c8cdd2;border-radius:5px;padding:2px;box-shadow:0 1px 3px rgba(0,0,0,.12)}
.color-picker{width:18px!important;height:18px!important;padding:0!important;border:1px solid #9fa6ad!important;border-radius:3px!important;cursor:pointer}
.clear-cell{width:18px;height:18px;padding:0!important;border:0!important;background:transparent!important;font-size:16px;line-height:16px;color:#c62828;font-weight:800}.clear-cell:hover{background:#ffe5e5!important}
.plan-cell{vertical-align:middle!important;text-align:center!important}
.bold-cell .cell{font-weight:700!important}
@media print{
  .cell-actions{display:none!important}.number-head,.number-cell{position:static!important}
}