/* Inspector core - header + action sections + used-by - extracted from inspector.css (phase C) */
/*
 * ══════════════════════════════════════════════════════════════
 *  inspector.css  —  Table of Contents
 * ══════════════════════════════════════════════════════════════
 *
 *  §1   Inspector 3D — core layout              ~L28
 *  §2   Action sections (Replace, Optimize…)     ~L50
 *  §3   Chip toggle row                          ~L63
 *  §4   Replace / Optimize buttons               ~L80
 *  §5   Used-by dropdown                         ~L169
 *  §6   Texture Inspector panel                  ~L208
 *  §7   Material type badge                      ~L224
 *  §8   Material Editor tabs                     ~L234
 *  §9   Object Inspector tabs / bodies           ~L266
 *  §10  States, Animation, Events                ~L292
 *  §11  Option Inspector (details, default, sides) ~L466
 *  §12  Side mapping sub-panel                   ~L567
 *  §13  Action dropdown, Transition, Bypass      ~L576
 *  §14  State rename, Text inputs                ~L599
 *  §15  Material Param Row                       ~L620
 *  §16  Transform Section (meshes)               ~L710
 *  §17  Trigger Camera rows                      ~L726
 *  §18  Material Slots List                      ~L747
 *  §19  Slot Pick Popover                        ~L810
 *  §20  Empty slot / Drag-drop                   ~L877
 *  §21  Environment Inspector                    ~L912
 *  §22  Variable type mini-menu                  ~L930
 *  §23  Texture Sub-Area                         ~L943
 *  §24  Section badge                            ~L1001
 *  §25  Prod. Layout Inspector                   ~L1007
 *  §26  Appearance / Stroke rows                 ~L1062
 *  §27  Paragraph / Character rows               ~L1089
 *  §28  Print Area Inspector                     ~L1128
 *  §29  Paragraph section                        ~L1142
 *
 * ══════════════════════════════════════════════════════════════
 */

/* ── §1 Inspector 3D ── */

.inspector-3d{
  flex:1;min-width:0;background:var(--surface);
  display:flex;flex-direction:column;overflow:hidden;
  border-radius:var(--r);
  box-shadow:var(--sh-sm);
}
.insp3d-head{
  display:flex;flex-wrap:wrap;align-items:center;gap:6px;position:relative;
  min-height:37px;flex-shrink:0;box-sizing:border-box;
  border-bottom:1px solid var(--border-light);
  cursor:pointer;
}
.insp3d-title{
  font-weight:600;font-size:13px;display:flex;align-items:center;gap:6px;
  padding:0 14px;height:37px;box-sizing:border-box;
}
.insp3d-subtitle{
  font-size:11px;color:var(--text-muted);position:relative;
  width:100%;padding:0 14px 8px;box-sizing:border-box;margin-top:-4px;
}
.insp3d-subtitle:empty{display:none;}
/* Panel-level locate button (top-right corner of header) */
.panel-locate-btn{
  position:absolute;top:10px;right:10px;
  width:16px;height:16px;padding:1px;border:none;
  background:transparent;border-radius:var(--r-sm);cursor:pointer;color:var(--text-faint);
  display:grid;place-items:center;transition:var(--tr);line-height:0;
}
.panel-locate-btn:hover{color:var(--primary);background:var(--primary-bg);}
.panel-locate-btn svg{width:12px;height:12px;}

/* ── Action sections (Replace, Optimize, etc.) ── */
.insp-action-section{
  border-top:1px solid var(--border-light);
}
.insp-action-heading{
  font-size:11px;font-weight:600;color:var(--text-secondary);
  text-transform:uppercase;letter-spacing:.4px;
  padding:10px 14px 0;
}
.insp-action-body{
  display:flex;flex-direction:column;gap:8px;padding:8px 14px 12px;
}

/* ── Chip toggle row ── */
.insp-chip-row{
  display:flex;gap:6px;
}
.insp-chip{
  flex:1;display:inline-flex;align-items:center;justify-content:center;gap:4px;
  font-size:11px;font-weight:500;padding:4px 0;
  border-radius:20px;border:1px solid var(--border);
  background:var(--surface-raised);color:var(--text-secondary);
  cursor:pointer;transition:var(--tr);user-select:none;
}
.insp-chip:hover{border-color:var(--text-muted);color:var(--text);}
.insp-chip.active{
  background:var(--primary);border-color:var(--primary);color:#fff;
}
.insp-chip.active:hover{opacity:.85;}

/* ── Replace / action button (unified) ── */
.insp-replace-go{
  display:inline-flex;align-items:center;justify-content:center;gap:5px;
  width:100%;height:32px;box-sizing:border-box;
  font-family:inherit;font-size:12px;font-weight:500;padding:0 12px;
  border-radius:var(--r-sm);border:1px solid var(--primary);
  background:var(--primary);color:white;cursor:pointer;transition:var(--tr);
}
.insp-replace-go:hover{opacity:.85;}
.insp-replace-go:disabled{opacity:.4;cursor:not-allowed;}
.insp-replace-go svg{width:13px;height:13px;}

