:root{font-family:Inter,system-ui,sans-serif;color:#172033;background:#f5f7fb}
*{box-sizing:border-box}body{margin:0}.hidden{display:none!important}
.center-card{width:min(420px,calc(100% - 32px));margin:8vh auto;background:#fff;padding:32px;border-radius:22px;box-shadow:0 20px 60px #1f2a4420;text-align:center}
.logo{font-size:58px}h1,h2,h3{margin-top:0}input,select,textarea{width:100%;padding:12px 14px;border:1px solid #d8deea;border-radius:11px;margin:6px 0;background:#fff;font:inherit;transition:.18s}
input:focus,select:focus,textarea:focus{outline:none;border-color:#4664df;box-shadow:0 0 0 3px #4664df1d}textarea{min-height:96px;resize:vertical}
button,.button{border:0;background:#3857d6;color:#fff;padding:11px 15px;border-radius:10px;cursor:pointer;text-decoration:none;display:inline-block;font:inherit;font-weight:650}
button:hover,.button:hover{filter:brightness(.96)}button:disabled{opacity:.55;cursor:not-allowed}.secondary{background:#eef1fb;color:#263b9d}.danger{background:#b42318}.compact{white-space:nowrap;padding:10px 12px}.icon-button{min-width:42px;padding:10px 12px}
.error{color:#b42318;margin-top:10px}.field-error{min-height:17px;color:#b42318;font-size:12px}.invalid{border-color:#d92d20!important;box-shadow:0 0 0 3px #d92d2015!important}
.muted{color:#657087;font-size:14px}small{display:block;color:#667085;font-size:12px;line-height:1.4;margin-top:2px}label{display:block;font-weight:700;font-size:14px;margin-bottom:3px;color:#22304a}.login-label{text-align:left;margin-top:10px}
#app{display:grid;grid-template-columns:240px 1fr;min-height:100vh}aside{background:#111b35;color:#fff;padding:22px;display:flex;flex-direction:column}.brand{font-weight:800;font-size:20px;margin-bottom:28px}nav{display:grid;gap:8px}nav button{background:transparent;text-align:left}nav button:hover{background:#ffffff15}.logout{margin-top:auto;background:#ffffff12}
main{padding:28px;min-width:0}header{display:flex;justify-content:space-between;align-items:center;margin-bottom:22px}.header-actions{display:flex;gap:8px;flex-wrap:wrap}
.cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.card{background:#fff;padding:18px;border-radius:16px;box-shadow:0 8px 30px #20305a0b}.metric{font-size:30px;font-weight:800}.toolbar{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:14px}.toolbar input{max-width:360px}.toolbar-spacer{flex:1}
.table-wrap{overflow:auto;border-radius:14px}table{width:100%;border-collapse:collapse;background:#fff;min-width:760px}th,td{text-align:left;padding:12px;border-bottom:1px solid #edf0f6;vertical-align:middle}th{background:#f8f9fc;font-size:13px;color:#4a556b}.actions-cell{display:flex;gap:7px;white-space:nowrap}.table-button{padding:8px 10px;font-size:13px}.product-thumb{width:48px;height:48px;border-radius:10px;object-fit:cover;background:#eef1f6;border:1px solid #e3e8f1}.product-thumb-empty{display:grid;place-items:center;color:#7b8496;font-size:20px}.product-name{font-weight:750}.subtext{font-size:12px;color:#697386;margin-top:2px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:18px}.form-card{background:#fff;padding:18px;border-radius:16px}.pill{padding:4px 8px;border-radius:999px;background:#eef1fb;font-size:12px}.negative{color:#b42318}.positive{color:#067647}
.modal{position:fixed;inset:0;background:#0b1020b5;display:flex;align-items:center;justify-content:center;padding:20px;z-index:9999}.modal-card{width:min(820px,100%);max-height:92vh;overflow:auto;background:#fff;border-radius:22px;padding:24px;box-shadow:0 30px 80px #00000038}.modal-large{width:min(1020px,100%)}.modal-small{width:min(460px,100%);text-align:center}.modal-header,.modal-footer{display:flex;justify-content:space-between;gap:16px;align-items:flex-start}.modal-header{margin-bottom:16px}.modal-footer{margin-top:18px;align-items:center}.modal-actions{display:flex;gap:10px;justify-content:flex-end;flex-wrap:wrap}.full-width{width:100%;margin-top:18px}.full-width button{flex:1}
.product-editor{display:grid;grid-template-columns:220px 1fr;gap:22px}.image-panel{background:#f8f9fc;border:1px solid #eaedf4;border-radius:16px;padding:14px;align-self:start}.image-preview{aspect-ratio:1/1;border-radius:13px;background:#edf1f7;border:1px dashed #c9d1df;display:grid;place-items:center;overflow:hidden;color:#7b8496;margin-bottom:12px}.image-preview img{width:100%;height:100%;object-fit:cover}.file-input{display:none}.file-button{display:block;background:#eef1fb;color:#263b9d;padding:10px 12px;border-radius:10px;text-align:center;cursor:pointer}.form-grid-two{display:grid;grid-template-columns:1fr 1fr;gap:12px 16px}.field-span-2{grid-column:span 2}.input-action-row{display:grid;grid-template-columns:1fr auto;gap:8px;align-items:center}.danger-icon{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;background:#fee4e2;color:#b42318;font-size:28px;font-weight:900;margin:0 auto 16px}.delete-hint{font-size:13px;background:#fff4ed;color:#9a3412;padding:10px;border-radius:10px}
.toast{position:fixed;right:24px;bottom:24px;background:#101828;color:#fff;padding:13px 16px;border-radius:12px;box-shadow:0 12px 35px #0003;z-index:12000}.toast.success{background:#067647}.toast.error-toast{background:#b42318}
@media(max-width:1000px){#app{grid-template-columns:1fr}.cards{grid-template-columns:repeat(2,minmax(0,1fr))}.grid2{grid-template-columns:1fr}.product-editor{grid-template-columns:1fr}.image-panel{max-width:260px}.field-span-2{grid-column:span 1}.form-grid-two{grid-template-columns:1fr}}
@media(max-width:560px){main{padding:16px}.cards{grid-template-columns:1fr}header{align-items:flex-start;gap:12px;flex-direction:column}.modal{padding:8px}.modal-card{padding:16px;border-radius:16px}.modal-header,.modal-footer{flex-direction:column}.modal-actions{width:100%}.modal-actions button{width:100%}.input-action-row{grid-template-columns:1fr}.image-panel{max-width:none}}

.product-filter-toolbar select{width:auto;min-width:210px;margin:0}.inline-category-input{margin:0;min-width:220px}.category-layout{align-items:start}.category-layout .form-card{position:sticky;top:18px}
@media(max-width:560px){.product-filter-toolbar input,.product-filter-toolbar select{max-width:none;width:100%}.category-layout .form-card{position:static}}

.switch-row{margin-bottom:8px}.switch-label{display:flex;align-items:center;gap:9px;font-weight:700;cursor:pointer}.switch-label input{width:auto;margin:0}.inline-category-number{width:90px;min-width:72px;margin:0}.sku-prefix-input{text-transform:uppercase;max-width:140px}code{background:#f1f4f9;border-radius:7px;padding:5px 7px;font-size:12px;white-space:nowrap}input:disabled{background:#eef2f7;color:#526078;cursor:not-allowed}

/* Kategorien V7.2 */
.category-page-card{width:100%;min-width:0}
.category-page-header{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;flex-wrap:wrap;margin-bottom:14px}
.category-table-scroll{width:100%;overflow-x:auto;padding-bottom:4px}
.category-table-scroll table{min-width:1040px}
.category-modal-card{width:min(760px,100%)}
.sku-preview-large{display:flex;align-items:center;min-height:49px;padding:12px 14px;border:1px solid #d8deea;border-radius:10px;background:#f6f8fc;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:20px;font-weight:800;color:#213b91}
@media(max-width:700px){.category-page-header>button{width:100%}.category-modal-card{width:100%}}


.mobile-topbar{display:none}
.mobile-nav-backdrop{display:none}

@media(max-width:1000px){
  body.mobile-nav-open{overflow:hidden}
  .mobile-topbar{display:flex;align-items:center;gap:12px;position:sticky;top:0;z-index:1200;background:#111b35;color:#fff;padding:14px 16px;box-shadow:0 8px 24px #0b102033}
  .mobile-topbar-title{font-weight:800;font-size:18px;line-height:1.2}
  .mobile-topbar-title span{font-size:11px;opacity:.7;margin-left:6px}
  .mobile-menu-button{display:grid;place-items:center;width:44px;height:44px;padding:0;border-radius:12px;background:#ffffff14;color:#fff;font-size:24px;line-height:1}
  #sidebar{position:fixed;top:0;left:0;bottom:0;width:min(320px,86vw);transform:translateX(-105%);transition:transform .22s ease;z-index:1400;overflow:auto;padding:18px 16px 24px;box-shadow:0 28px 60px #00000040}
  body.mobile-nav-open #sidebar{transform:translateX(0)}
  #sidebar nav{grid-template-columns:1fr;gap:10px}
  #sidebar .brand{margin-top:6px;margin-bottom:20px}
  #sidebar nav button,#sidebar .logout{border-radius:12px;padding:14px 16px;font-size:18px}
  .logout{margin-top:18px}
  .mobile-nav-backdrop{position:fixed;inset:0;background:#00000055;z-index:1300}
  body.mobile-nav-open .mobile-nav-backdrop{display:block}
  main{padding:18px 16px 24px}
  header{margin-bottom:18px}
  .header-actions{width:100%}
  .header-actions .button{flex:1;text-align:center}
  .toolbar{flex-direction:column;align-items:stretch}
  .toolbar input,.toolbar select,.toolbar button,.toolbar .button{width:100%;max-width:none}
  .card,.form-card{padding:16px}
}

@media(max-width:560px){
  .mobile-topbar-title{font-size:16px}
  .mobile-menu-button{width:42px;height:42px}
  #sidebar{width:min(300px,88vw)}
  table{min-width:640px}
}


/* V8.0 vollständige Mobile-Optimierung */
html{min-height:100%;background:#f5f7fb;-webkit-text-size-adjust:100%}
body{min-height:100%;padding-bottom:env(safe-area-inset-bottom)}
button,.button,input,select,textarea{touch-action:manipulation}
button,.button{min-height:44px}

@media(max-width:700px){
  body{background:#f5f7fb}
  .mobile-topbar{padding-top:calc(12px + env(safe-area-inset-top));padding-left:calc(14px + env(safe-area-inset-left));padding-right:calc(14px + env(safe-area-inset-right))}
  main{padding:16px max(14px,env(safe-area-inset-right)) 28px max(14px,env(safe-area-inset-left))}
  header h2{font-size:25px;margin-bottom:4px}
  #who{font-size:13px}
  .header-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}
  .header-actions .button{width:100%;padding:11px 8px;font-size:14px}
  .cards{grid-template-columns:1fr 1fr;gap:10px}
  .card,.form-card{border-radius:16px;padding:15px;box-shadow:0 5px 20px #20305a0a}
  .metric{font-size:26px}
  .grid2{gap:14px}
  h3{font-size:20px}
  input,select,textarea{font-size:16px;min-height:48px;margin:5px 0 10px}
  textarea{min-height:110px}
  .toolbar{gap:8px}
  .toolbar button,.toolbar .button{width:100%}
  .pill{display:inline-flex;align-items:center;white-space:nowrap}

  .table-wrap{overflow:visible;border-radius:0}
  .table-wrap table,.category-table-scroll table{display:block;min-width:0!important;background:transparent}
  .table-wrap thead,.category-table-scroll thead{display:none}
  .table-wrap tbody,.category-table-scroll tbody{display:grid;gap:12px}
  .table-wrap tr,.category-table-scroll tr{display:block;background:#fff;border:1px solid #e8ecf4;border-radius:15px;padding:8px 12px;box-shadow:0 5px 18px #20305a0a}
  .table-wrap td,.category-table-scroll td{display:grid;grid-template-columns:minmax(105px,38%) minmax(0,1fr);align-items:center;gap:10px;width:100%;padding:10px 0;border-bottom:1px solid #eef1f6;min-height:42px;word-break:break-word}
  .table-wrap td:last-child,.category-table-scroll td:last-child{border-bottom:0}
  .table-wrap td::before,.category-table-scroll td::before{content:attr(data-label);font-size:12px;font-weight:800;color:#667085;text-transform:none}
  .table-wrap td[data-label="Bild"]{grid-template-columns:1fr;justify-items:start}
  .table-wrap td[data-label="Bild"]::before{display:none}
  .table-wrap td[data-label="Aktionen"],.category-table-scroll td[data-label="Aktionen"]{grid-template-columns:1fr}
  .table-wrap td[data-label="Aktionen"]::before,.category-table-scroll td[data-label="Aktionen"]::before{margin-bottom:3px}
  .actions-cell{display:grid;grid-template-columns:1fr 1fr;gap:8px;width:100%;white-space:normal}
  .actions-cell button{width:100%;min-height:42px}
  .product-thumb{width:64px;height:64px}
  .category-table-scroll{overflow:visible;padding:0}
  .inline-category-input,.inline-category-number,.sku-prefix-input{width:100%;max-width:none;min-width:0;margin:0}
  code{white-space:normal;word-break:break-all}

  .modal{align-items:flex-end;padding:0;background:#0b1020a8}
  .modal-card,.modal-large,.category-modal-card{width:100%;max-width:none;max-height:94dvh;border-radius:22px 22px 0 0;padding:18px 16px calc(18px + env(safe-area-inset-bottom));overscroll-behavior:contain}
  .modal-small{width:100%}
  .modal-header{position:sticky;top:-18px;background:#fff;z-index:3;padding-top:18px;padding-bottom:10px}
  .modal-footer{position:sticky;bottom:calc(-18px - env(safe-area-inset-bottom));background:#fff;z-index:3;padding-top:10px;padding-bottom:calc(18px + env(safe-area-inset-bottom))}
  .product-editor{gap:14px}
  .image-panel{max-width:none;width:100%}
  .image-preview{max-height:240px;aspect-ratio:16/9}
  .form-grid-two{gap:6px}
  .modal-actions{display:grid;grid-template-columns:1fr 1fr}
  .modal-actions button{width:100%}
  .full-width{display:grid;grid-template-columns:1fr 1fr}
  .toast{left:14px;right:14px;bottom:calc(14px + env(safe-area-inset-bottom));text-align:center}
}

@media(max-width:390px){
  .cards{grid-template-columns:1fr}
  .header-actions{grid-template-columns:1fr}
  .actions-cell,.modal-actions,.full-width{grid-template-columns:1fr}
  .table-wrap td,.category-table-scroll td{grid-template-columns:1fr;gap:4px}
}


/* Barcode V8.1 */
.barcode-preview{margin-top:10px;min-height:92px;display:flex;align-items:center;justify-content:center;padding:10px;background:#fff;border:1px solid #d8deea;border-radius:12px;overflow:hidden;color:#667085}
.barcode-svg{display:block;width:100%;max-width:520px;height:auto;shape-rendering:crispEdges}
.barcode-svg rect{fill:#000}.barcode-svg>rect:first-child{fill:#fff}.barcode-svg text{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px;letter-spacing:1.5px;fill:#111}
.barcode-cell{width:190px;max-width:100%;padding:4px;background:#fff;border:1px solid #e4e7ec;border-radius:8px}
.barcode-cell .barcode-svg{max-width:180px}
.barcode-fallback{display:flex;flex-direction:column;align-items:center;gap:3px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;color:#172033}
@media(max-width:560px){.barcode-preview{min-height:86px}.barcode-cell{width:100%;max-width:240px}.barcode-cell .barcode-svg{max-width:230px}}


/* Druckdialog und Etikettenlayouts V8.3 */
.print-modal-card{width:min(760px,100%)}
.print-options-box{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;padding:14px;border:1px solid #e2e7f0;border-radius:14px;background:#f8f9fc}
.print-options-box .switch-label{margin:0}
.print-selection-info{margin-top:14px;padding:12px 14px;border-radius:12px;background:#eef3ff;color:#263b9d;max-height:120px;overflow:auto;font-size:14px}
@media(max-width:560px){.print-options-box{grid-template-columns:1fr}.print-modal-card{width:100%}}

.print-label-preview{min-height:190px;border:1px dashed #bdc7d8;border-radius:14px;background:#eef2f7;display:flex;align-items:center;justify-content:center;padding:18px;overflow:auto}
.preview-label{width:350px;max-width:100%;min-height:185px;background:#fff;border:1px solid #aeb7c5;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:16px;border-radius:4px;box-shadow:0 8px 24px #20305a18}
.preview-label-small{width:285px;min-height:170px}
.preview-label .label-name{font-size:18px;font-weight:800;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.preview-label-small .label-name{font-size:15px}
.preview-label .label-sku{font-size:13px;margin-top:5px}
.preview-label .label-barcode{width:100%;margin-top:6px}
.preview-label .label-price{font-size:19px;font-weight:800;margin-top:4px}
.preview-label .label-meta{font-size:12px;color:#475467;margin-top:4px}
.preview-a4{width:100%;max-width:520px;background:#fff;border:1px solid #cbd2dc;padding:20px;display:grid;gap:10px;border-radius:8px;box-shadow:0 8px 24px #20305a18}
.preview-a4 strong{font-size:22px}.preview-a4 span{color:#667085}.preview-a4 b{font-size:20px}
@media(max-width:560px){.print-label-preview{min-height:170px;padding:10px}.preview-label{min-height:155px;padding:10px}.preview-label-small{min-height:145px}}


/* Scanner V8.4 */
.scanner-page{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(340px,.85fr);gap:18px;align-items:start}
.scanner-control-card{position:sticky;top:18px}.scanner-page-head,.scanner-history-head{display:flex;justify-content:space-between;gap:14px;align-items:flex-start;flex-wrap:wrap}.scanner-settings{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 14px;margin-top:16px}.scanner-input-block{margin-top:14px}.scanner-input-row{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:10px;margin-top:4px;align-items:center}.scanner-input-row input{font-size:19px;padding:15px}.scanner-camera-actions{display:flex;gap:10px;margin-top:12px}.scanner-camera-box{position:relative;margin-top:14px;background:#07101f;border-radius:16px;overflow:hidden;aspect-ratio:4/3}.scanner-camera-box video{width:100%;height:100%;object-fit:cover}.scanner-camera-frame{position:absolute;left:10%;right:10%;top:38%;height:24%;border:3px solid #65d48d;border-radius:12px;box-shadow:0 0 0 999px #0005}.scanner-status{margin-top:14px;padding:13px 15px;border-radius:12px;font-weight:650}.scanner-status.info{background:#eef4ff;color:#2643a2}.scanner-status.success{background:#ecfdf3;color:#067647}.scanner-status.error{background:#fff1f0;color:#b42318}.scanner-result-column{display:grid;gap:18px}.scan-result-card{display:grid;grid-template-columns:90px 1fr;gap:16px;align-items:center}.scan-result-card img,.scan-result-icon{width:90px;height:90px;border-radius:14px;object-fit:cover;background:#eef1f6;border:1px solid #e2e7ef}.scan-result-icon{display:grid;place-items:center;font-size:34px;color:#6b7690}.scan-result-card h3{margin-bottom:5px}.scan-stock-number{font-size:30px;font-weight:850;margin-top:10px}.scanner-history-item{display:flex;justify-content:space-between;gap:12px;padding:12px 0;border-bottom:1px solid #edf0f6}.scanner-history-item:last-child{border-bottom:0}.scanner-history-item>div{display:grid;gap:4px}.scanner-history-item>div:last-child{text-align:right;justify-items:end}.scanner-history-item span{font-size:12px;color:#667085}.scan-product-summary{display:grid;gap:5px;background:#f7f9fc;border:1px solid #e5eaf2;border-radius:12px;padding:14px;margin-bottom:14px}.scan-product-summary span{font-size:13px;color:#667085}.scan-quantity-modal{text-align:left}
@media(max-width:1000px){.scanner-page{grid-template-columns:1fr}.scanner-control-card{position:static}}
@media(max-width:620px){.scanner-settings{grid-template-columns:1fr}.scanner-input-row{grid-template-columns:1fr}.scanner-input-row button,.scanner-camera-actions button{width:100%}.scanner-camera-actions{flex-direction:column}.scan-result-card{grid-template-columns:68px 1fr}.scan-result-card img,.scan-result-icon{width:68px;height:68px}.scan-stock-number{font-size:25px}.scanner-history-item{align-items:flex-start}.scanner-history-item>div:last-child{min-width:95px}}

/* Safari/iOS Kamera-Fallback V8.6 */
.scanner-camera-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}
.scanner-camera-note{margin:8px 0 0}
.scanner-camera-box video{width:100%;height:100%;object-fit:cover}
@media(max-width:560px){.scanner-camera-actions{display:grid;grid-template-columns:1fr}.scanner-camera-actions button{width:100%}}

/* Mobile keyboard V8.8 */
@media(max-width:620px){#scannerInput{font-size:18px;min-height:52px}.scanner-keyboard-button{display:block}}
@media(min-width:621px){.scanner-keyboard-button{display:none}}


/* V9.0 – kompaktes iPhone-Menü */
.sidebar-header{display:flex;align-items:center;justify-content:space-between;gap:10px;flex:0 0 auto}
.sidebar-close{display:none}

@media(max-width:1000px){
  #sidebar{
    top:0;
    bottom:0;
    width:min(310px,82vw);
    height:100dvh;
    max-height:100dvh;
    overflow:hidden;
    padding:
      calc(env(safe-area-inset-top,0px) + 12px)
      calc(12px + env(safe-area-inset-right,0px))
      calc(env(safe-area-inset-bottom,0px) + 12px)
      calc(12px + env(safe-area-inset-left,0px));
    display:flex;
    flex-direction:column;
  }
  #sidebar .sidebar-header{min-height:48px;padding:0 2px 10px;border-bottom:1px solid #ffffff14}
  #sidebar .brand{display:flex;align-items:center;gap:7px;margin:0;min-width:0;font-size:17px;line-height:1.15;white-space:nowrap}
  #sidebar .brand span{overflow:hidden;text-overflow:ellipsis}
  #sidebar .brand small{font-size:10px;font-weight:700;opacity:.6;flex:0 0 auto}
  .sidebar-close{display:grid;place-items:center;flex:0 0 auto;width:42px;height:42px;min-height:42px;padding:0;border-radius:11px;background:#ffffff12;color:#fff;font-size:19px}
  #sidebar nav{
    display:flex;
    flex-direction:column;
    gap:3px;
    min-height:0;
    flex:1 1 auto;
    overflow-y:auto;
    overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;
    padding:8px 0;
    scrollbar-width:thin;
  }
  #sidebar nav button{
    flex:0 0 auto;
    width:100%;
    min-height:43px;
    padding:10px 12px;
    border-radius:10px;
    font-size:15.5px;
    line-height:1.2;
    font-weight:650;
  }
  #sidebar nav button:active{background:#ffffff1f}
  #sidebar .logout{
    flex:0 0 auto;
    width:100%;
    min-height:46px;
    margin:8px 0 0;
    padding:11px 14px;
    border-radius:11px;
    font-size:16px;
  }
  .mobile-nav-backdrop{padding:0}
}

@media(max-width:430px){
  #sidebar{width:min(292px,84vw)}
  #sidebar nav button{font-size:15px;min-height:41px;padding:9px 11px}
  #sidebar .brand{font-size:16px}
}

@media(max-height:700px) and (max-width:1000px){
  #sidebar nav{gap:1px;padding:5px 0}
  #sidebar nav button{min-height:37px;padding:7px 10px;font-size:14px}
  #sidebar .logout{min-height:40px;padding:8px 12px}
}

.cards.cards-three{grid-template-columns:repeat(3,minmax(0,1fr))}
@media(max-width:1000px){.cards.cards-three{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.cards.cards-three{grid-template-columns:1fr}}

.status-active{background:#ecfdf3;color:#067647}.status-inactive{background:#f2f4f7;color:#667085}.section-heading{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;flex-wrap:wrap;margin-bottom:14px}


/* Inventur V9.3 */
.nav-badge{display:inline-grid;place-items:center;min-width:22px;height:22px;padding:0 6px;margin-left:auto;border-radius:999px;background:#3857d6;color:#fff;font-size:12px}
#inventoryNavButton{display:flex;align-items:center;gap:8px;width:100%}
.inventory-create-card{display:grid;grid-template-columns:minmax(220px,1fr) minmax(440px,2fr);gap:24px;align-items:end;margin-bottom:18px}
.inventory-create-form{display:grid;grid-template-columns:1fr 1fr auto;gap:12px;align-items:end}.inventory-create-form .field{margin:0}.inventory-create-form button{height:48px;margin-bottom:6px}
.inventory-list{display:grid;gap:14px}.inventory-list-card{background:#fff;border-radius:16px;padding:18px;box-shadow:0 8px 30px #20305a0b;border-left:5px solid #3857d6}.inventory-list-card.completed{border-left-color:#067647}.inventory-list-card.cancelled{border-left-color:#98a2b3}
.inventory-card-main,.inventory-stats,.inventory-card-actions,.inventory-workspace-header,.inventory-header-actions,.inventory-toolbar,.inventory-scan-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.inventory-card-main,.inventory-workspace-header{justify-content:space-between}.inventory-card-main h3,.inventory-workspace-header h3{margin:8px 0 4px}.inventory-progress{height:10px;background:#edf1f7;border-radius:999px;overflow:hidden;margin:14px 0 8px}.inventory-progress span{display:block;height:100%;background:#3857d6;border-radius:inherit}.inventory-progress.large{height:14px;flex:1;min-width:220px;margin:0}.inventory-stats{justify-content:space-between;color:#657087;font-size:13px}.inventory-card-actions{margin-top:14px}.inventory-workspace-header{margin-bottom:16px}.inventory-metrics{margin-bottom:16px}.inventory-progress-card{display:flex;align-items:center;gap:18px;margin-bottom:16px}.inventory-scan-card{margin-bottom:16px}.inventory-scan-card h3{margin-bottom:4px}.inventory-scan-row input:first-child{flex:1;min-width:240px}.inventory-scan-row input[type=number]{width:110px}.inventory-toolbar{margin-bottom:14px}.inventory-toolbar>input{flex:1;min-width:230px;max-width:none}.inventory-toolbar select{width:auto;min-width:180px}.inventory-count-control{display:flex;gap:7px;align-items:center}.inventory-count-control input{width:100px;margin:0}.inventory-count-control button{white-space:nowrap}
@media(max-width:900px){.inventory-create-card{grid-template-columns:1fr}.inventory-create-form{grid-template-columns:1fr}.inventory-create-form button{width:100%}.inventory-progress-card{align-items:flex-start;flex-direction:column}.inventory-progress.large{width:100%}.inventory-toolbar{align-items:stretch;flex-direction:column}.inventory-toolbar>input,.inventory-toolbar select{width:100%;min-width:0}.inventory-scan-row{align-items:stretch;flex-direction:column}.inventory-scan-row input:first-child,.inventory-scan-row input[type=number],.inventory-scan-row button{width:100%;min-width:0}.inventory-header-actions{width:100%}.inventory-header-actions button{flex:1}.inventory-count-control{align-items:stretch;flex-direction:column}.inventory-count-control input,.inventory-count-control button{width:100%}}

.permissions-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.permission-group{border:1px solid #e5e9f2;border-radius:14px;padding:14px;background:#fafbfe}.permission-group h4{margin:0 0 10px}.permission-item{display:flex;align-items:flex-start;gap:9px;padding:8px 0;border-bottom:1px solid #edf0f6}.permission-item:last-child{border-bottom:0}.permission-item input{width:auto;margin:2px 0 0}.permissions-actions{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px}@media(max-width:700px){.permissions-grid{grid-template-columns:1fr}.permissions-modal-card{height:calc(100dvh - 16px);max-height:none}.permissions-modal-card .modal-footer{position:sticky;bottom:0;background:#fff;padding-top:10px}}


/* V9.4.3 – kleiner Mobile-Header und sauberer App-Flow */
@media(max-width:1000px){
  #app{display:block;min-height:100vh}
  .mobile-topbar{
    position:sticky;
    top:0;
    min-height:0;
    padding:calc(env(safe-area-inset-top,0px) + 10px) calc(14px + env(safe-area-inset-right,0px)) 10px calc(14px + env(safe-area-inset-left,0px));
    align-items:center;
    gap:10px;
  }
  .mobile-menu-button{
    width:40px;
    height:40px;
    min-height:40px;
    border-radius:10px;
    font-size:22px;
    flex:0 0 auto;
  }
  .mobile-topbar-title{
    display:flex;
    align-items:baseline;
    gap:8px;
    min-width:0;
    font-size:15px;
    line-height:1.1;
    font-weight:800;
  }
  .mobile-topbar-title span{
    margin-left:0;
    font-size:10px;
    line-height:1;
    white-space:nowrap;
    opacity:.72;
  }
  main{
    padding:14px max(14px,env(safe-area-inset-right)) calc(24px + env(safe-area-inset-bottom,0px)) max(14px,env(safe-area-inset-left));
  }
  header{
    margin-bottom:14px;
    gap:8px;
  }
  header h2{
    font-size:21px;
    line-height:1.15;
    margin:0 0 2px;
  }
  #who{font-size:13px}
}

@media(max-width:560px){
  .mobile-topbar{padding:calc(env(safe-area-inset-top,0px) + 8px) calc(12px + env(safe-area-inset-right,0px)) 8px calc(12px + env(safe-area-inset-left,0px))}
  .mobile-topbar-title{font-size:14px;gap:6px}
  .mobile-topbar-title span{font-size:9.5px}
  .mobile-menu-button{width:38px;height:38px;min-height:38px;font-size:20px}
  main{padding:12px max(12px,env(safe-area-inset-right)) calc(20px + env(safe-area-inset-bottom,0px)) max(12px,env(safe-area-inset-left))}
  header h2{font-size:19px}
  .card,.form-card{padding:14px;border-radius:14px}
}


/* V9.4.4 – Buchungsformular oben und fixiert */
.movements-layout{display:grid;grid-template-columns:minmax(320px,380px) minmax(0,1fr);gap:18px;align-items:start}
.movement-book-card{position:sticky;top:18px}
.movement-list-card{min-width:0}
.movement-card-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;flex-wrap:wrap;margin-bottom:14px}
@media(max-width:1000px){
  .movements-layout{grid-template-columns:1fr}
  .movement-book-card{position:static;order:-1}
}
@media(max-width:560px){
  .movement-card-head{margin-bottom:10px}
  .movement-book-card,.movement-list-card{padding:14px}
}


/* V9.5 Recht & Datenschutz */
.login-legal-links,.public-legal-footer,.app-legal-footer,.legal-nav{display:flex;gap:12px;flex-wrap:wrap;justify-content:center;font-size:13px}.login-legal-links{margin-top:14px}.app-legal-footer{margin:28px 0 4px;padding:18px 8px;border-top:1px solid #e3e8f1}.app-legal-footer a,.login-legal-links a,.public-legal-footer a{color:#4158b8}.public-legal-footer{padding:20px}.register-card{max-width:620px!important;text-align:left}.register-card h1,.register-card>.logo,.register-card>p{text-align:center}.register-consents{display:grid;gap:10px;margin-top:14px}.legal-check{display:flex;align-items:flex-start;gap:9px;font-weight:500;line-height:1.4}.legal-check input{width:auto;margin:3px 0 0;flex:0 0 auto}.legal-body{background:#f5f7fb;color:#172033}.legal-top{background:#111b35;padding:18px max(20px,calc((100vw - 900px)/2));}.legal-top a{color:#fff;text-decoration:none;font-weight:800;font-size:19px}.legal-container{max-width:900px;margin:28px auto;padding:28px;background:#fff;border-radius:18px;box-shadow:0 10px 34px #20305a10}.legal-container h1{font-size:32px}.legal-container h2{font-size:20px;margin-top:30px;margin-bottom:8px}.legal-container p,.legal-container li{line-height:1.65}.legal-version{color:#667085}.legal-warning,.legal-draft,.legal-info{padding:14px 16px;border-radius:12px;margin-bottom:20px}.legal-warning{background:#fff1f0;color:#9f1c14;border:1px solid #f7c6c2}.legal-draft{background:#fff6df;color:#7a4d00;border:1px solid #f4d88a}.legal-info{background:#eef4ff;color:#2643a2;border:1px solid #cad7ff}.legal-nav{max-width:900px;margin:0 auto;padding:16px 20px}.legal-nav a{color:#263b9d}.legal-page-footer{text-align:center;color:#667085;padding:12px 20px 32px}.legal-form{display:grid;gap:10px;max-width:620px}.legal-success{margin-top:12px;color:#067647;font-weight:700}@media(max-width:700px){.legal-container{margin:0;padding:20px 16px;border-radius:0;box-shadow:none}.legal-container h1{font-size:26px}.legal-top{padding-top:calc(14px + env(safe-area-inset-top));}.app-legal-footer{gap:9px;font-size:12px}}


/* V9.6.2 – B2B-Registrierung */
.register-card{width:min(760px,calc(100% - 28px));max-width:760px!important;margin:3vh auto;padding:28px}.registration-section{margin-top:18px;padding:17px;border:1px solid #e3e8f1;border-radius:15px;background:#fafbfe}.registration-section h3{margin-bottom:12px}.register-submit{width:100%;margin-top:16px}.register-card select{margin:6px 0}.register-card .form-grid-two{align-items:start}@media(max-width:700px){.register-card{width:100%;margin:0;border-radius:0;padding:20px 14px;box-shadow:none}.registration-section{padding:14px}.register-card .form-grid-two{grid-template-columns:1fr}.register-card .field-span-2{grid-column:span 1}}


/* V10.2 – echtes Dashboard mit Diagrammen */
.dashboard-secondary-metrics{margin-top:16px}
.dashboard-chart-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:16px;margin-top:16px}
.dashboard-chart-wide{grid-column:1 / -1}
.dashboard-chart-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}
.dashboard-chart-head h3,.dashboard-chart-grid h3{margin-bottom:4px}
.dash-line-wrap{width:100%;overflow:hidden}
.dash-line-wrap svg{display:block;width:100%;height:auto;min-height:190px}
.dash-axis{stroke:#d9dfeb;stroke-width:1.5}
.dash-line{fill:none;stroke-width:4;stroke-linecap:round;stroke-linejoin:round}
.dash-line-in{stroke:#3158d8}.dash-line-out{stroke:#e4753d}
.dash-label{font-size:12px;fill:#657087}
.dash-legend{display:flex;gap:18px;flex-wrap:wrap;font-size:13px;color:#657087}
.dash-legend span{display:flex;align-items:center;gap:7px}.dash-legend i{width:11px;height:11px;border-radius:50%;display:inline-block}
.legend-in{background:#3158d8}.legend-out{background:#e4753d}
.dash-bars{display:grid;gap:14px;margin-top:12px}
.dash-bar-row{display:grid;gap:7px}.dash-bar-label{display:flex;justify-content:space-between;gap:12px;font-size:13px}.dash-bar-label span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dash-bar-track{height:10px;background:#edf1f7;border-radius:999px;overflow:hidden}.dash-bar-fill{height:100%;background:linear-gradient(90deg,#3158d8,#54a8ff);border-radius:999px}.dashboard-lists{margin-top:16px}
@media(max-width:850px){.dashboard-chart-grid{grid-template-columns:1fr}.dashboard-chart-wide{grid-column:auto}}
@media(max-width:560px){.dashboard-secondary-metrics{margin-top:12px}.dashboard-chart-grid{margin-top:12px;gap:12px}.dash-line-wrap svg{min-height:170px}.dash-label{font-size:10px}}


/* V10.3 – echte iPhone-Bottom-Navigation */
.mobile-bottom-nav{display:none}
@media(max-width:700px){
  #app{padding-bottom:calc(78px + env(safe-area-inset-bottom,0px))}
  main{padding-bottom:calc(28px + env(safe-area-inset-bottom,0px))}
  .mobile-bottom-nav{
    position:fixed;
    left:0;
    right:0;
    bottom:0;
    z-index:1250;
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    align-items:end;
    min-height:68px;
    padding:8px 8px calc(7px + env(safe-area-inset-bottom,0px));
    background:rgba(255,255,255,.97);
    border-top:1px solid #dfe5ef;
    box-shadow:0 -8px 28px rgba(17,27,53,.12);
    backdrop-filter:blur(16px);
    -webkit-backdrop-filter:blur(16px);
  }
  .mobile-bottom-item{
    min-width:0;
    min-height:54px;
    padding:5px 2px 2px;
    border-radius:12px;
    background:transparent;
    color:#667085;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:flex-end;
    gap:3px;
    font-size:10px;
    font-weight:750;
    line-height:1;
  }
  .mobile-bottom-item:hover{filter:none;background:#f4f6fb}
  .mobile-bottom-item.active{color:#1746c6;background:transparent}
  .mobile-bottom-icon{display:grid;place-items:center;height:24px;font-size:21px;line-height:1}
  .mobile-bottom-scan{position:relative;overflow:visible;padding-top:0}
  .mobile-scan-button{
    width:52px;
    height:52px;
    margin-top:-24px;
    display:grid;
    place-items:center;
    border-radius:50%;
    background:linear-gradient(145deg,#163b9f,#0d2f8d);
    color:#fff;
    border:4px solid #fff;
    box-shadow:0 8px 18px rgba(22,59,159,.32);
    font-size:27px;
    line-height:1;
  }
  .mobile-bottom-scan span:last-child{margin-top:1px}
  .app-legal-footer{margin-bottom:8px}
}
@media(max-width:380px){
  .mobile-bottom-item{font-size:9px}
  .mobile-scan-button{width:48px;height:48px;font-size:24px}
}


/* V10.4 – offene Inventuren auf der Startseite */
.dashboard-open-inventories{margin-top:18px}
.dashboard-list-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;flex-wrap:wrap;margin-bottom:12px}
.dashboard-inventory-item{width:100%;display:grid;grid-template-columns:minmax(0,1fr) minmax(100px,180px) auto;align-items:center;gap:14px;background:#f8f9fc;color:#172033;text-align:left;margin-top:8px;padding:12px 14px;border:1px solid #e6eaf2}
.dashboard-inventory-item:hover{background:#f1f4fb}
.dashboard-inventory-item>div:first-child{display:grid;gap:3px}
.dashboard-inventory-item span{font-size:12px;color:#667085;font-weight:500}
.dashboard-inventory-progress{height:8px;border-radius:999px;background:#e8edf5;overflow:hidden}
.dashboard-inventory-progress span{display:block;height:100%;background:#3857d6;border-radius:999px}
@media(max-width:620px){.dashboard-inventory-item{grid-template-columns:1fr auto}.dashboard-inventory-progress{grid-column:1/-1;grid-row:2}.dashboard-list-head button{width:100%}}


/* V10.5 – kommerzielles Dashboard auf Basis der echten Oberfläche */
.dashboard-quick-actions{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:16px;padding:18px 20px;background:#fff;border-radius:18px;box-shadow:0 8px 30px #20305a0b}
.dashboard-quick-actions h3{margin:0 0 3px}
.dashboard-quick-grid{display:grid;grid-template-columns:repeat(4,minmax(120px,1fr));gap:10px;flex:1;max-width:760px}
.dashboard-quick-grid button{display:grid;grid-template-columns:34px 1fr;grid-template-rows:auto auto;column-gap:10px;align-items:center;text-align:left;background:#f1f4fc;color:#172033;padding:11px 13px;border:1px solid #e1e7f2}
.dashboard-quick-grid button:hover{background:#e8edfb;filter:none}
.dashboard-quick-grid button>span{grid-row:1/3;display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:#3857d6;color:#fff;font-size:20px}
.dashboard-quick-grid b{font-size:14px}.dashboard-quick-grid small{margin:0;font-size:11px;font-weight:500}
.dashboard-primary-metrics .card{min-height:110px}
.metric-card{display:flex;align-items:center;gap:15px}.metric-icon{width:46px;height:46px;flex:0 0 auto;display:grid;place-items:center;border-radius:13px;background:#eef2ff;color:#3158d8;font-size:23px;font-weight:800}
.status-card{border-left:4px solid transparent}.status-card.status-attention{border-left-color:#3158d8}.status-card.status-warning{border-left-color:#e4753d}
.dashboard-list-head h3{margin-bottom:3px}
@media(max-width:1100px){.dashboard-quick-actions{align-items:flex-start;flex-direction:column}.dashboard-quick-grid{width:100%;max-width:none}}
@media(max-width:700px){.dashboard-quick-actions{padding:14px;margin-bottom:12px}.dashboard-quick-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.dashboard-quick-grid button{grid-template-columns:30px 1fr;padding:9px}.dashboard-quick-grid button>span{width:30px;height:30px;font-size:17px}.dashboard-primary-metrics .card{min-height:90px}.metric-icon{width:40px;height:40px;font-size:20px}}
@media(max-width:380px){.dashboard-quick-grid{grid-template-columns:1fr}}


/* V10.6 – Lieferanten/Kunden und Footer */
.app-legal-footer{display:grid;gap:10px;justify-items:center}
.footer-legal-links{display:flex;gap:12px;flex-wrap:wrap;justify-content:center}
.footer-meta{font-size:12px;color:#7a8498;text-align:center}
.party-grid{align-items:start}.party-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:12px}.party-head h3{margin:0}.party-search{margin:0 0 12px;max-width:none}.party-forms{margin-top:18px}.empty-state{display:grid;place-items:center;text-align:center;gap:6px;min-height:150px;padding:24px;border:1px dashed #d8deea;border-radius:14px;background:#fafbfe;color:#667085}.empty-state strong{color:#172033}.actions-cell button:disabled{opacity:.45}.mobile-topbar-title span,.brand small{display:none!important}
@media(max-width:700px){.party-grid,.party-forms{grid-template-columns:1fr}.footer-legal-links{gap:8px}.app-legal-footer{padding-bottom:18px}}


/* V10.7 – Shiny Stock Designsystem und SVG-Icons */
:root{font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;--brand:#2563eb;--brand-dark:#1746c6;--nav:#101b36;--surface:#fff;--text:#0f172a}
.ui-icon{width:20px;height:20px;display:block;flex:0 0 auto}
.login-brand-logo{display:block;width:min(310px,88%);height:auto;margin:0 auto 16px}.center-card>button{width:100%;display:inline-flex;justify-content:center;align-items:center;gap:8px}
.mobile-topbar-title img{width:30px;height:30px}.mobile-brand-name{font-size:17px!important;opacity:1!important;margin:0!important;color:#fff}
#sidebar .brand{gap:10px!important}#sidebar .brand img{width:38px;height:38px;flex:0 0 auto}#sidebar .brand>span{display:grid;gap:1px;overflow:visible!important}#sidebar .brand strong{font-size:18px;line-height:1.1}#sidebar .brand small{display:block!important;color:#91a3ca;font-size:9px;letter-spacing:.08em;text-transform:uppercase;margin:0}
#sidebar nav button,#sidebar .logout{display:flex;align-items:center;gap:12px;color:#d8e2f7;position:relative;transition:background .18s,color .18s,transform .18s;border:1px solid transparent}
#sidebar nav button .ui-icon,#sidebar .logout .ui-icon{width:19px;height:19px;color:#91a8d8}
#sidebar nav button:hover{background:#ffffff10;color:#fff;transform:translateX(2px)}
#sidebar nav button.active{background:linear-gradient(135deg,#285fd7,#1746c6);color:#fff;box-shadow:0 8px 20px #07163255;border-color:#ffffff18}
#sidebar nav button.active .ui-icon{color:#fff}.nav-badge{margin-left:auto}
#sidebar .logout{justify-content:flex-start}.header-actions button,.header-actions .button{display:inline-flex;align-items:center;justify-content:center;gap:8px}.header-actions .ui-icon{width:17px;height:17px}
.metric-icon .ui-icon{width:25px;height:25px}.dashboard-quick-grid button>span .ui-icon{width:20px;height:20px}.dashboard-quick-grid button>span{font-size:0}
button.icon-button{display:inline-grid;place-items:center}.table-button{display:inline-flex;align-items:center;justify-content:center;gap:6px}
.mobile-bottom-icon .ui-icon{width:22px;height:22px}.mobile-scan-button .ui-icon{width:28px;height:28px}.mobile-bottom-item.active .ui-icon{stroke-width:2.2}
.app-legal-footer{border-top:1px solid #e6ebf3;margin-top:30px;padding-top:20px}
@media(min-width:1001px){#sidebar{padding:22px 16px}.sidebar-header{padding:0 6px}.brand{margin-bottom:24px!important}#sidebar nav{gap:5px}#sidebar nav button{padding:12px 13px;border-radius:11px;font-size:15px}}
@media(max-width:700px){.mobile-topbar-title{display:flex!important}.mobile-topbar-title .mobile-brand-name{display:inline!important}.header-actions .button{gap:6px}.header-actions .ui-icon{width:16px;height:16px}}


/* V10.8 Lagerverwaltung */
.warehouse-page-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(300px,380px);gap:18px;align-items:start}
.warehouse-list-column,.warehouse-form-column{min-width:0}
.warehouse-form-column{position:sticky;top:18px}
.warehouse-section-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;flex-wrap:wrap;margin-bottom:14px}
.warehouse-edit-modal{text-align:left}
.actions-cell .table-button{display:inline-flex;align-items:center;gap:6px}
.actions-cell .table-button svg{width:16px;height:16px}
@media(max-width:1000px){.warehouse-page-layout{grid-template-columns:1fr}.warehouse-form-column{position:static;order:-1}}
@media(max-width:560px){.warehouse-section-head{margin-bottom:10px}.actions-cell .table-button span{display:none}.actions-cell .table-button{min-width:42px;justify-content:center}}
.plan-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin:18px 0}.plan-card{display:flex;flex-direction:column;gap:10px}.plan-card.selected{outline:2px solid #2563eb}.plan-card ul{margin:0 0 10px 18px;flex:1}.billing-summary strong{text-transform:none}@media(max-width:900px){.plan-grid{grid-template-columns:1fr}}