/* ============================================================
   inline-edit.css — the on-page editor Jo and Josh see, nobody else
   uses. Reuses the site's own tokens (css/style.css) so it looks
   native, not bolted on.
   ============================================================ */

.ps-edit-toggle{
  position:fixed; right:20px; bottom:20px; z-index:400;
  display:flex; align-items:center; gap:10px;
  background:#fff; border:1px solid var(--line); border-radius:24px;
  padding:8px 8px 8px 16px; box-shadow:0 4px 14px rgba(0,0,0,.12);
  font-family:var(--sans); font-size:13px; color:var(--ink);
}
.ps-edit-toggle button.ps-switch{
  width:40px; height:22px; border-radius:12px; border:none;
  background:var(--line); position:relative; flex-shrink:0;
}
.ps-edit-toggle button.ps-switch::after{
  content:""; position:absolute; top:2px; left:2px; width:18px; height:18px;
  border-radius:50%; background:#fff; transition:left .15s;
}
body.ps-edit-on .ps-edit-toggle button.ps-switch{ background:var(--terracotta-deep); }
body.ps-edit-on .ps-edit-toggle button.ps-switch::after{ left:20px; }

.ps-pin-pop{
  position:fixed; right:20px; bottom:78px; z-index:401;
  background:#fff; border:1px solid var(--line); border-radius:12px;
  box-shadow:0 8px 24px rgba(0,0,0,.16); padding:16px; width:220px;
  font-family:var(--sans);
}
.ps-pin-pop input{
  width:100%; text-align:center; font-family:var(--display); font-size:22px;
  letter-spacing:.28em; border:none; border-bottom:1px solid var(--line);
  padding:8px 0; margin-bottom:10px;
}
.ps-pin-pop button{
  width:100%; min-height:40px; border-radius:6px; border:none;
  background:var(--charcoal); color:#fff; font-size:13px;
}
.ps-pin-pop .ps-pin-err{ color:#9B3B1E; font-size:12px; margin:6px 0 0; display:none; }
.ps-pin-pop .ps-pin-err.show{ display:block; }

.ps-editbar{
  position:sticky; top:0; z-index:399; background:var(--charcoal); color:var(--cream);
  font-family:var(--sans); font-size:12.5px; padding:8px 20px;
  display:flex; align-items:center; justify-content:space-between; gap:12px;
}
.ps-editbar button{
  background:var(--peach); color:var(--charcoal); border:none; border-radius:14px;
  padding:5px 14px; font-size:12.5px; font-weight:600; flex-shrink:0;
}

body.ps-edit-on [data-edit]{
  outline:1.5px dashed rgba(194,84,47,.35); outline-offset:3px; border-radius:3px; cursor:text;
}
body.ps-edit-on [data-edit]:hover{ outline-color:var(--terracotta-deep); background:rgba(250,223,209,.25); }
body.ps-edit-on [data-edit].ps-active{ outline:2px solid var(--terracotta-deep); background:#fff; }

body.ps-edit-on [data-img]{
  outline:1.5px dashed rgba(194,84,47,.35); outline-offset:2px; cursor:pointer; position:relative;
}
body.ps-edit-on [data-img]:hover{ outline-color:var(--terracotta-deep); }
body.ps-edit-on [data-img]::after{
  content:"Replace photo"; position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  background:rgba(43,38,34,.55); color:#fff; font-family:var(--sans); font-size:12px; opacity:0;
}
body.ps-edit-on [data-img]:hover::after{ opacity:1; }

.ps-toast{
  position:fixed; right:20px; bottom:78px; z-index:401;
  background:var(--charcoal); color:var(--cream); font-family:var(--sans); font-size:12.5px;
  padding:9px 18px; border-radius:8px; opacity:0; pointer-events:none; transition:opacity .2s;
}
.ps-toast.show{ opacity:1; }

/* .mobilebar (css/style.css) is a sticky Call/Enquire nav fixed to the
   bottom of the screen on every public page under 699px wide, at least
   56px tall. These elements sit at a higher z-index and were landing
   on top of it. Clear it the same way .su-sticky already does. */
@media (max-width:699px){
  .ps-edit-toggle{ bottom:calc(56px + env(safe-area-inset-bottom) + 14px); }
  .ps-pin-pop, .ps-toast{ bottom:calc(56px + env(safe-area-inset-bottom) + 70px); }
}
@media (max-width:480px){
  .ps-edit-toggle{ right:14px; }
  .ps-pin-pop, .ps-toast{ right:14px; left:14px; width:auto; }
}
