/* Muurtextuur-mixer: page-specific parts. Colours come from the --mcdp-* tokens. */
#mctx input[type="text"] {
  width: 100%; margin: 0; font: 600 14px var(--mcdp-mono); color: var(--mcdp-ink); background: var(--mcdp-bg);
  border: 1px solid var(--mcdp-line); border-radius: 4px; padding: 6px 8px; box-shadow: none; min-width: 0;
}
#mctx input[type="text"].mctx-name { font-family: inherit; font-weight: 700; }
#mctx input[aria-invalid="true"] { border-color: var(--mcdp-mark); }
#mctx input:focus-visible { outline: 2px solid var(--mcdp-mark); outline-offset: 2px; }

.mctx-seed-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; align-items: center; }

.mctx-mats { display: grid; gap: 8px; }
.mctx-mat {
  display: grid; grid-template-columns: 34px minmax(0, 1fr) auto; gap: 6px; align-items: center;
  padding: 8px; border: 1px solid var(--mcdp-line); border-radius: 4px; background: var(--mcdp-bg);
}
#mctx .mctx-mat input[type="color"] {
  width: 34px; height: 32px; padding: 2px; margin: 0; border: 1px solid var(--mcdp-line); border-radius: 4px;
  background: var(--mcdp-surface); cursor: pointer;
}
#mctx .mctx-mat .mctx-id { grid-column: 1 / -1; font-size: 13px; }
.mctx-share { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; align-items: center; }
.mctx-pct { display: flex; align-items: center; gap: 4px; font-size: 13px; color: var(--mcdp-muted); }
#mctx .mctx-pct input[type="number"] { width: 62px; font-size: 14px; padding: 6px 6px; }
#mctx .mctx-del { padding: 4px 9px; font-size: 15px; line-height: 1.2; }
.mctx-err { grid-column: 1 / -1; font-size: 12px; color: var(--mcdp-mark); margin: 0; }

#mctx .mctx-chip { font-weight: 600; }
.mctx-name-cell { display: flex; align-items: center; gap: 6px; font-family: inherit; }
.mctx-name-cell small { display: block; font-family: var(--mcdp-mono); font-size: 11px; color: var(--mcdp-muted); }
#mctx td.mctx-mat-td { font-family: inherit; }
.mctx-sub { display: block; font-size: 11px; color: var(--mcdp-muted); }

/* The export card: blocks come from the material list, so the block picker is not needed. */
#mctx-export .bx-row label, #mctx-export .bx-row select, #mctx-export .bx-row input { display: none !important; }