/* ==========================================================================
   Admin mode styles
   - Top banner + login modal
   - Body class .sc-admin-mode neutralizes gallery overlays so drag-and-drop works
   - Editable text outline + tooltip when hovering content-id elements
   ========================================================================== */

#sc-admin-bar {
  display: none;
  position: fixed; top: 0; left: 0; right: 0;
  z-index: 9999;
  background: #432A60; color: #fff;
  padding: 10px 20px;
  align-items: center; justify-content: space-between;
  font-family: system-ui, -apple-system, sans-serif;
  font-size: 13px;
  gap: 1rem;
  box-shadow: 0 2px 12px rgba(0,0,0,.3);
}
#sc-admin-bar a { color: rgba(255,255,255,.7); text-decoration: none; font-size: 12px; white-space: nowrap; flex-shrink: 0; }

#sc-admin-modal {
  display: none;
  position: fixed; inset: 0;
  z-index: 10000;
  background: rgba(0,0,0,.6);
  align-items: center; justify-content: center;
}
#sc-admin-modal .sc-modal-card {
  background: #FAF3EC; border-radius: 16px; padding: 2.5rem;
  max-width: 360px; width: 90%;
  box-shadow: 0 24px 60px rgba(0,0,0,.35);
  font-family: 'Nunito', system-ui, sans-serif;
}
#sc-admin-modal h2 { color: #432A60; font-size: 1.4rem; margin-bottom: .5rem; font-family: 'Cormorant Garamond', serif; }
#sc-admin-modal p.sc-modal-info { color: #5A4570; font-size: .9rem; margin-bottom: 1.5rem; line-height: 1.5; }
#sc-pass-input { width: 100%; padding: 10px 14px; border: 1.5px solid #C4A8D8; border-radius: 8px; font-size: 1rem; outline: none; margin-bottom: .75rem; box-sizing: border-box; background: #fff; color: #2D1B3D; font-family: inherit; }
#sc-pass-error { color: #b3261e; font-size: .85rem; margin-bottom: .75rem; display: none; }
#sc-pass-btn { width: 100%; padding: 10px; background: #432A60; color: #fff; border: none; border-radius: 8px; font-size: 1rem; font-weight: 600; cursor: pointer; font-family: inherit; }

/* ── Body in admin mode ──────────────────────────────────────────────── */
body.sc-admin-mode .m-overlay,
body.sc-admin-mode .m-zoom { pointer-events: none !important; }
body.sc-admin-mode .m-item { cursor: default; transform: none !important; }
body.sc-admin-mode .pic { overflow: visible; }

/* ── Editable text indicators in admin mode ──────────────────────────── */
body.sc-admin-mode [data-content-id] {
  outline: 1px dashed rgba(67,42,96,0.35);
  outline-offset: 4px;
  border-radius: 4px;
  transition: outline-color 0.18s, background 0.18s;
  cursor: text;
}
body.sc-admin-mode [data-content-id]:hover {
  outline-color: rgba(67,42,96,0.85);
  background: rgba(196,168,216,0.18);
}
body.sc-admin-mode [data-content-id][contenteditable="true"]:focus {
  outline: 2px solid #432A60;
  outline-offset: 4px;
  background: rgba(255,255,255,0.65);
}

/* Save status pill that appears when saving content edits */
.sc-save-status {
  position: fixed;
  top: 56px;
  right: 20px;
  z-index: 9998;
  background: #432A60; color: #fff;
  padding: 6px 14px;
  border-radius: 999px;
  font-family: 'Nunito', system-ui, sans-serif;
  font-size: 12px; font-weight: 600;
  box-shadow: 0 4px 12px rgba(0,0,0,.25);
  opacity: 0;
  transform: translateY(-6px);
  transition: opacity .18s, transform .18s;
  pointer-events: none;
}
.sc-save-status.visible { opacity: 1; transform: translateY(0); }
.sc-save-status.error { background: #b3261e; }