/* Public, unauthenticated pages: sign-in, the balance-confirmation response
   page and the self-validation form. These reuse the portal's own tokens and
   card/table/button styles; only the page frame is new, because there is no
   sidebar or topbar to sit inside. */

body.public-page{
  background:var(--page);
  min-height:100vh;
  padding:28px 18px 40px;
  color:var(--text-primary);
}

.public-shell{
  max-width:520px;
  margin:0 auto;
}
.public-shell.wide{ max-width:1080px; }

.public-card{
  background:var(--surface-1);
  border:1px solid var(--border);
  border-radius:14px;
  padding:26px;
  box-shadow:0 1px 2px rgba(11,11,11,.04), 0 8px 24px rgba(11,11,11,.05);
}

.public-brand{
  display:flex; align-items:center; gap:9px;
  font-weight:700; font-size:16px; letter-spacing:-.01em;
}
.public-brand .mark{
  display:inline-grid; place-items:center;
  width:26px; height:26px; border-radius:7px;
  background:var(--series-1); color:#fff;
  font-size:11.5px; font-weight:800; letter-spacing:.02em;
}

/* Stacked label/field pairs used by the sign-in and dispute forms. */
.fgrid{ display:grid; gap:12px; margin-top:14px; }
.fgrid label{ display:block; }
.fgrid label > span{
  display:block; font-size:12px; font-weight:600;
  color:var(--text-secondary); margin-bottom:5px;
}
.fgrid input, .fgrid select, .fgrid textarea{ width:100%; }
.fgrid .err{ display:block; margin-top:4px; font-size:12px;
  font-style:normal; color:var(--critical); }
.fgrid .hint{ display:block; margin-top:4px; font-size:11.5px;
  font-style:normal; color:var(--text-secondary); }

/* The core stylesheet styles text inputs only; public forms also use these. */
body.public-page input[type=email], body.public-page input[type=tel]{
  width:100%; padding:8px 10px; border:1px solid var(--border); border-radius:8px; font-size:13px;
  background:var(--surface-1); color:var(--text-primary); font-family:inherit;
}
body.public-page input:disabled, body.public-page select:disabled{
  background:var(--page); color:var(--text-secondary); cursor:not-allowed;
}

.alert{
  border-radius:10px; padding:11px 13px; margin-top:14px;
  font-size:13px; border:1px solid var(--border);
}
.alert.critical{
  border-left:4px solid var(--critical);
  background:rgba(208,59,59,.06);
  color:var(--critical);
}

/* Response choice cards behave as radio targets. */
.bc-choice{ position:relative; display:block; transition:border-color .12s ease; }
.bc-choice input[type=radio]{ margin-right:7px; }
.bc-choice.selected{ box-shadow:0 0 0 2px var(--series-1) inset; }

@media print{
  body.public-page{ background:#fff; padding:0; }
  .noprint{ display:none !important; }
  .public-shell.wide{ max-width:none; }
}