/* Hydrodiv — éditeur de contenu visuel (front). Styles actifs uniquement en mode édition. */
.hde-bar{
  position:fixed;top:0;left:0;right:0;z-index:99999;
  display:flex;align-items:center;gap:16px;
  padding:8px 16px;background:#0D1B2A;color:#fff;font:600 13px/1.3 system-ui,Arial,sans-serif;
  box-shadow:0 2px 12px rgba(0,0,0,.35);
}
.hde-bar span{font-weight:400;opacity:.85;}
.hde-bar__quit{margin-left:auto;background:#E0B341;color:#0D1B2A;padding:5px 14px;border-radius:6px;text-decoration:none;font-weight:700;}
.hde-bar__quit:hover{filter:brightness(1.08);}
body.hde-editing{padding-top:42px !important;}

.hde-editing .hde-zone{
  outline:2px dashed rgba(224,179,65,.85);outline-offset:3px;
  cursor:text;transition:outline-color .15s,background .15s;border-radius:3px;
}
.hde-editing .hde-zone:hover{outline-color:#E0B341;background:rgba(224,179,65,.10);}
.hde-editing .hde-zone.hde-active{outline:2px solid #16a34a;background:rgba(22,163,74,.08);}

.hde-editing .hde-zone-link{position:relative;}
.hde-linkbtn{
  position:absolute;top:-12px;right:-12px;z-index:50;
  width:26px;height:26px;border:none;border-radius:50%;
  background:#0D1B2A;color:#fff;font-size:13px;cursor:pointer;
  box-shadow:0 2px 6px rgba(0,0,0,.3);line-height:26px;padding:0;
}
.hde-linkbtn:hover{background:#E0B341;}

.hde-toast{
  position:fixed;bottom:24px;left:50%;transform:translateX(-50%) translateY(20px);
  z-index:100000;background:#16a34a;color:#fff;padding:10px 22px;border-radius:8px;
  font:600 14px system-ui,Arial,sans-serif;opacity:0;transition:opacity .25s,transform .25s;
  box-shadow:0 4px 16px rgba(0,0,0,.3);
}
.hde-toast--err{background:#dc2626;}
.hde-toast.hde-show{opacity:1;transform:translateX(-50%) translateY(0);}

/* ---- v2 : image + boutons ---- */
.hde-editing .hde-zone-link, .hde-editing .hde-zone-img, .hde-editing a[data-hde-btn] { position: relative; }
.hde-editing [data-hde-img]{ outline:2px dashed rgba(224,179,65,.85); outline-offset:3px; cursor:pointer; border-radius:3px; }
.hde-ovbtn{ position:absolute; top:-12px; right:-12px; z-index:55; width:28px; height:28px; border:none; border-radius:50%;
  background:#0D1B2A; color:#fff; font-size:14px; line-height:28px; padding:0; cursor:pointer; box-shadow:0 2px 6px rgba(0,0,0,.3); }
.hde-ovbtn:hover{ background:#E0B341; }
.hde-editing .hde-zone-btns{ outline:2px dashed rgba(22,163,74,.7); outline-offset:6px; border-radius:8px; min-height:24px; }
.hde-addbtn{ display:inline-block; margin:6px; padding:6px 12px; border:2px dashed #16a34a; background:rgba(22,163,74,.10);
  color:#16a34a; font-weight:700; border-radius:8px; cursor:pointer; }
.hde-addbtn:hover{ background:rgba(22,163,74,.20); }
.hde-btnctl{ position:absolute; top:-10px; width:20px; height:20px; border-radius:50%; font-size:11px; line-height:20px;
  text-align:center; cursor:pointer; color:#fff; z-index:60; box-shadow:0 1px 3px rgba(0,0,0,.3); }
.hde-btnctl--rm{ right:-8px; background:#dc2626; }
.hde-btnctl--ed{ right:16px; background:#0D1B2A; }