/* ============================================================
   Editor inline — Dr. Bruno Couto Moreira
   Interface de edição fácil para o site (sem login, sem servidor).
   Carregado em todas as páginas. A UI só aparece quando ativada.
   ============================================================ */

:root {
  --ed-accent: #2A574F;
  --ed-accent-deep: #14322D;
  --ed-gold: #B08A4F;
  --ed-bg: #ffffff;
  --ed-ink: #1B2123;
  --ed-muted: #6b7472;
  --ed-danger: #b03a2e;
  --ed-shadow: 0 10px 40px rgba(20,24,26,0.18), 0 2px 8px rgba(20,24,26,0.10);
}

/* Botão flutuante para abrir o editor */
#ed-launch {
  position: fixed;
  left: 20px;
  bottom: 20px;
  z-index: 2147483000;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 46px;
  padding: 0 18px 0 16px;
  border-radius: 999px;
  background: var(--ed-accent-deep);
  color: #fff;
  font: 600 14px/1 -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;
  border: 0;
  cursor: pointer;
  box-shadow: var(--ed-shadow);
  transition: transform .15s ease, background .15s ease;
}
#ed-launch:hover { transform: translateY(-1px); background: #0f2521; }
#ed-launch svg { width: 18px; height: 18px; }

/* Barra de ferramentas (topo) — visível só em modo edição */
#ed-bar {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 2147483001;
  display: none;
  align-items: center;
  gap: 10px;
  padding: 10px 16px;
  background: var(--ed-accent-deep);
  color: #fff;
  box-shadow: 0 4px 20px rgba(0,0,0,.2);
  font: 500 14px/1.2 -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;
  flex-wrap: wrap;
}
body.ed-on #ed-bar { display: flex; }
body.ed-on { padding-top: 62px !important; }

#ed-bar .ed-title {
  display: inline-flex; align-items: center; gap: 8px;
  font-weight: 700; letter-spacing: .01em; margin-right: auto;
}
#ed-bar .ed-title svg { width: 18px; height: 18px; }
#ed-bar .ed-title small { font-weight: 500; opacity: .7; font-size: 12px; }

.ed-btn {
  display: inline-flex; align-items: center; gap: 7px;
  height: 38px; padding: 0 15px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.25);
  background: transparent;
  color: #fff;
  font: 600 13px/1 inherit;
  cursor: pointer;
  transition: background .15s ease, border-color .15s ease, transform .15s ease;
  white-space: nowrap;
}
.ed-btn:hover { background: rgba(255,255,255,.12); transform: translateY(-1px); }
.ed-btn svg { width: 16px; height: 16px; }
.ed-btn.primary { background: var(--ed-gold); border-color: var(--ed-gold); color: #2a1e07; }
.ed-btn.primary:hover { background: #c69a58; }
.ed-btn.danger { border-color: rgba(255,180,170,.5); color: #ffd9d3; }
.ed-btn.danger:hover { background: rgba(176,58,46,.35); }
.ed-btn.ghost { border-color: transparent; opacity: .85; }

/* Contador de alterações */
#ed-count {
  font-size: 12px; font-weight: 600; opacity: .8;
  padding: 4px 10px; border-radius: 999px; background: rgba(255,255,255,.1);
}

/* Elementos editáveis — realce em modo edição */
body.ed-on [data-ed-id] {
  outline: 1.5px dashed rgba(42,87,79,.35);
  outline-offset: 3px;
  border-radius: 3px;
  transition: outline-color .15s ease, background .15s ease;
  cursor: text;
}
body.ed-on [data-ed-id]:hover {
  outline-color: var(--ed-accent);
  background: rgba(176,138,79,.08);
}
body.ed-on [data-ed-id]:focus {
  outline: 2px solid var(--ed-gold);
  outline-offset: 3px;
  background: rgba(176,138,79,.10);
  cursor: text;
}
body.ed-on [data-ed-changed="1"] {
  outline-color: var(--ed-gold);
}
/* Não deixar links navegarem enquanto edita */
body.ed-on a { cursor: text; }

/* Imagens editáveis */
body.ed-on [data-ed-img] {
  position: relative;
  cursor: pointer;
}
.ed-img-wrap {
  position: relative;
  display: inline-block;
  outline: 1.5px dashed rgba(42,87,79,.4);
  outline-offset: 3px;
}
.ed-img-btn {
  position: absolute;
  inset: 0;
  display: none;
  align-items: center;
  justify-content: center;
  gap: 8px;
  background: rgba(20,50,45,.55);
  color: #fff;
  font: 600 13px/1 -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;
  border: 0;
  cursor: pointer;
  z-index: 3;
}
body.ed-on .ed-img-wrap:hover .ed-img-btn { display: flex; }
.ed-img-btn svg { width: 20px; height: 20px; }

/* Toast de feedback */
#ed-toast {
  position: fixed;
  bottom: 24px; left: 50%;
  transform: translateX(-50%) translateY(20px);
  z-index: 2147483002;
  background: var(--ed-ink);
  color: #fff;
  padding: 12px 20px;
  border-radius: 10px;
  font: 500 14px/1.3 -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;
  box-shadow: var(--ed-shadow);
  opacity: 0;
  pointer-events: none;
  transition: opacity .25s ease, transform .25s ease;
  max-width: 90vw;
}
#ed-toast.show { opacity: 1; transform: translateX(-50%) translateY(0); }
#ed-toast.ok { background: #1e4d43; }
#ed-toast.warn { background: #8a5a1a; }

/* Painelzinho de ajuda */
#ed-help {
  position: fixed;
  left: 16px; bottom: 78px;
  z-index: 2147483001;
  display: none;
  max-width: 300px;
  background: #fff;
  color: var(--ed-ink);
  border-radius: 14px;
  padding: 16px 18px;
  box-shadow: var(--ed-shadow);
  font: 400 13.5px/1.5 -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;
}
body.ed-on #ed-help.show { display: block; }
#ed-help h4 { margin: 0 0 8px; font-size: 14px; color: var(--ed-accent-deep); }
#ed-help ul { margin: 0; padding-left: 18px; }
#ed-help li { margin-bottom: 5px; }
#ed-help .ed-close-help {
  position: absolute; top: 8px; right: 10px;
  background: none; border: 0; font-size: 18px; cursor: pointer; color: var(--ed-muted);
}

/* Esconde a UI do editor na exportação/print */
@media print { #ed-launch, #ed-bar, #ed-toast, #ed-help { display: none !important; } }