/* Action divider */
.insp-action-divider{height:1px;background:var(--border-light);margin:2px 0;}
/* Download button (light purple) */
.insp-download-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:5px;
  width:100%;height:32px;box-sizing:border-box;
  font-family:inherit;font-size:12px;font-weight:500;padding:0 12px;
  border-radius:var(--r-sm);border:1px solid color-mix(in srgb,var(--primary) 25%,transparent);
  background:var(--primary-bg);color:var(--primary);cursor:pointer;transition:var(--tr);
}
.insp-download-btn:hover{background:var(--primary-bg-hover);border-color:color-mix(in srgb,var(--primary) 40%,transparent);}
.insp-download-btn svg{width:13px;height:13px;}

/* ── Optimize section ── */
.optim-stats{
  display:flex;flex-direction:column;gap:0;
}
.optim-stat-row{
  display:flex;align-items:center;gap:8px;padding:5px 0;
  font-size:11px;color:var(--text-secondary);
  border-bottom:1px solid var(--border-light);
}
.optim-stat-row:last-child{border-bottom:none;}
.optim-dot{
  width:7px;height:7px;border-radius:50%;flex-shrink:0;
  background:var(--text-muted);transition:background .2s;
}
.optim-dot.good{background:#27ae60;}
.optim-dot.warn{background:var(--orange);}
.optim-dot.bad{background:var(--red);}
.optim-stat-icon{width:13px;height:13px;flex-shrink:0;color:var(--text-muted);}
.optim-stat-label{flex:1;}
.optim-stat-value{font-weight:600;color:var(--text);font-variant-numeric:tabular-nums;}
.optim-action-row{
  display:flex;gap:8px;margin-top:2px;
}
.optim-preset-wrap{
  flex:1;position:relative;
}
.optim-preset-btn{
  display:flex;align-items:center;
  width:100%;height:32px;box-sizing:border-box;
  text-align:left;font-family:inherit;font-size:11px;
  padding:0 26px 0 10px;
  border:1px solid var(--border);border-radius:var(--r-sm);
  background:var(--surface-raised);color:var(--text);
  cursor:pointer;transition:var(--tr);position:relative;
}
.optim-preset-btn::after{
  content:'';position:absolute;right:9px;top:50%;transform:translateY(-50%);
  border-left:4px solid transparent;border-right:4px solid transparent;
  border-top:4px solid var(--text-muted);
}
.optim-preset-btn:hover{border-color:var(--text-muted);}
.optim-preset-menu{
  display:none;position:absolute;bottom:100%;left:0;right:0;z-index:100;
  margin-bottom:4px;padding:4px;
  background:var(--surface);border:1px solid var(--border);border-radius:var(--r-md);
  box-shadow:var(--sh);
}
.optim-preset-menu.open{display:block;}
/* .optim-preset-item base → components.css */
/* .optim-preset-sep base → components.css */
.optim-preset-sep{margin:4px 2px;}
.optim-go-btn{
  display:flex;align-items:center;justify-content:center;gap:5px;
  height:32px;box-sizing:border-box;
  font-family:inherit;font-size:12px;font-weight:400;
  padding:0 24px;white-space:nowrap;
  border-radius:var(--r-sm);border:1px solid var(--green);
  background:var(--green);color:white;cursor:pointer;transition:var(--tr);
}
.optim-go-btn:hover{opacity:.85;}
.optim-go-btn:disabled{opacity:.4;cursor:not-allowed;}
.optim-go-btn svg{width:13px;height:13px;}

/* ── Used-by dropdown (generic, reused by all inspectors) ── */
.usedby-wrap{position:relative;display:inline-block;vertical-align:baseline;}
.usedby-btn{
  display:inline-flex;align-items:center;gap:2px;cursor:pointer;
  color:var(--primary);font-weight:500;border-radius:4px;padding:1px 4px;
  transition:var(--tr);
}
.usedby-btn:hover{background:var(--primary-bg);}
.usedby-drop{
  display:none;position:absolute;top:100%;left:0;z-index:100;
  min-width:180px;max-height:240px;overflow-y:auto;
  background:var(--surface);border:1px solid var(--border);
  border-radius:var(--r-md);box-shadow:var(--sh);
  margin-top:4px;padding:4px;
}
.usedby-drop.open{display:block;}
/* .usedby-item base → components.css */
.usedby-selall{color:var(--primary);}
/* .usedby-sep base → components.css */
.usedby-sep{margin:2px 0;}

.insp3d-tabs{
  display:flex;gap:0;border-bottom:1px solid var(--border-light);padding:0 14px;margin-top:4px;
}
.insp3d-tab{
  padding:8px 12px;font-size:12px;font-weight:500;color:var(--text-muted);
  border:none;background:none;cursor:pointer;border-bottom:2px solid transparent;
  transition:var(--tr);white-space:nowrap;
}
.insp3d-tab:hover{color:var(--text);background:rgba(0,0,0,.03);border-radius:var(--r-sm) var(--r-sm) 0 0;}
.insp3d-tab.active{color:var(--primary);border-bottom-color:var(--primary);}
.insp3d-tab.active:hover{background:color-mix(in srgb, var(--primary) 4%, transparent);border-radius:var(--r-sm) var(--r-sm) 0 0;}
.insp3d-body{flex:1;overflow-y:auto;padding:0;min-height:0;}
.insp3d-panel{display:none;}
.insp3d-panel.active{display:flex;flex-direction:column;height:100%;overflow:hidden;}