/* Edit Mode styling — only ever applies when body has .editmode-active,
   which only happens after the ?edit=1 + passphrase gate passes.
   Safe to delete this file (and its <link> tag on each page) to remove
   Edit Mode entirely. */

body.editmode-active [data-edit-id] {
  outline: 2.5px dashed var(--pink);
  outline-offset: 3px;
  /* soft white halo so the dashed line still reads against dark/busy photo backgrounds */
  box-shadow: 0 0 0 5px rgba(255, 255, 255, 0.45);
  cursor: move;
}
body.editmode-active [data-edit-id]:hover {
  outline-color: var(--teal);
  box-shadow: 0 0 0 5px rgba(255, 255, 255, 0.65);
}
body.editmode-active .editmode-selected {
  outline: 3px solid var(--teal) !important;
  outline-offset: 3px;
  box-shadow: 0 0 0 5px rgba(255, 255, 255, 0.75) !important;
  z-index: 9999 !important;
}
body.editmode-active .editmode-overlap-warning {
  outline: 3.5px solid #e0263f !important;
  outline-offset: 3px;
  box-shadow: 0 0 0 5px rgba(255, 255, 255, 0.75) !important;
}

.editmode-handle {
  position: absolute;
  width: 14px;
  height: 14px;
  background: var(--teal);
  border: 2px solid #fff;
  border-radius: 50%;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.4);
  z-index: 10000;
  cursor: pointer;
}
.editmode-handle-resize { cursor: nwse-resize; }
.editmode-handle-rotate { cursor: grab; background: var(--pink); }

.editmode-toolbar {
  position: fixed;
  top: 16px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 10001;
  background: #1c1712;
  color: #fbf3e7;
  border-radius: 100px;
  padding: 10px 18px;
  display: flex;
  align-items: center;
  gap: 14px;
  font-family: "Space Grotesk", "Helvetica Neue", Arial, sans-serif;
  font-size: 13px;
  font-weight: 700;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.35);
}
.editmode-toolbar strong {
  color: var(--mustard);
  letter-spacing: 0.06em;
}
.editmode-bucket {
  font-weight: 500;
  opacity: 0.85;
  white-space: nowrap;
}
.editmode-toolbar button {
  font-family: inherit;
  font-weight: 700;
  font-size: 13px;
  border: none;
  border-radius: 100px;
  padding: 8px 16px;
  cursor: pointer;
}
.editmode-toolbar #editmodeSave { background: var(--teal); color: #fff; }
.editmode-toolbar #editmodeExit { background: #4a4038; color: #fbf3e7; }

.editmode-savebox {
  position: fixed;
  top: 68px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 10001;
  background: #fffcf6;
  color: #1c1712;
  border: 2px solid #1c1712;
  border-radius: 14px;
  padding: 14px 18px;
  max-width: 480px;
  font-family: "Work Sans", "Helvetica Neue", Arial, sans-serif;
  font-size: 13px;
  line-height: 1.5;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.3);
}
.editmode-savebox code {
  display: inline-block;
  background: #f4e6cf;
  padding: 2px 6px;
  border-radius: 4px;
  font-size: 12px;
  margin-top: 4px;
  word-break: break-all;
}