/* ==================================================================
   314 VBC — styles used only by waiver-pdf.html
   ------------------------------------------------------------------
   Everything that already had a home in assets/site.css (.pdfstage,
   .pdfpage, .pdffield, .pdffield--sig, .calib) stays there — this file
   only adds what site.css doesn't cover: the field tag chips, the
   draw/type signature toolbar, the toast, and small states like
   "invalid". Linked from waiver-pdf.html only.
   ================================================================== */

/* small always-visible label above each floated field — the
   placeholder text disappears once you start typing, this doesn't */
.pdftag{
  position:absolute;left:0;top:-15px;font-size:.6rem;font-weight:700;
  letter-spacing:.06em;text-transform:uppercase;color:var(--red-ink);
  background:#fff;padding:1px 4px;white-space:nowrap;pointer-events:none;
  box-shadow:0 0 0 1px rgba(216,30,44,.18);
}
.pdftag i{color:var(--stop);font-style:normal;margin-left:2px}

/* invalid state on a floated field */
.pdffield.is-invalid,.pdffield--sig.is-invalid{
  outline:2px solid var(--stop)!important;outline-offset:1px;
  background:var(--stop-bg)!important;
}

/* ---------- signature box: draw / type toggle ---------- */
.sigtools{
  position:absolute;left:0;top:100%;margin-top:3px;display:flex;gap:.4rem;
  align-items:center;font-size:.62rem;white-space:nowrap;z-index:5;
}
.sigtools button{
  font:inherit;font-size:.62rem;font-weight:700;letter-spacing:.03em;
  text-transform:uppercase;background:#fff;color:var(--navy-900);
  border:1px solid var(--line);padding:2px 7px;cursor:pointer;
}
.sigtools button[aria-pressed="true"]{background:var(--navy-900);color:#fff;border-color:var(--navy-900)}
.sigtools button.clear{color:var(--red-ink);border-color:rgba(216,30,44,.35)}

.sig-typebox{
  position:absolute;left:0;top:100%;margin-top:26px;width:100%;min-width:160px;
  display:flex;z-index:4;
}
.sig-typebox input{
  width:100%;border:1px solid var(--line);padding:.4rem .5rem;font-size:.85rem;
  color:var(--ink);background:#fff;font-family:var(--font-body);
}
.sig-typebox input::placeholder{color:var(--muted)}

/* the name gets rendered onto the pad canvas itself in a cursive
   webfont — this class only affects the tiny typed-name control */
.pdffield--sig.typed{background:transparent}

/* ---------- toast ---------- */
.wtoast{
  position:fixed;left:50%;bottom:1.2rem;transform:translateX(-50%) translateY(12px);
  z-index:500;min-width:260px;max-width:min(92vw,460px);display:flex;gap:.7rem;
  align-items:flex-start;padding:.9rem 1.1rem;background:var(--navy-900);color:#fff;
  box-shadow:0 18px 40px rgba(0,0,0,.35);font-size:.86rem;line-height:1.45;
  opacity:0;pointer-events:none;transition:opacity .25s var(--ease),transform .25s var(--ease);
}
.wtoast.show{opacity:1;transform:translateX(-50%) translateY(0);pointer-events:auto}
.wtoast svg{width:20px;height:20px;flex:0 0 auto;fill:currentColor;margin-top:1px}
.wtoast.ok{background:var(--ok)}
.wtoast.err{background:var(--stop)}
.wtoast b{display:block;margin-bottom:.15rem}
.wtoast .x{
  margin-left:auto;background:none;border:0;color:inherit;opacity:.7;cursor:pointer;
  font-size:1.05rem;line-height:1;padding:0 0 0 .5rem;
}
.wtoast .x:hover{opacity:1}

/* ---------- email action button gets its own tone while it's busy ---------- */
.fsticky .btn[disabled]{opacity:.6;cursor:default}

/* Error/help states inject <code> containing full CDN URLs and file
   paths. Those have no break opportunity, so on a phone they pushed the
   page ~174px wider than the viewport. Let them wrap anywhere. */
.notice code,.pdfmsg code,code{overflow-wrap:anywhere;word-break:break-word}

@media (max-width:760px){
  .pdftag{font-size:.56rem}
  .sig-typebox{min-width:0}
}

@media print{
  .wtoast,.calib{display:none!important}
}