/* ============================================================================
   WORKSHOP DASHBOARD — PRO user home screen
   Dark theme, DM Sans + DM Mono, matches CNC page aesthetic
   ============================================================================ */

.wd-overlay { position:fixed; inset:0; z-index:1700; background:#18181b; display:none; overflow:hidden }
.wd-overlay.open { display:flex; flex-direction:column }

/* ── Nav ── */
.wd-nav { display:flex; justify-content:space-between; align-items:center; padding:0 32px; height:52px; border-bottom:1px solid rgba(255,255,255,.06); flex-shrink:0; background:#18181b }
.wd-nav-left { display:flex; align-items:center; gap:14px }
.wd-brand { display:flex; align-items:center; gap:8px; font-family:'DM Sans',system-ui,sans-serif; font-size:18px; font-weight:500; color:#e4e4e7; cursor:pointer }
.wd-brand:hover { opacity:.8 }
.wd-nav-right { display:flex; align-items:center; gap:10px }
.wd-search { font-family:'DM Mono',monospace; font-size:12px; color:#666; border:0.5px solid rgba(255,255,255,.08); border-radius:5px; padding:0 12px; display:flex; align-items:center; gap:8px; cursor:pointer; min-width:160px; transition:border-color .15s; height:30px }
.wd-search:focus-within { border-color:rgba(55,138,221,.4) }
.wd-search-input { font-family:'DM Mono',monospace; font-size:12px; color:#e4e4e7; background:none; border:none; outline:none; flex:1; min-width:0; padding:0 }
.wd-search-input::placeholder { color:#555 }
.wd-search:hover { border-color:rgba(255,255,255,.2) }
.wd-search kbd { font-family:'DM Sans',sans-serif; font-size:11px; color:#555; background:rgba(255,255,255,.06); padding:1px 4px; border-radius:2px; margin-left:auto }
.wd-pro-badge { font-family:'DM Mono',monospace; font-size:11px; font-weight:500; color:#AFA9EC; border:1px solid rgba(175,169,236,.25); border-radius:3px; padding:2px 8px; letter-spacing:.05em }
.wd-machine { font-family:'DM Mono',monospace; font-size:11px; color:#777; background:rgba(255,255,255,.04); border:0.5px solid rgba(255,255,255,.06); padding:6px 12px; border-radius:5px; display:flex; align-items:center; gap:5px; cursor:pointer; transition:border-color .15s }
.wd-machine:hover { border-color:rgba(255,255,255,.15); color:#e4e4e7 }
.wd-machine-dot { width:5px; height:5px; border-radius:50%; background:#1E9E5A }
.wd-machine-chev { font-size:9px; color:#555; margin-left:2px }
.wd-machine-wrap { position:relative }
.wd-machine-dd { display:none; position:absolute; top:calc(100% + 6px); right:0; width:320px; background:#222226; border:0.5px solid rgba(255,255,255,.12); border-radius:10px; z-index:20; overflow:hidden }
.wd-machine-dd.open { display:block }

/* Dropdown sections */
.wd-dd-section { padding:10px 14px; border-bottom:0.5px solid rgba(255,255,255,.06) }
.wd-dd-section:last-of-type { border-bottom:none }
.wd-dd-title { font-family:'DM Mono',monospace; font-size:10px; color:#666; letter-spacing:.06em; text-transform:uppercase; margin:0 0 8px }
.wd-dd-profiles { display:flex; flex-direction:column; gap:4px }
.wd-dd-prof { display:flex; align-items:center; gap:8px; padding:8px 10px; border:0.5px solid rgba(255,255,255,.06); border-radius:6px; cursor:pointer; transition:all .12s }
.wd-dd-prof:hover { border-color:rgba(255,255,255,.15); background:rgba(255,255,255,.02) }
.wd-dd-prof.active { border-color:rgba(55,138,221,.4); background:rgba(55,138,221,.04) }
.wd-dd-prof-dot { width:6px; height:6px; border-radius:50%; flex-shrink:0 }
.wd-dd-prof-dot.on { background:#1E9E5A }
.wd-dd-prof-dot.off { background:#555 }
.wd-dd-prof-info { flex:1; min-width:0 }
.wd-dd-prof-name { font-family:'DM Sans',sans-serif; font-size:11px; font-weight:500; color:#e4e4e7 }
.wd-dd-prof-meta { font-family:'DM Mono',monospace; font-size:11px; color:#666; margin-top:1px }
.wd-dd-check { font-size:11px; color:#378ADD; flex-shrink:0 }
.wd-dd-empty { font-family:'DM Mono',monospace; font-size:9px; color:#555; padding:4px 0 }

/* Machine edit fields */
.wd-dd-machine { display:flex; gap:8px }
.wd-dd-field { flex:1; display:flex; flex-direction:column; gap:3px }
.wd-dd-field-sm { flex:0 0 80px }
.wd-dd-label { font-family:'DM Mono',monospace; font-size:11px; color:#555; text-transform:uppercase; letter-spacing:.04em }
.wd-dd-input { font-family:'DM Mono',monospace; font-size:11px; color:#e4e4e7; background:rgba(255,255,255,.04); border:0.5px solid rgba(255,255,255,.08); border-radius:4px; padding:5px 8px; outline:none; transition:border-color .15s; width:100% }
.wd-dd-input:focus { border-color:rgba(55,138,221,.5) }
.wd-dd-input:hover { border-color:rgba(255,255,255,.15) }
.wd-dd-select { font-family:'DM Mono',monospace; font-size:11px; color:#e4e4e7; background:rgba(255,255,255,.04); border:0.5px solid rgba(255,255,255,.08); border-radius:4px; padding:4px 6px; outline:none; cursor:pointer; appearance:auto; width:100%; transition:border-color .15s }
.wd-dd-select:focus { border-color:rgba(55,138,221,.5) }
.wd-dd-select:hover { border-color:rgba(255,255,255,.15) }
.wd-dd-select option { background:#222226; color:#e4e4e7 }

/* Tool pills */
.wd-dd-tools { display:flex; flex-wrap:wrap; gap:4px }
.wd-dd-tool { display:flex; align-items:center; gap:4px; padding:3px 8px; border:0.5px solid rgba(255,255,255,.06); border-radius:4px; font-family:'DM Mono',monospace; font-size:9px; color:#ccc; border-left:2px solid #555; cursor:default }
.wd-dd-tool-id { font-weight:500; color:#e4e4e7 }
.wd-dd-tool-dia { color:#666 }
.wd-dd-tool-dots { display:flex; gap:2px; margin-left:2px }
.wd-dd-tdot { width:4px; height:4px; border-radius:50%; display:inline-block }

/* Footer */
.wd-dd-foot { padding:10px 14px; display:flex; justify-content:space-between; align-items:center; border-top:0.5px solid rgba(255,255,255,.06) }
.wd-dd-btn { font-family:'DM Sans',sans-serif; font-size:12px; color:#888; cursor:pointer; transition:color .12s }
.wd-dd-btn:hover { color:#e4e4e7 }
.wd-dd-btn-primary { font-family:'DM Sans',sans-serif; font-size:12px; font-weight:500; color:#378ADD; cursor:pointer; transition:opacity .12s }
.wd-dd-btn-primary:hover { opacity:.8 }
.wd-avatar { width:30px; height:30px; border-radius:50%; background:rgba(255,255,255,.08); display:flex; align-items:center; justify-content:center; font-family:'DM Sans',sans-serif; font-size:11px; font-weight:500; color:#777; cursor:pointer; transition:all .12s }
.wd-avatar:hover { background:rgba(255,255,255,.12); color:#e4e4e7 }
.wd-avatar-wrap { position:relative }
.wd-avatar-dd { display:none; position:absolute; top:calc(100% + 8px); right:0; width:240px; background:#222226; border:0.5px solid rgba(255,255,255,.12); border-radius:10px; z-index:20; overflow:hidden; padding:14px 16px }
.wd-avatar-dd.open { display:block }
.wd-avatar-dd-email { font-family:'DM Mono',monospace; font-size:11px; color:#e4e4e7; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; margin-bottom:6px }
.wd-avatar-dd-plan { font-family:'DM Mono',monospace; font-size:10px; color:#AFA9EC; background:rgba(175,169,236,.08); display:inline-block; padding:2px 8px; border-radius:3px; letter-spacing:.03em }
.wd-avatar-dd-sep { height:1px; background:rgba(255,255,255,.06); margin:12px 0 }
.wd-avatar-dd-item { font-family:'DM Sans',sans-serif; font-size:12px; color:#888; background:none; border:none; cursor:pointer; padding:0; transition:color .12s }
.wd-avatar-dd-item:hover { color:#e4e4e7 }
.wd-back { font-family:'DM Sans',sans-serif; font-size:12px; color:#777; background:none; border:0.5px solid rgba(255,255,255,.08); padding:5px 14px; border-radius:5px; cursor:pointer; transition:all .15s }
.wd-back:hover { color:#e4e4e7; border-color:rgba(255,255,255,.2) }

/* ── Layout ── */
.wd-layout { flex:1; display:flex; overflow:hidden }
.wd-sidebar { width:220px; background:#18181b; border-right:1px solid rgba(255,255,255,.06); display:flex; flex-direction:column; flex-shrink:0; overflow-y:auto }
.wd-main { flex:1; overflow-y:auto; padding:32px 40px }
.wd-main-header { display:flex; justify-content:space-between; align-items:center; margin:0 0 16px }
.wd-proj-count { font-family:'DM Mono',monospace; font-size:11px; color:#555 }
.wd-greeting { font-family:'DM Sans',sans-serif; font-size:24px; font-weight:500; color:#e4e4e7; margin:0 0 3px; letter-spacing:-.01em }
.wd-sub { font-family:'DM Mono',monospace; font-size:13px; color:#666 }

/* ── Sidebar items ── */
.wd-sb-section { padding:12px 12px }
.wd-sb-label { font-family:'DM Mono',monospace; font-size:10px; color:#555; letter-spacing:.06em; text-transform:uppercase; padding:0 8px; margin:0 0 6px }
.wd-sb-item { font-family:'DM Sans',sans-serif; font-size:12px; color:#aaa; background:none; border:none; display:flex; align-items:center; gap:8px; width:100%; padding:8px 10px; border-radius:6px; cursor:pointer; transition:all .12s; text-align:left }
.wd-sb-item:hover { background:rgba(255,255,255,.05); color:#e4e4e7 }
.wd-sb-icon { width:20px; text-align:center; font-size:14px; color:#666; flex-shrink:0 }
.wd-sb-new { color:#e4e4e7 }
.wd-sb-new .wd-sb-icon { color:#e4e4e7 }
.wd-sb-new:hover { background:rgba(255,255,255,.06) }
.wd-sb-disabled { opacity:.5; cursor:default }
.wd-sb-disabled:hover { background:none; color:#aaa }
.wd-sb-soon { font-family:'DM Mono',monospace; font-size:9px; color:#555; margin-left:auto; background:rgba(255,255,255,.04); padding:1px 5px; border-radius:3px }
.wd-sb-back { color:#666 }
.wd-sb-back:hover { color:#aaa }
.wd-sb-active { background:rgba(255,255,255,.06); color:#e4e4e7 }
.wd-sb-active .wd-sb-icon { color:#e4e4e7 }
.wd-sb-divider { height:1px; background:rgba(255,255,255,.06); margin:0 12px }
.wd-sb-spacer { flex:1 }
.wd-sb-bottom { border-top:1px solid rgba(255,255,255,.06) }

/* ── Projects header ── */
.wd-proj-head { display:flex; justify-content:space-between; align-items:center; margin:0 0 8px }
.wd-proj-label { font-family:'DM Sans',sans-serif; font-size:13px; font-weight:500; color:#e4e4e7 }
.wd-proj-tabs { display:flex; gap:2px }
.wd-proj-tab { font-family:'DM Mono',monospace; font-size:10px; padding:4px 10px; border-radius:4px; color:#666; cursor:pointer; background:none; border:none; transition:all .1s }
.wd-proj-tab:hover { color:#aaa }
.wd-proj-tab.active { background:rgba(255,255,255,.06); color:#e4e4e7 }

/* ── Project rows ── */
.wd-proj { border:0.5px solid rgba(255,255,255,.08); border-radius:8px; margin:0 0 6px; overflow:hidden; cursor:pointer; transition:border-color .15s; background:rgba(255,255,255,.025) }
.wd-proj:hover { border-color:rgba(255,255,255,.15); background:rgba(255,255,255,.04) }
.wd-proj.selected { border-color:rgba(55,138,221,.3); background:rgba(55,138,221,.02) }
.wd-proj-row { display:flex; align-items:center; gap:14px; padding:12px 16px }
.wd-proj-thumb { width:100px; height:72px; background:rgba(255,255,255,.04); border-radius:5px; display:flex; align-items:center; justify-content:center; font-family:'DM Mono',monospace; font-size:7px; color:#555; flex-shrink:0; border:0.5px solid rgba(255,255,255,.04); overflow:hidden }
.wd-proj-thumb img { width:100%; height:100%; object-fit:cover }
.wd-proj-info { flex:1; min-width:0 }
.wd-proj-name { font-family:'DM Sans',sans-serif; font-size:13px; font-weight:500; color:#e4e4e7; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; cursor:text }
.wd-proj-meta { font-family:'DM Mono',monospace; font-size:12px; color:#555; margin-top:1px }
.wd-proj-actions { display:flex; gap:4px; flex-shrink:0 }
.wd-proj-btn { font-family:'DM Sans',sans-serif; font-size:12px; padding:5px 12px; border-radius:4px; border:0.5px solid rgba(255,255,255,.08); color:#999; cursor:pointer; background:none; transition:all .12s }
.wd-proj-btn:hover { border-color:rgba(255,255,255,.2); color:#e4e4e7 }
.wd-proj-delete { color:#555; font-size:14px; padding:5px 8px; opacity:0; transition:opacity .15s }
.wd-proj:hover .wd-proj-delete { opacity:1 }
.wd-proj-delete:hover { color:#f09595; border-color:rgba(204,51,51,.3) }
.wd-proj-chevron { font-size:10px; color:#555; flex-shrink:0; margin-left:4px; transition:transform .2s }
.wd-proj.selected .wd-proj-chevron { transform:rotate(90deg); color:#85B7EB }
.wd-badge { font-family:'DM Mono',monospace; font-size:11px; font-weight:500; padding:1px 5px; border-radius:2px; margin-left:5px }
.wd-badge-shared { background:rgba(55,138,221,.12); color:#85B7EB }
.wd-badge-exported { background:rgba(30,158,90,.12); color:#5DCAA5 }
.wd-badge-draft { background:rgba(255,255,255,.06); color:#888 }

/* ── Expanded project detail ── */
.wd-proj-detail { border-top:0.5px solid rgba(255,255,255,.04); padding:14px }
.wd-proj-detail-top { display:flex; gap:14px; margin:0 0 14px }
.wd-proj-preview { width:130px; height:95px; background:rgba(255,255,255,.04); border-radius:6px; display:flex; align-items:center; justify-content:center; font-family:'DM Mono',monospace; font-size:9px; color:#555; flex-shrink:0; border:0.5px solid rgba(255,255,255,.04); overflow:hidden }
.wd-proj-preview img { width:100%; height:100%; object-fit:cover }
.wd-proj-summary { font-family:'DM Mono',monospace; font-size:11px; color:#888; line-height:1.6; flex:1 }
.wd-proj-summary b { font-weight:500; color:#ccc }

/* ── Export columns ── */
.wd-exports { display:flex; gap:12px }
.wd-export-col { flex:1 }
.wd-export-title { font-family:'DM Mono',monospace; font-size:11px; color:#666; letter-spacing:.06em; text-transform:uppercase; margin:0 0 6px; padding-left:2px }
.wd-export-list { display:flex; flex-direction:column; gap:3px }
.wd-export-btn { font-family:'DM Sans',sans-serif; display:flex; align-items:center; gap:7px; padding:7px 9px; border:0.5px solid rgba(255,255,255,.06); border-radius:5px; cursor:pointer; background:none; color:#e4e4e7; text-align:left; transition:all .12s; width:100% }
.wd-export-btn:hover { background:rgba(255,255,255,.04); border-color:rgba(255,255,255,.12) }
.wd-export-icon { width:22px; height:22px; border-radius:5px; display:flex; align-items:center; justify-content:center; flex-shrink:0 }
.wd-export-text { flex:1; min-width:0 }
.wd-export-name { font-size:13px; font-weight:500; color:#ddd }
.wd-export-desc { font-family:'DM Mono',monospace; font-size:11px; color:#666 }
.wd-export-arrow { font-size:10px; color:#555; flex-shrink:0 }

/* ── Import zone ── */
.wd-import { border:1.5px dashed rgba(255,255,255,.08); border-radius:8px; padding:16px 20px; margin:16px 0; transition:all .2s }
.wd-import:hover { border-color:rgba(255,255,255,.15) }
.wd-import p { font-family:'DM Sans',sans-serif; font-size:13px; color:#777; margin:0 0 10px }
.wd-import-input-row { display:flex; gap:8px }
.wd-import-input { flex:1; font-family:'DM Mono',monospace; font-size:12px; padding:8px 12px; background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.1); border-radius:6px; color:#e4e4e7; outline:none }
.wd-import-input:focus { border-color:rgba(55,138,221,.4) }
.wd-import-input::placeholder { color:#555 }
.wd-import-btn { font-family:'DM Sans',sans-serif; font-size:12px; font-weight:500; padding:8px 16px; background:#378ADD; color:#fff; border:none; border-radius:6px; cursor:pointer; flex-shrink:0 }
.wd-import-btn:hover { background:#2d7acc }
.wd-import-btn:disabled { opacity:.5; cursor:default }
.wd-import-status { font-family:'DM Mono',monospace; font-size:11px; display:block; margin-top:8px; min-height:16px }

/* ── AI bar ── */
.wd-ai { display:flex; gap:8px; align-items:center; margin:8px 0 0 }
.wd-ai-input { font-family:'DM Mono',monospace; flex:1; height:36px; border:0.5px solid rgba(255,255,255,.06); border-radius:7px; padding:0 12px; font-size:11px; color:#e4e4e7; background:rgba(255,255,255,.02); transition:border-color .15s }
.wd-ai-input::placeholder { color:#555 }
.wd-ai-input:focus { outline:none; border-color:rgba(175,169,236,.3) }
.wd-ai-badge { font-family:'DM Mono',monospace; font-size:9px; color:#AFA9EC; background:rgba(175,169,236,.08); padding:3px 7px; border-radius:4px }

/* ── Empty state ── */
.wd-empty { text-align:center; padding:40px 20px }
.wd-empty-icon { font-size:32px; color:#444; margin:0 0 12px }
.wd-empty-title { font-family:'DM Sans',sans-serif; font-size:16px; font-weight:500; color:#e4e4e7; margin:0 0 6px }
.wd-empty-desc { font-family:'DM Mono',monospace; font-size:11px; color:#666; margin:0 0 20px }
.wd-empty-btn { font-family:'DM Sans',sans-serif; font-size:12px; font-weight:500; padding:8px 24px; border-radius:6px; background:#378ADD; color:#fff; border:none; cursor:pointer; transition:background .15s }
.wd-empty-btn:hover { background:#2563eb }

/* ── Template grid (workshop) ── */
.wd-tpl-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:10px }
.wd-tpl-card { background:none; border:0.5px solid rgba(255,255,255,.06); border-radius:8px; overflow:hidden; cursor:pointer; transition:all .2s; text-align:left }
.wd-tpl-card:hover { border-color:rgba(255,255,255,.15); transform:translateY(-2px); box-shadow:0 4px 16px rgba(0,0,0,.3) }
.wd-tpl-img { width:100%; aspect-ratio:4/3; overflow:hidden; background:rgba(255,255,255,.03) }
.wd-tpl-img img { width:100%; height:100%; object-fit:cover; display:block }
.wd-tpl-placeholder { width:100%; height:100%; background:rgba(255,255,255,.03) }
.wd-tpl-info { padding:8px 10px; display:flex; justify-content:space-between; align-items:baseline }
.wd-tpl-name { font-family:'DM Sans',sans-serif; font-size:11px; font-weight:500; color:#e4e4e7 }
.wd-tpl-dims { font-family:'DM Mono',monospace; font-size:8px; color:#555 }