:root{
  --bg:#e9edf2;
  --panel:#ffffff;
  --ink:#1d2430;
  --muted:#748091;
  --line:#d8dee7;
  --dark:#202631;
  --dark-2:#171c24;
  --accent:#F54325;
  --accent-dark:#d93419;
  --accent-soft:#fff0ec;
  --green:#57b879;
  --required:#F54325;
  --sheet:#f7f8fa;
  --shadow:0 8px 30px rgba(17,24,39,.08)
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);background:var(--bg)}
button,input,select{font:inherit}
button{cursor:pointer}
.topbar{height:68px;background:var(--dark);color:#fff;display:flex;align-items:center;justify-content:space-between;padding:0 24px;position:sticky;top:0;z-index:10}
.brand{display:flex;align-items:center;gap:12px}.brand-mark{width:38px;height:38px;border-radius:10px;background:var(--accent);display:grid;place-items:center;font-weight:900;font-size:22px}
.brand strong{display:block;font-size:17px}.brand span{display:block;font-size:11px;color:#aeb7c5;margin-top:2px}
.header-actions,.export-actions{display:flex;gap:8px;flex-wrap:wrap}
.btn{border:0;border-radius:9px;padding:10px 14px;font-weight:700;transition:.15s}
.btn.primary{background:var(--accent);color:#fff}.btn.primary:hover{background:var(--accent-dark)}
.btn.secondary{background:#fff;color:var(--dark);border:1px solid var(--line)}
.topbar .btn.secondary{background:#202938;color:#fff;border-color:#374151}
.btn:disabled{opacity:.45;cursor:not-allowed}
.file-btn input{display:none}
.app-shell{display:grid;grid-template-columns:420px minmax(0,1fr);min-height:calc(100vh - 68px)}
.sidebar{padding:18px;overflow:auto;border-right:1px solid var(--line);background:#f5f6f8}
.panel{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:16px;margin-bottom:14px;box-shadow:0 2px 10px rgba(17,24,39,.035)}
.panel-title{display:flex;align-items:center;gap:10px;margin-bottom:14px}.panel-title h2{font-size:15px;margin:0}.step{width:25px;height:25px;border-radius:8px;background:var(--dark);color:#fff;display:grid;place-items:center;font-size:12px;font-weight:800}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:11px}.full{grid-column:1/-1}
label{display:flex;flex-direction:column;gap:6px;color:#424b5a;font-size:12px;font-weight:700}
input,select{width:100%;border:1px solid #cfd6df;border-radius:8px;background:#fff;padding:10px;color:var(--ink);outline:none}
input:focus,select:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(245,67,37,.11)}
.toggle{flex-direction:row;align-items:center;font-size:13px;font-weight:600}.toggle input{width:17px;height:17px}
.hint{font-size:12px;color:var(--muted);margin:-5px 0 12px;line-height:1.45}.optional-panel{border-left:4px solid var(--green)}
.part-list{display:flex;flex-direction:column;gap:8px}.part-row{display:grid;grid-template-columns:minmax(90px,1.4fr) 62px 12px 62px 52px 30px 30px;gap:5px;align-items:center}
.part-row input{padding:8px;font-size:12px}.part-row>span{text-align:center;color:var(--muted)}
.icon-btn{border:0;background:#f1f3f6;color:#555;border-radius:7px;height:32px;font-size:18px}.icon-btn:hover{background:#fee5e1;color:var(--accent)}
.mini-toggle input{display:none}.mini-toggle span{height:32px;border-radius:7px;background:#e8ebef;display:grid;place-items:center;color:#8992a0}.mini-toggle input:checked+span{background:#e8f7ed;color:#278a4d}
.add-row{width:100%;margin-top:10px;padding:9px;border:1px dashed #b9c2ce;background:#fafbfc;border-radius:8px;color:#4d5868;font-weight:700}
.calculate-btn{width:100%;margin-top:13px;padding:13px}.status{font-size:12px;color:var(--muted);margin-top:10px;text-align:center}
.workspace{min-width:0;padding:18px;display:flex;flex-direction:column;gap:12px}
.summary{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.summary>div{background:#fff;border:1px solid var(--line);border-radius:12px;padding:13px 16px;box-shadow:0 2px 10px rgba(17,24,39,.03)}
.summary span{display:block;color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.06em}.summary strong{display:block;font-size:20px;margin-top:3px}
.workspace-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;background:#fff;border:1px solid var(--line);border-radius:12px;padding:10px}
.tabs{display:flex;gap:7px;overflow:auto}.tab{border:1px solid var(--line);background:#f5f6f8;border-radius:8px;padding:8px 11px;font-weight:700;white-space:nowrap}.tab.active{background:var(--dark);color:#fff;border-color:var(--dark)}
.canvas-wrap{position:relative;min-height:560px;flex:1;background:#cfd5dc;border:1px solid #bac2cd;border-radius:14px;overflow:hidden;display:grid;place-items:center}
#cutCanvas{display:block;max-width:100%;max-height:100%}
.empty-state{position:absolute;text-align:center;color:#535e6e;padding:30px}.empty-icon{font-size:48px}.empty-state h2{margin:8px 0}.empty-state p{max-width:440px;margin:0}
.legend{display:flex;gap:20px;font-size:12px;color:var(--muted);justify-content:center}.legend i{display:inline-block;width:13px;height:13px;border-radius:3px;vertical-align:-2px;margin-right:6px;border:1px solid rgba(0,0,0,.12)}
.required-color{background:var(--required)}.filler-color{background:var(--green)}.sheet-color{background:#fff}
@media(max-width:1050px){.app-shell{grid-template-columns:360px 1fr}.part-row{grid-template-columns:minmax(75px,1fr) 55px 10px 55px 44px 28px 28px}.summary{grid-template-columns:1fr 1fr}}
@media(max-width:780px){.topbar{height:auto;padding:12px;gap:10px;align-items:flex-start}.app-shell{display:block}.sidebar{border-right:0}.workspace{min-height:700px}.summary{grid-template-columns:1fr 1fr}.workspace-toolbar{align-items:flex-start;flex-direction:column}.canvas-wrap{min-height:420px}.header-actions{justify-content:flex-end}.brand span{display:none}}

.filler-list .part-row{grid-template-columns:minmax(110px,1.5fr) 70px 12px 70px 30px 30px}
.filler-list .part-qty{display:none}
.filler-list .part-row::after{content:"onbeperkt";grid-column:1/-1;font-size:10px;color:#4f9468;margin-top:-3px}
@media(max-width:1050px){
  .filler-list .part-row{grid-template-columns:minmax(90px,1fr) 58px 10px 58px 28px 28px}
}

/* Luxigo / nesting-achtige opbouw */
.topbar{
  height:64px;
  background:linear-gradient(180deg,var(--dark),var(--dark-2));
  border-bottom:3px solid var(--accent);
  padding:0 18px;
  box-shadow:0 4px 16px rgba(0,0,0,.18);
}
.brand{gap:14px}
.logo-shell{
  width:132px;
  height:42px;
  display:flex;
  align-items:center;
  position:relative;
}
.logo-shell img{
  display:block;
  max-width:132px;
  max-height:38px;
  object-fit:contain;
  object-position:left center;
}
.brand-fallback{
  display:none;
  font-size:20px;
  font-weight:900;
  letter-spacing:1px;
  color:#fff;
}
.logo-shell.logo-error img{display:none}
.logo-shell.logo-error .brand-fallback{display:block}
.brand-copy{
  border-left:1px solid rgba(255,255,255,.22);
  padding-left:14px;
}
.brand-copy strong{
  font-size:15px;
  letter-spacing:.02em;
}
.brand-copy span{
  color:#b5bdc9;
  font-size:10px;
}
.topbar .btn.secondary{
  background:#2b3340;
  border-color:#414c5c;
}
.topbar .btn.secondary:hover{
  border-color:var(--accent);
  background:#343d4c;
}
.sidebar{
  background:#f3f5f8;
  border-right:1px solid #cbd3de;
  padding:14px;
}
.sidebar-heading{
  background:var(--dark);
  color:#fff;
  border-radius:10px;
  padding:12px 14px;
  margin-bottom:12px;
  border-left:4px solid var(--accent);
}
.sidebar-heading span{
  display:block;
  font-size:12px;
  font-weight:900;
  letter-spacing:.08em;
}
.sidebar-heading small{
  display:block;
  color:#aeb7c4;
  margin-top:4px;
  line-height:1.4;
}
.panel{
  border-radius:10px;
  box-shadow:none;
  border-color:#d9dfe7;
}
.step{
  background:var(--accent);
  border-radius:6px;
}
.add-row{
  border-color:#c8d0da;
  background:#f7f8fa;
}
.add-row:hover{
  border-color:var(--accent);
  color:var(--accent);
  background:var(--accent-soft);
}
.optional-panel{
  border-left:4px solid var(--green);
}
.workspace{
  padding:14px;
  gap:10px;
  background:#dfe4ea;
}
.workspace-ribbon{
  min-height:52px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  background:var(--dark);
  color:#fff;
  border-radius:10px;
  padding:9px 12px;
  box-shadow:0 3px 12px rgba(20,26,35,.15);
}
.ribbon-title strong{
  display:block;
  font-size:13px;
}
.ribbon-title span{
  display:block;
  color:#aeb7c4;
  font-size:11px;
  margin-top:2px;
}
.ribbon-actions{
  display:flex;
  gap:7px;
}
.ribbon-button{
  border:1px solid #465163;
  background:#2b3442;
  color:#fff;
  border-radius:7px;
  padding:8px 10px;
  font-size:11px;
  font-weight:700;
}
.ribbon-button:hover{
  background:var(--accent);
  border-color:var(--accent);
}
.summary>div{
  border-radius:9px;
  border-top:3px solid var(--accent);
}
.workspace-toolbar{
  border-radius:9px;
}
.tab.active{
  background:var(--accent);
  border-color:var(--accent);
}
.canvas-wrap{
  background:#9da7b3;
  border-color:#8994a1;
  border-radius:10px;
  box-shadow:inset 0 1px 4px rgba(0,0,0,.12);
}
.btn.primary{
  background:var(--accent);
}
input:focus,select:focus{
  border-color:var(--accent);
  box-shadow:0 0 0 3px rgba(245,67,37,.12);
}
@media(max-width:780px){
  .topbar{height:auto}
  .logo-shell{width:100px}
  .logo-shell img{max-width:100px}
  .workspace-ribbon{align-items:flex-start;flex-direction:column}
}

/* V1.0.3: lichte Luxigo-header */
.topbar{background:#fff;border-bottom:3px solid #F54325;box-shadow:0 3px 14px rgba(17,24,39,.08)}
.logo-shell img{filter:none}
.brand-fallback{color:#202631}
.brand-copy{border-left:1px solid #d8dee7}
.brand-copy strong{color:#202631}
.brand-copy span{color:#7a8492}
.topbar .btn.secondary{background:#fff;color:#202631;border-color:#d8dee7}
.topbar .btn.secondary:hover{background:#fff4f1;color:#F54325;border-color:#F54325}
.topbar .btn.primary{background:#F54325;color:#fff;border-color:#F54325}
.topbar .btn.primary:hover{background:#D93B1F;border-color:#D93B1F}


/* V1.1.0: optimalisatiedoelen en oplossingen vergelijken */
.mode-help{margin-top:9px;padding:11px 12px;border:1px solid #d8dee7;border-left:4px solid #F54325;border-radius:8px;background:#fff7f4;line-height:1.4}
.mode-help strong,.mode-help span{display:block}.mode-help strong{font-size:12px;color:#202631}.mode-help span{margin-top:3px;font-size:11px;color:#687385}
.solution-section{background:#fff;border:1px solid #d4dae3;border-radius:10px;padding:12px;box-shadow:0 3px 12px rgba(20,26,35,.06)}
.solution-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:9px}.solution-heading strong,.solution-heading span{display:block}.solution-heading strong{font-size:13px}.solution-heading span{font-size:11px;color:#748091;margin-top:2px}
.solution-cards{display:grid;grid-template-columns:repeat(4,minmax(150px,1fr));gap:8px}
.solution-card{text-align:left;position:relative;border:1px solid #d8dee7;background:#f8f9fb;border-radius:9px;padding:11px;min-height:108px;color:#202631;transition:.15s ease}
.solution-card:hover{border-color:#F54325;transform:translateY(-1px)}.solution-card.active{border:2px solid #F54325;background:#fff5f2;padding:10px}
.solution-card strong,.solution-card small,.solution-metrics{display:block}.solution-card strong{font-size:13px;margin-top:20px}.solution-metrics{font-size:11px;margin-top:7px;color:#4c5665}.solution-card small{font-size:10px;color:#748091;margin-top:5px}
.solution-badge{position:absolute;top:9px;right:9px;border-radius:99px;background:#e9edf2;padding:3px 6px;font-size:9px;font-weight:800;text-transform:uppercase;letter-spacing:.04em}.solution-card.active .solution-badge{background:#F54325;color:#fff}
@media(max-width:1100px){.solution-cards{grid-template-columns:repeat(2,minmax(140px,1fr))}}
@media(max-width:620px){.solution-cards{grid-template-columns:1fr 1fr}.solution-card{min-height:112px}.solution-section{padding:10px}}


/* V1.1.1 — volledige mobiele optimalisatie */
.mobile-nav{display:none}

@media(max-width:780px){
  html{scroll-behavior:smooth}
  body{
    padding-bottom:env(safe-area-inset-bottom);
    overflow-x:hidden;
  }

  .topbar{
    position:sticky;
    top:0;
    z-index:30;
    display:grid;
    grid-template-columns:1fr;
    height:auto;
    padding:10px 12px 9px;
    padding-top:max(10px,env(safe-area-inset-top));
    gap:9px;
    align-items:center;
  }
  .brand{
    width:100%;
    min-width:0;
    justify-content:flex-start;
    gap:10px;
  }
  .logo-shell{
    width:92px;
    height:30px;
    flex:0 0 92px;
  }
  .logo-shell img{
    max-width:92px;
    max-height:28px;
  }
  .brand-copy{
    min-width:0;
    padding-left:10px;
  }
  .brand-copy strong{
    font-size:16px;
    white-space:nowrap;
  }
  .brand-copy span{display:block;font-size:9px}

  .header-actions{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    width:100%;
    gap:7px;
  }
  .header-actions .btn{
    min-width:0;
    min-height:42px;
    padding:8px 6px;
    border-radius:9px;
    font-size:12px;
    line-height:1.15;
    text-align:center;
    display:flex;
    align-items:center;
    justify-content:center;
  }

  .mobile-nav{
    position:sticky;
    top:103px;
    z-index:25;
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:6px;
    padding:7px 12px;
    background:rgba(255,255,255,.96);
    border-bottom:1px solid #d8dee7;
    backdrop-filter:blur(10px);
  }
  .mobile-nav a{
    display:flex;
    min-height:38px;
    align-items:center;
    justify-content:center;
    border:1px solid #d8dee7;
    border-radius:8px;
    color:#202631;
    background:#fff;
    font-size:12px;
    font-weight:800;
    text-decoration:none;
  }
  .mobile-nav a:last-child{
    color:#fff;
    background:#F54325;
    border-color:#F54325;
  }

  .app-shell{display:block;min-height:auto}
  .sidebar{
    width:100%;
    padding:10px;
    border-right:0;
    overflow:visible;
  }
  .sidebar-heading{
    padding:11px 12px;
    margin-bottom:10px;
  }
  .panel{
    padding:13px;
    margin-bottom:10px;
    border-radius:10px;
  }
  .panel-title{margin-bottom:12px}
  .panel-title h2{font-size:15px}
  .form-grid{
    grid-template-columns:1fr 1fr;
    gap:10px 8px;
  }
  label{font-size:11px}
  input,select{
    min-height:44px;
    padding:10px;
    font-size:16px; /* voorkomt automatisch inzoomen op iPhone */
  }
  .toggle{
    min-height:42px;
    padding:4px 0;
    font-size:13px;
    line-height:1.35;
  }
  .toggle input{
    flex:0 0 20px;
    width:20px;
    height:20px;
  }

  .part-list{gap:10px}
  .part-row{
    position:relative;
    display:grid;
    grid-template-columns:1fr 18px 1fr 48px 42px;
    grid-template-areas:
      "name name name name remove"
      "width times height qty rotate";
    gap:7px;
    padding:9px;
    border:1px solid #d8dee7;
    border-radius:9px;
    background:#f8f9fb;
  }
  .part-name{grid-area:name}
  .part-width{grid-area:width}
  .part-row>span{grid-area:times}
  .part-height{grid-area:height}
  .part-qty{grid-area:qty}
  .remove-row{grid-area:remove}
  .mini-toggle{grid-area:rotate}
  .part-row input{
    min-width:0;
    min-height:42px;
    padding:8px;
    font-size:16px;
  }
  .icon-btn,.mini-toggle span{
    width:100%;
    height:42px;
  }

  .filler-list .part-row{
    grid-template-columns:1fr 18px 1fr 42px;
    grid-template-areas:
      "name name name remove"
      "width times height rotate";
  }
  .filler-list .part-row::after{
    content:"Onbeperkt beschikbaar";
    grid-column:1/-1;
    margin:0;
    padding-top:2px;
    font-size:10px;
  }

  .add-row,.calculate-btn{
    min-height:48px;
    font-size:14px;
  }
  .mode-help{padding:10px}
  .status{font-size:11px}

  .workspace{
    min-height:0;
    padding:10px;
    gap:10px;
  }
  .workspace-ribbon{
    min-height:auto;
    flex-direction:column;
    align-items:stretch;
    padding:10px;
  }
  .ribbon-title span{font-size:10px}
  .ribbon-actions{
    display:grid;
    grid-template-columns:1fr 1fr;
    width:100%;
  }
  .ribbon-button{
    min-height:42px;
    font-size:12px;
  }

  .solution-section{
    padding:10px;
    overflow:hidden;
  }
  .solution-heading{margin-bottom:8px}
  .solution-cards{
    display:flex;
    gap:8px;
    overflow-x:auto;
    scroll-snap-type:x mandatory;
    overscroll-behavior-x:contain;
    padding-bottom:5px;
    scrollbar-width:thin;
  }
  .solution-card{
    flex:0 0:min(78vw,270px);
    min-height:110px;
    scroll-snap-align:start;
  }

  .summary{
    grid-template-columns:1fr 1fr;
    gap:8px;
  }
  .summary>div{
    min-width:0;
    padding:11px 12px;
  }
  .summary strong{font-size:21px}

  .workspace-toolbar{
    display:block;
    padding:9px;
    overflow:hidden;
  }
  .tabs{
    width:100%;
    overflow-x:auto;
    overscroll-behavior-x:contain;
    scroll-snap-type:x proximity;
    padding-bottom:8px;
  }
  .tab{
    flex:0 0 auto;
    min-height:42px;
    scroll-snap-align:start;
    font-size:13px;
  }
  .export-actions{
    display:grid;
    grid-template-columns:1fr 1fr;
    width:100%;
    gap:8px;
  }
  .export-actions .btn{
    min-width:0;
    min-height:46px;
    padding:9px 7px;
    font-size:12px;
    line-height:1.2;
  }

  .canvas-wrap{
    width:100%;
    min-height:0;
    height:auto;
    aspect-ratio:1 / 1;
    padding:10px;
    border-radius:10px;
    touch-action:pan-y;
  }
  #cutCanvas{
    width:auto;
    height:auto;
    max-width:100%;
    max-height:100%;
  }
  .empty-state{
    padding:20px;
  }
  .empty-icon{font-size:38px}
  .empty-state h2{font-size:18px}
  .empty-state p{font-size:13px}

  .legend{
    justify-content:flex-start;
    flex-wrap:wrap;
    gap:10px 15px;
    padding:2px 4px 8px;
    font-size:11px;
  }
}

@media(max-width:420px){
  .mobile-nav{top:103px}
  .form-grid{grid-template-columns:1fr}
  .form-grid .full{grid-column:auto}
  .summary strong{font-size:19px}
  .export-actions{grid-template-columns:1fr 1fr}
  .solution-card{flex-basis:84vw}
}

@media(max-width:350px){
  .header-actions{grid-template-columns:1fr}
  .mobile-nav{top:203px}
  .part-row{
    grid-template-columns:1fr 16px 1fr 42px;
    grid-template-areas:
      "name name name remove"
      "width times height rotate"
      "qty qty qty qty";
  }
  .export-actions{grid-template-columns:1fr}
}

.filler-strategy{margin:0 0 10px;padding:10px;border:1px solid #d8dee7;border-radius:9px;background:#f8f9fb}
.filler-strategy label{display:block;margin-bottom:6px;font-weight:800}
.filler-strategy select{width:100%}
.filler-strategy .hint{margin:6px 0 0}
@media(max-width:780px){.filler-strategy select{min-height:44px;font-size:16px}}

/* V1.3.0 - taalkeuze */
.language-picker{
  display:flex;
  align-items:center;
  gap:7px;
  min-height:38px;
  padding:0 8px;
  border:1px solid #d8dee7;
  border-radius:8px;
  background:#fff;
}
.language-label{
  font-size:11px;
  font-weight:800;
  color:#6d7785;
}
.language-picker select{
  min-height:30px;
  border:0;
  background:transparent;
  box-shadow:none;
  padding:2px 22px 2px 4px;
  font-size:12px;
  font-weight:900;
  color:#202631;
}
.language-picker select:focus{
  box-shadow:none;
}
@media(max-width:780px){
  .header-actions{
    grid-template-columns:minmax(74px,.75fr) repeat(3,minmax(0,1fr));
  }
  .language-picker{
    min-width:0;
    padding:0 5px;
    justify-content:center;
  }
  .language-label{display:none}
  .language-picker select{
    min-height:40px;
    width:100%;
    text-align:center;
    font-size:13px;
  }
}
@media(max-width:470px){
  .header-actions{
    grid-template-columns:72px 1fr 1fr;
  }
  .header-actions .file-btn{
    grid-column:2 / 4;
  }
}


/* V1.3.1 — compacte desktop header */
@media(min-width:781px){
  .topbar{
    min-height:64px;
    height:64px;
    padding:0 18px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:18px;
  }

  .brand{
    min-width:0;
    flex:1 1 auto;
  }

  .header-actions{
    flex:0 0 auto;
    display:flex;
    align-items:center;
    justify-content:flex-end;
    gap:8px;
    width:auto;
  }

  .header-actions .btn,
  .header-actions .file-btn{
    min-height:40px;
    height:40px;
    width:auto;
    min-width:0;
    padding:0 14px;
    border-radius:8px;
    font-size:12px;
    line-height:1;
    white-space:nowrap;
  }

  .header-actions .file-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
  }

  .language-picker{
    min-height:40px;
    height:40px;
    padding:0 7px;
    gap:0;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border-radius:8px;
  }

  .language-picker .language-label{
    position:absolute;
    width:1px;
    height:1px;
    padding:0;
    margin:-1px;
    overflow:hidden;
    clip:rect(0,0,0,0);
    white-space:nowrap;
    border:0;
  }

  .language-picker select{
    width:58px;
    min-width:58px;
    height:38px;
    min-height:38px;
    padding:0 22px 0 8px;
    border:0;
    font-size:12px;
    font-weight:900;
    text-align:center;
    background-color:transparent;
  }
}

/* Houd de mobiele header bewust ruimer en touchvriendelijk */
@media(max-width:780px){
  .language-picker .language-label{display:none}
}

/* V1.3.2 — definitieve header-uitlijning desktop
   Overschrijft de oorspronkelijke .topbar grid-regels expliciet. */
@media (min-width:781px){
  header.topbar{
    display:flex !important;
    flex-direction:row !important;
    align-items:center !important;
    justify-content:space-between !important;
    min-height:64px !important;
    height:64px !important;
    padding:0 20px !important;
    gap:20px !important;
  }

  header.topbar > .brand{
    display:flex !important;
    align-items:center !important;
    align-self:center !important;
    flex:1 1 auto !important;
    min-width:0 !important;
    height:44px !important;
    margin:0 !important;
  }

  header.topbar > .header-actions{
    display:flex !important;
    flex-direction:row !important;
    flex-wrap:nowrap !important;
    align-items:center !important;
    align-self:center !important;
    justify-content:flex-end !important;
    width:auto !important;
    height:40px !important;
    margin:0 !important;
    padding:0 !important;
    gap:8px !important;
  }

  header.topbar > .header-actions > *{
    box-sizing:border-box !important;
    margin:0 !important;
    align-self:center !important;
  }

  header.topbar .header-actions .btn,
  header.topbar .header-actions .file-btn,
  header.topbar .language-picker{
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    min-height:40px !important;
    height:40px !important;
    max-height:40px !important;
    padding-top:0 !important;
    padding-bottom:0 !important;
    line-height:1 !important;
  }

  header.topbar .language-picker{
    width:64px !important;
    min-width:64px !important;
    padding:0 5px !important;
  }

  header.topbar .language-picker select{
    display:block !important;
    box-sizing:border-box !important;
    width:54px !important;
    min-width:54px !important;
    height:38px !important;
    min-height:38px !important;
    margin:0 !important;
    padding-top:0 !important;
    padding-bottom:0 !important;
    line-height:38px !important;
  }

  header.topbar .header-actions .file-btn input{
    position:absolute !important;
    width:1px !important;
    height:1px !important;
    opacity:0 !important;
    pointer-events:none !important;
  }
}

/* V2.0 — Dual Optimizer */
.production-method{margin-bottom:14px}
.field-title{display:block;margin-bottom:7px;font-size:11px;font-weight:900;color:#4d5968;text-transform:uppercase;letter-spacing:.05em}
.production-options{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.production-option{position:relative;display:flex;align-items:center;gap:10px;padding:11px;border:1px solid #d8dee7;border-radius:10px;background:#fff;cursor:pointer}
.production-option input{position:absolute;opacity:0;pointer-events:none}
.production-option:has(input:checked){border-color:#F54325;box-shadow:0 0 0 3px rgba(245,67,37,.1);background:#fff7f4}
.production-option.saw-option:has(input:checked){border-color:#1677c8;box-shadow:0 0 0 3px rgba(22,119,200,.1);background:#f3f9ff}
.production-icon{display:grid;place-items:center;width:34px;height:34px;flex:0 0 34px;border-radius:8px;background:#f0f2f5;font-size:18px}
.production-option strong{display:block;font-size:13px}
.production-option small{display:block;margin-top:3px;color:#758091;font-size:10px;line-height:1.35}
.wallsaw-settings{margin-bottom:11px;padding:11px;border:1px solid #b9d7ee;border-left:4px solid #1677c8;border-radius:9px;background:#f4f9fd}
.wallsaw-settings label+label{margin-top:8px}
.cutline-color{background:#1677c8}
.summary:has(.wallsaw-summary:not([hidden])){grid-template-columns:repeat(3,minmax(0,1fr))}
@media(max-width:780px){
  .production-options{grid-template-columns:1fr}
  .production-option{min-height:62px}
  .summary:has(.wallsaw-summary:not([hidden])){grid-template-columns:1fr 1fr}
}


/* V2.0.1 — productiemethode layout en cache-fix */
.production-method{
  display:block;
  width:100%;
  margin:0 0 14px;
}
.production-method .field-title{
  display:block;
  margin:0 0 8px;
}
.production-options{
  display:grid;
  grid-template-columns:1fr;
  gap:8px;
}
label.production-option{
  display:flex;
  flex-direction:row;
  align-items:center;
  width:100%;
  min-height:64px;
  gap:10px;
  padding:10px 11px;
  box-sizing:border-box;
}
.production-option .production-icon{
  flex:0 0 34px;
}
.production-option .production-copy{
  display:block;
  flex:1 1 auto;
  min-width:0;
}
.production-option .production-copy strong,
.production-option .production-copy small{
  display:block;
}
.production-option .production-copy strong{
  margin:0;
  line-height:1.2;
}
.production-option .production-copy small{
  margin-top:4px;
  font-weight:500;
  line-height:1.35;
}
.production-option input[type="radio"]{
  position:absolute;
  opacity:0;
  width:1px;
  height:1px;
  pointer-events:none;
}
.production-option::after{
  content:"";
  flex:0 0 16px;
  width:16px;
  height:16px;
  border:2px solid #b7c0cc;
  border-radius:50%;
  box-sizing:border-box;
}
.production-option:has(input:checked)::after{
  border:5px solid #F54325;
}
.production-option.saw-option:has(input:checked)::after{
  border-color:#1677c8;
}
@media(min-width:1180px){
  .production-options{grid-template-columns:1fr 1fr}
  label.production-option{min-height:72px}
}
@media(max-width:780px){
  .production-options{grid-template-columns:1fr}
}

/* V2.1.0 — polished production portal */
.workspace-title-row{display:flex;align-items:center;gap:9px}
.production-badge{
  display:inline-flex;align-items:center;justify-content:center;
  min-height:22px;padding:3px 8px;border-radius:999px;
  font-size:9px;font-weight:900;letter-spacing:.07em
}
.production-badge.laser{background:#fff0ec;color:#d93419;border:1px solid #ffc5b8}
.production-badge.wallsaw{background:#e9f8f4;color:#14775f;border:1px solid #a8dfd2}
.production-method{padding:11px;border:1px solid #d8dee7;border-radius:10px;background:#f8fafc}
.production-options{margin-top:7px}
.production-option{transition:border-color .15s ease,box-shadow .15s ease,background .15s ease}
.production-option:hover{border-color:#aeb8c5}
.production-option.saw-option:has(input:checked) .production-icon{background:#dff4ef;color:#14775f}
.wallsaw-settings{background:#f4fbf9;border-color:#a8dfd2;border-left-color:#49BEA4}
.summary>div{min-height:76px}
.canvas-wrap{background:#aab4c0}
@media(max-width:780px){
  .production-method{padding:9px}
  .workspace-title-row{flex-wrap:wrap}
}


/* V2.3.1 - wandzaag opvulling */
.wallsaw-filler-controls{margin:0 0 10px;padding:10px;border:1px solid #a8dfd2;border-left:4px solid #49bea4;border-radius:9px;background:#f4fbf9}
.wallsaw-filler-controls label{display:block;margin-bottom:6px;font-weight:800}
.wallsaw-filler-controls select{width:100%}

/* V2.4.0: consistente kleursemantiek */
.required-color{background:#F54325!important}.filler-color{background:#49BEA4!important}