/* FrameIt-inspired owner workspace. Customer pages and print keep their own presentation. */
@media screen {
body:has(.shell){--bg:#0d0e10;--side:#111214;--paper:#16181b;--surface:#1c1f23;--hover:#22262b;--line:#30343a;--ink:#ecedee;--muted:#a0a5ac;--accent:#ff6a3d;background:var(--bg);color:var(--ink);color-scheme:dark;font-family:'Segoe UI',system-ui,sans-serif}
body[data-workspace-theme=relief]:has(.shell){--bg:#2c2d31;--side:#34363b;--paper:#222326;--surface:#3b3d43;--hover:#42454c;--line:#565961;--ink:#f2f2f4;--muted:#bcbfc6;--accent:#ff946f}
body[data-workspace-theme=stille]:has(.shell){--bg:#f6f6f4;--side:#eeeeeb;--paper:#fff;--surface:#f0f0ed;--hover:#e5e5e0;--line:#c9cbc5;--ink:#252824;--muted:#60665e;--accent:#a64121;color-scheme:light}
.shell{grid-template-columns:236px minmax(0,1fr)}.shell .sidebar{background:var(--side);border-right:1px solid var(--line);padding:24px 14px;color:var(--muted)}.shell .brand{color:var(--ink);font-size:18px;letter-spacing:-.4px}.shell .brand-mark{border-color:var(--accent);color:var(--accent)}.shell .brand-sub{margin:12px 8px 32px;color:var(--muted);font:11px Consolas,monospace}.shell .sidebar nav{gap:4px}.shell .sidebar nav button{color:var(--muted);border-radius:9px;padding:11px 12px}.shell .sidebar nav button.active{color:var(--ink);background:var(--surface);border:1px solid var(--line);box-shadow:inset 3px 0 var(--accent);padding-left:12px}.shell .sidebar footer{color:var(--muted)}.shell .sidebar footer button{color:var(--muted)}
.shell .main{max-width:1600px;min-width:0;padding:0 clamp(16px,3vw,44px) 60px}.shell .topline{height:64px;margin-bottom:28px;padding:0;font:12px Consolas,monospace}.shell .heading{flex-wrap:wrap}.shell h1{font-size:30px;letter-spacing:-.03em}.shell h2{font-size:17px}.shell .eyebrow,.shell .nav-label{color:var(--muted);font:11px Consolas,monospace}.shell .test-label{background:var(--surface);color:var(--muted);border:1px solid var(--line)}
.shell .panel,.shell .stat{background:var(--paper);border:1px solid var(--line);border-radius:14px;box-shadow:none}.shell .panel-pad{padding:22px}.shell .stat{border-top:2px solid var(--accent)}.shell .stat:nth-child(2){border-top-color:#8b7cf6}.shell .stat:nth-child(3){border-top-color:#3ecf8e}.shell .stat span,.shell label,.shell .subtle,.shell .small.subtle,.shell .line-title small,.shell .rowlink span{color:var(--muted)}
.shell button,.shell input,.shell select,.shell textarea{background:var(--surface);color:var(--ink);border-color:var(--line);border-radius:8px}.shell button:hover{background:var(--hover)}.shell .primary{background:var(--accent);color:#101112;border-color:var(--accent)}body[data-workspace-theme=stille] .shell .primary{color:white}.shell .quiet,.shell .rowlink{background:transparent}.shell input[readonly],.shell input:disabled,.shell select:disabled{background:var(--paper);color:var(--muted)}.shell button:focus-visible,.shell a:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.shell th{background:var(--surface);color:var(--muted);font:11px Consolas,monospace}.shell td{border-bottom-color:var(--line)}.shell tbody tr:hover{background:var(--surface)}.shell .badge{background:var(--surface);color:var(--ink);border:1px solid var(--line)}.shell .badge.good{color:#74dba8}.shell .badge.warn{color:#efbb67}body[data-workspace-theme=stille] .shell .badge.good{color:#28603d}body[data-workspace-theme=stille] .shell .badge.warn{color:#82520b}.shell .progress{background:var(--surface)}.shell .progress i{background:#3ecf8e}.shell .callout{background:var(--surface);border-color:var(--accent);color:var(--ink)}.shell .line-body{background:var(--paper)}
.shell .product-builder>h2,.shell .draft-area{border-color:var(--line)}.shell .catalog-source,.shell .catalog-location,.shell .new-line header{background:var(--surface);border-color:var(--line)}.shell #catalog-browser{border-color:var(--line)}.shell .catalog-choice,.shell .catalog-product,.shell .new-line{background:var(--paper);border-color:var(--line);color:var(--ink)}.shell .catalog-product{box-shadow:none;border-width:1px}.shell .catalog-product:hover{background:var(--hover);border-color:var(--accent)}.shell .custom-line-area{background:var(--surface);border-color:var(--muted)}.shell .draft-empty{color:var(--muted);border-color:var(--line)}
.workspace-theme{margin:20px 8px 0}.workspace-theme select{margin-top:5px;width:100%}.offer-sections{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 22px}.offer-sections a{border:1px solid var(--line);border-radius:8px;padding:9px 14px;color:var(--muted);text-decoration:none;font-size:12px}.offer-sections a:hover{color:var(--ink);background:var(--surface)}.new-form{max-width:1200px}.shell .new-form>section{scroll-margin-top:20px}
body[data-workspace-theme=relief] .shell .panel{box-shadow:inset 0 2px 6px #0006,0 1px #ffffff15}body[data-workspace-theme=relief] .shell button{box-shadow:inset 0 1px #ffffff22,0 2px 3px #0005}body[data-workspace-theme=stille] .shell .panel{border-radius:7px}
.shell .stat-filter{background:var(--paper);border-radius:14px;text-align:left;font-weight:400;gap:16px;min-width:0}
.shell .stat-filter:hover{background:var(--hover)}
.shell .stat-filter[aria-pressed=true]{background:var(--surface);box-shadow:inset 0 0 0 2px var(--accent)}
.shell .stat-filter[aria-pressed=true] span{color:var(--ink);font-weight:650}
.shell .stat-filter[aria-pressed=true] .dot{background:var(--accent)}
.overview-filter-summary{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;padding:12px 23px;border-top:1px solid var(--line)}
.overview-filter-summary p{margin:0;color:var(--muted);font-size:12px}
.overview-filter-summary [hidden]{display:none}
@media(min-width:1200px){.shell .detail-grid{grid-template-columns:minmax(0,1fr) 320px}.shell .detail-grid>aside{position:sticky;top:20px}}
@media(max-width:700px){.shell{display:block}.shell .sidebar{position:static;height:auto;padding:16px}.shell .sidebar nav{display:flex}.shell .sidebar footer{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:12px}.workspace-theme{margin:12px 0 0;max-width:200px}.shell .main{padding:0 16px 40px}.shell .topline{height:50px;margin-bottom:20px}.shell h1{font-size:26px}.shell .panel-pad{padding:16px}.shell .stats{grid-template-columns:1fr}.shell .stat{display:flex}.shell .stat strong{margin:0}.shell .stat span{font-size:12px}.shell .heading>.primary{white-space:normal}}
}

/* Own-product attributes use the same panels and controls as the quote editor. */
.attribute-editor{margin:24px 0;padding:20px 0;border-top:1px solid var(--border,#34393d);border-bottom:1px solid var(--border,#34393d)}
.attribute-editor fieldset{min-width:0;margin:16px 0;padding:18px;border:1px solid var(--border,#34393d);border-radius:12px}
.attribute-editor legend{padding:0 8px}.attribute-editor button{margin:8px 8px 0 0}
.attribute-options [data-attribute-option]{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;gap:12px;align-items:end;margin:12px 0}
.attribute-options [data-attribute-option] button{margin:0}
@media(max-width:650px){.attribute-options [data-attribute-option]{grid-template-columns:minmax(0,1fr)}.attribute-editor fieldset{padding:12px}}

#shop-reuse-panel{margin:20px 0;padding:20px;border:1px solid var(--border,#34393d);border-radius:12px}#shop-reuse-panel[hidden]{display:none}#shop-reuse-panel .catalog-products{margin:16px 0}#shop-reuse-preview details{padding:10px;border-bottom:1px solid var(--border,#34393d)}#shop-reuse-preview ul{max-height:240px;overflow:auto}#shop-reuse-preview input[type=checkbox]{width:auto}.attribute-options>summary{cursor:pointer;padding:12px 0}

@media screen{
 .shell .sync-alert{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;margin-bottom:24px;padding:20px;border:2px solid var(--accent);border-radius:12px;background:var(--paper);color:var(--ink)}
 .shell .sync-alert[hidden]{display:none}.shell .sync-alert h2{margin:0 0 8px}.shell .sync-alert p{margin:6px 0}.shell .sync-alert button{flex-shrink:0}
 @media(max-width:700px){.shell .sync-alert{flex-direction:column;padding:16px}}
}
@media print{.sync-alert{display:none!important}}

/* Product-to-production preparation */
.production-product{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px 0;border-bottom:1px solid var(--border,#7775)}
.production-product>div{min-width:0}.production-product button{flex-shrink:0}.production-product p{margin:6px 0}
.production-issues{padding-left:22px;line-height:1.6}.production-line{padding:20px 0;border-top:1px solid var(--border,#7775);margin-top:20px}
.production-mapping{display:grid;grid-template-columns:minmax(100px,160px) 1fr;gap:14px}.production-mapping dt{font-weight:650}.production-mapping dd{margin:0}
.production-line code{overflow-wrap:anywhere}.production-line button{margin-top:12px}
@media(max-width:640px){.production-product{align-items:stretch;flex-direction:column}.production-mapping{grid-template-columns:1fr;gap:8px}.production-mapping dd{margin-bottom:12px}}

@media screen{.shell [data-production-form] .primary:hover{background:var(--accent);filter:brightness(1.08)}}

/* Afkort queue status stays separate from editable production fields. */
#afkort-automation{margin-top:18px;padding:18px;border:1px solid var(--line,#7775);border-radius:10px;background:var(--surface,transparent)}
.afkort-status{display:flex;justify-content:space-between;align-items:flex-start;gap:16px}.afkort-status h3{margin:0 0 10px}.afkort-status button{flex-shrink:0}
[data-production-receipt] a,#afkort-automation a{overflow-wrap:anywhere}.shell .sidebar nav{flex-wrap:wrap}
@media(max-width:640px){.afkort-status{flex-direction:column}.afkort-status button{width:100%}#afkort-automation{padding:14px}}

#afkort-printing{margin-top:18px;padding:18px;border:1px solid var(--line,#7775);border-radius:10px}#afkort-printing[hidden]{display:none}.afkort-print-confirm{padding:16px;margin-top:18px;border:1px solid var(--accent,#7775);border-radius:8px}.afkort-print-confirm h4{margin:0 0 10px}.afkort-print-history{margin-top:18px}.afkort-print-history summary{cursor:pointer}.afkort-print-history p{display:flex;gap:12px;align-items:center;flex-wrap:wrap}#afkort-printing .actions{flex-wrap:wrap}
@media(max-width:640px){#afkort-printing,.afkort-print-confirm{padding:14px}#afkort-printing .actions>button{white-space:normal;max-width:100%}}

#afkort-selection{padding:18px;margin-bottom:18px;border:1px solid var(--border,#46505a);border-radius:10px}.afkort-line-choice{display:flex;align-items:center;gap:10px;margin-bottom:12px;font-weight:600}.afkort-line-choice input{width:18px;height:18px;flex:none;accent-color:var(--accent,#ce744d)}
