/* ──────────────────────────────────────────────────────────────────────────
   edit-master.css — "Edit Master" wireframe overlay (template only).
   Toggle button (top-centre) + dashed outlines + schema badges (A1, A1A…).
   Tokens from base.css. Paired with edit-master.js.
   ────────────────────────────────────────────────────────────────────────── */

.me-toggle {
  position: fixed; top: 10px; left: 50%; transform: translateX(-50%); z-index: 80;
  border: 1px solid var(--sm-border); background: #fff; color: var(--sm-text-body);
  font: 500 13px/1 'Roboto', sans-serif; padding: 8px 16px; border-radius: 999px;
  cursor: pointer; opacity: 0.5; box-shadow: var(--soft-shadow); transition: opacity 0.15s ease;
}
.me-toggle:hover, .me-toggle:focus { opacity: 1; }
.me-toggle.is-active { opacity: 1; background: var(--sm-blue); color: #fff; border-color: var(--sm-blue); }

/* Wireframe outlines (outline doesn't affect layout) + anchor for badges.
   The section is only a FAINT frame (we don't want a heavy box around everything);
   the CONTENT components are the clear dashed boxes. */
body.master-edit .me-labeled { position: relative; outline: 1px dashed rgba(0, 133, 232, 0.6); outline-offset: 1px; }
body.master-edit .me-section { outline: 1px solid rgba(0, 133, 232, 0.18); outline-offset: -1px; }
body.master-edit .me-chrome { outline: 1px dashed rgba(0, 49, 102, 0.5); }

/* Schema badge — code + type, top-left of each labelled block. */
.me-badge {
  position: absolute; top: 2px; left: 2px; z-index: 70;
  font: 700 10px/1 ui-monospace, 'Roboto Mono', monospace; letter-spacing: 0.03em;
  background: var(--sm-blue); color: #fff; padding: 3px 6px; border-radius: 4px;
  pointer-events: none; white-space: nowrap; opacity: 0.92;
}
/* Section badge = Erin's frame name — the clear marker for each outer frame. */
.me-badge-section { background: #003166; font-size: 11px; font-weight: 700; padding: 4px 9px; letter-spacing: 0.02em; text-transform: none; }
.me-badge-chrome { background: #5b6b7b; }

/* Never show the overlay in print / PDF export. */
@media print {
  .me-toggle, .me-badge { display: none !important; }
  body.master-edit .me-labeled { outline: none !important; }
}
</content>