/* ==========================================================================
   Homepage inline text editor — hidden login hotspot, edit bar, login modal,
   in-place editing outlines. Uses the site's theme vars (--cp primary bg,
   --ca accent). Scoped so it never touches the configurator / visualizer
   iframes (which are separate documents).
   ========================================================================== */

/* hidden login hotspot — invisible, bottom-right corner (bba-bar owns bottom-left) */
#hed-hotspot{
  position:fixed; right:0; bottom:0; width:46px; height:46px; z-index:99990;
  background:transparent; border:0; padding:0; cursor:default;
}

/* ---- edit bar (shown when logged in) ---- */
#hed-bar{
  position:fixed; left:50%; bottom:18px; transform:translateX(-50%);
  z-index:99997; display:flex; align-items:center; gap:10px;
  padding:8px 10px 8px 14px; border-radius:999px;
  background:var(--cp,#8d85ff); border:2px solid var(--ca,#a3ffae);
  box-shadow:0 10px 34px rgba(0,0,0,.34);
  font-family:'Space Mono',ui-monospace,monospace;
}
#hed-bar .hed-dot{ width:8px; height:8px; border-radius:50%; background:var(--ca,#a3ffae); box-shadow:0 0 8px var(--ca,#a3ffae); }
#hed-bar .hed-label{ font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--ca,#a3ffae); margin-right:2px; }
.hed-btn{
  font:inherit; font-size:11px; letter-spacing:.1em; text-transform:uppercase;
  cursor:pointer; padding:8px 14px; border-radius:999px;
  border:1.5px solid var(--ca,#a3ffae); background:transparent; color:var(--ca,#a3ffae);
  transition:background .15s ease,color .15s ease;
}
.hed-btn:hover{ background:var(--ca,#a3ffae); color:var(--cp,#8d85ff); }
.hed-btn--primary{ background:var(--ca,#a3ffae); color:var(--cp,#8d85ff); }
.hed-btn--primary.is-on{ box-shadow:0 0 0 2px var(--cp,#8d85ff),0 0 0 4px var(--ca,#a3ffae); }
.hed-btn--ghost{ opacity:.75; }

/* ---- editing state ---- */
[data-edit].hed-editable{
  outline:2px dashed rgba(var(--ca-rgb,163,255,174),.9);
  outline-offset:3px; border-radius:3px;
  cursor:text; transition:outline-color .15s ease, background .15s ease;
}
[data-edit].hed-editable:hover{ background:rgba(0,0,0,.14); }
[data-edit].hed-editable:focus{ outline-style:solid; background:rgba(0,0,0,.22); }

/* ---- overlay + login / message modal ---- */
#hed-overlay{
  position:fixed; inset:0; z-index:99999; display:none;
  align-items:center; justify-content:center; padding:20px;
  background:rgba(8,6,20,.62); backdrop-filter:blur(3px);
}
#hed-overlay.is-open{ display:flex; }
.hed-modal{
  width:100%; max-width:340px; border-radius:14px; overflow:hidden;
  background:var(--cp,#8d85ff); border:2px solid var(--ca,#a3ffae);
  box-shadow:0 20px 60px rgba(0,0,0,.45);
  font-family:'Space Mono',ui-monospace,monospace; color:var(--ca,#a3ffae);
}
.hed-modal-head{ padding:16px 18px 6px; }
.hed-modal-head h2{ margin:0; font-size:15px; letter-spacing:.04em; }
.hed-modal-head p{ margin:4px 0 0; font-size:11.5px; opacity:.8; line-height:1.5; }
.hed-modal-body{ padding:12px 18px 18px; display:flex; flex-direction:column; gap:10px; }
.hed-field{ display:block; }
.hed-field span{ display:block; font-size:10.5px; letter-spacing:.1em; text-transform:uppercase; opacity:.8; margin:0 0 5px; }
.hed-field input{
  width:100%; box-sizing:border-box; font:inherit; font-size:13px;
  padding:9px 11px; border-radius:8px;
  border:1.5px solid rgba(var(--ca-rgb,163,255,174),.5);
  background:rgba(0,0,0,.18); color:var(--ca,#a3ffae);
}
.hed-field input:focus{ outline:none; border-color:var(--ca,#a3ffae); }
.hed-modal-foot{ display:flex; gap:8px; justify-content:flex-end; margin-top:2px; }
.hed-msg{ font-size:11.5px; min-height:1em; margin:2px 0 0; }
.hed-msg--err{ color:#ff5c7a; }
.hed-msg--ok{ color:var(--ca,#a3ffae); }

/* give the real cursor back inside editor UI (the site hides it with a custom cursor) */
#hed-bar, #hed-bar *, #hed-overlay, #hed-overlay *{ cursor:auto; }
#hed-bar .hed-btn, #hed-overlay button{ cursor:pointer; }
#hed-overlay input{ cursor:text; }