/* Shared owner-editing UI. Sites may override --edit-accent / --edit-bg. */
:root { --edit-accent: #d9a441; --edit-bg: rgba(20,20,20,.95); --edit-ink: #fff; }

body.editing [data-i18n] {
  outline: none; border-radius: .25rem;
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--edit-accent) 40%, transparent);
  transition: box-shadow .2s;
}
body.editing [data-i18n]:hover { box-shadow: 0 0 0 1px var(--edit-accent); }
body.editing [data-i18n]:focus { box-shadow: 0 0 0 2px var(--edit-accent); background: color-mix(in srgb, var(--edit-accent) 8%, transparent); }
/* never make nav links editable-looking */
body.editing nav [data-i18n], body.editing .mobile-panel [data-i18n] { box-shadow: none; }

.edit-fab {
  position: fixed; inset-block-end: 1rem; inset-inline-end: 1rem; z-index: 70;
  width: 2.5rem; height: 2.5rem; border-radius: 50%;
  border: 1px solid color-mix(in srgb, var(--edit-accent) 35%, transparent);
  background: rgba(20,20,20,.6); backdrop-filter: blur(8px); color: #999;
  cursor: pointer; display: flex; align-items: center; justify-content: center; transition: all .2s;
}
.edit-fab:hover { color: var(--edit-accent); border-color: var(--edit-accent); }
.edit-fab svg { width: 1.1rem; height: 1.1rem; }

.edit-bar {
  position: fixed; inset-block-end: 1rem; inset-inline-end: 1rem; z-index: 70; display: none;
  align-items: center; gap: .5rem; padding: .55rem .7rem; border-radius: 999px;
  background: var(--edit-bg); border: 1px solid color-mix(in srgb, var(--edit-accent) 40%, transparent);
  backdrop-filter: blur(12px); box-shadow: 0 10px 30px rgba(0,0,0,.45);
}
.edit-bar.show { display: flex; }
.edit-bar .who { font-size: .72rem; color: #999; max-width: 9rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.edit-bar button { font-family: 'Inter', system-ui, sans-serif; font-size: .78rem; font-weight: 600; border-radius: 999px; padding: .4rem .8rem; cursor: pointer; border: 1px solid transparent; transition: all .2s; }
.eb-toggle { background: rgba(255,255,255,.08); color: var(--edit-ink); border-color: rgba(255,255,255,.15); }
.eb-toggle:hover { background: rgba(255,255,255,.16); }
.eb-save { background: var(--edit-accent); color: #1a1407; }
.eb-save:disabled { opacity: .4; cursor: not-allowed; }
.eb-save:not(:disabled):hover { filter: brightness(1.1); }
.eb-out { background: none; color: #999; padding: .4rem .5rem; }
.eb-out:hover { color: var(--edit-ink); }
.edit-hint {
  position: fixed; inset-block-end: 4rem; inset-inline-end: 1rem; z-index: 70;
  font-size: .72rem; color: var(--edit-accent); background: var(--edit-bg);
  border: 1px solid color-mix(in srgb, var(--edit-accent) 25%, transparent);
  border-radius: .6rem; padding: .5rem .7rem; max-width: 14rem; display: none;
}
body.editing .edit-hint { display: block; }

/* image slots (hero portrait + gallery) */
body.editing [data-img] { cursor: pointer; }
body.editing [data-img]::after {
  content: '📷'; position: absolute; inset-block-end: .4rem; inset-inline-end: .5rem;
  font-size: 1rem; background: rgba(20,20,20,.7); border-radius: 999px; padding: .2rem .4rem; z-index: 3;
}
