/* Inspector material - texture/mat-badge/mat-editor/pivot - extracted from inspector.css (phase C) */

/* ── Texture Inspector ── */
.tex-insp-preview{
  margin:14px;border-radius:var(--r-sm);overflow:hidden;border:1px solid var(--border);
  background:repeating-conic-gradient(var(--bg) 0% 25%, var(--surface) 0% 50%) 50%/16px 16px;
  display:flex;align-items:center;justify-content:center;aspect-ratio:1;
}
.tex-insp-preview img{width:100%;height:100%;object-fit:contain;display:block;}
.tex-insp-props{padding:0 14px 14px;}
.tex-insp-row{
  display:flex;justify-content:space-between;align-items:center;
  padding:6px 0;border-bottom:1px solid var(--border-light);font-size:11px;
}
.tex-insp-row:last-child{border-bottom:none;}
.tex-insp-label{color:var(--text-muted);font-weight:500;}
.tex-insp-value{color:var(--text);text-align:right;font-weight:400;}

/* ── Material type badge ── */
.mat-type-badge{
  display:inline-flex;align-items:center;gap:4px;font-size:10px;font-weight:600;
  padding:2px 8px;border-radius:20px;text-transform:uppercase;letter-spacing:.3px;
}
.mat-type-badge.master{background:var(--primary-bg);color:var(--primary);}
.mat-type-badge.inherit{background:var(--green-bg);color:var(--green);}
.mat-type-badge.instance{background:var(--orange-bg);color:var(--orange);}
.mat-type-badge .chain-icon{width:10px;height:10px;}

/* ── Material Editor Sections ── */
.mat-section{border-bottom:1px solid var(--border-light);}
.mat-section-head{
  display:flex;align-items:center;gap:6px;padding:10px 14px;cursor:pointer;
  transition:background .12s;user-select:none;
}
.mat-section-head:hover{background:var(--bg);}
/* Chevron — CSS-rendered (no inline SVG markup needed in HTML).
   Kept legacy `.mat-section-chev` selector for any leftover inline SVG, plus
   a pseudo-element on the head/sub-head so the markup can omit the SVG. */
.mat-section-head::before,
.mat-section-sub-head::before,
.mat-section-chev{
  content:'';
  width:12px;height:12px;color:var(--text-muted);flex-shrink:0;
  transition:transform .15s;transform:rotate(90deg);
  background-color:currentColor;
  -webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'><polyline points='9 18 15 12 9 6'/></svg>") center/contain no-repeat;
          mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'><polyline points='9 18 15 12 9 6'/></svg>") center/contain no-repeat;
}
/* If both an inline `<svg class="mat-section-chev">` and the ::before exist
   in legacy markup, hide the pseudo to avoid double chevrons. */
.mat-section-head:has(> .mat-section-chev)::before,
.mat-section-sub-head:has(> .mat-section-chev)::before{display:none;}
.mat-section.collapsed > .mat-section-head::before,
.mat-section.collapsed .mat-section-chev{transform:rotate(0);}
.mat-section.collapsed .mat-section-body{display:none;}
.mat-section-label{font-size:11px;font-weight:600;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.4px;flex:1;}
.mat-section-head .fc-toggle-header{flex-shrink:0;margin-left:auto;}
.mat-section-body{padding:4px 0 8px;}
.mat-section-body.cam-disabled{opacity:.35;pointer-events:none;}

/* ── Pivot sub-section (nested inside Transform) ── */
.mat-section-sub{border-top:1px solid var(--border-light);margin:4px 14px 0;border-radius:var(--r-sm);}
.mat-section-sub-head{
  display:flex;align-items:center;gap:5px;padding:6px 0;cursor:pointer;
  user-select:none;transition:background .12s;
}
.mat-section-sub-head:hover{opacity:.8;}
.mat-section-sub-label{font-size:10px;font-weight:600;color:var(--text-muted);text-transform:uppercase;letter-spacing:.4px;}
.mat-section-sub-head::before,
.mat-section-sub .mat-section-chev{width:10px;height:10px;}
.mat-section-sub.collapsed > .mat-section-sub-head::before,
.mat-section-sub.collapsed .mat-section-chev{transform:rotate(0);}
.mat-section-sub.collapsed .mat-section-body{display:none;}
.mat-section-sub .mat-section-body{padding:0 0 4px;}