/* Additions for the .NET member flow on top of zaffire.css (Hanspoul's reference styles).
   Only adapts the reference to server-rendered markup: links instead of buttons, real form controls. */

a.btn, a.back, a.opt, a.stat, a.src { text-decoration: none; }
.topnav a { color: inherit; text-decoration: none; }
.topnav a:hover { color: var(--ink); }
.topright a.avatar { text-decoration: none; }

.drawer nav a, .drawer nav button { display: block; width: 100%; text-align: left; padding: 13px 12px; border-radius: 9px; font-size: 16px; color: var(--ink); text-decoration: none; }
.drawer nav a:hover { background: rgba(233,238,244,.06); }
.drawer nav a.on { background: rgba(155,144,248,.14); color: var(--cyan); }

/* answer options: radio inputs styled as the reference .opt buttons */
label.opt { position: relative; cursor: pointer; }
label.opt input { position: absolute; opacity: 0; pointer-events: none; }
label.opt:has(input:checked) { border-color: var(--cyan); background: rgba(155,144,248,.10); }
label.opt:has(input:focus-visible) { outline: 2px solid var(--indigo); outline-offset: 3px; }

.inp input[type="date"] { color-scheme: dark; }
.inp select.full { flex: 1; border-left: 0; background: none; color: var(--ink); font-size: 15px; padding: 13px 14px; }
.inp select.full option { background: #1E1470; color: var(--ink); }
.inp .unit { padding: 13px 12px; font-size: 13px; color: var(--muted); border-left: 1px solid var(--line); background: #1E1470; }
.field-validation-error, .msg.err { font-size: 13px; color: var(--amber); display: block; margin: -8px 0 16px; }
.field-validation-valid { display: none; }
.validation-summary-valid { display: none; }

.divider { display: flex; align-items: center; gap: 12px; color: var(--dim); font-size: 12.5px; margin: 20px 0; }
.divider::before, .divider::after { content: ""; flex: 1; height: 1px; background: var(--line); }
.gbtn { display: flex !important; align-items: center; justify-content: center; gap: 10px; }
.gbtn svg { width: 18px; height: 18px; flex: none; }

.why { margin-top: 18px; }
.why summary { list-style: none; cursor: pointer; }
.why summary::-webkit-details-marker { display: none; }
.why p { color: var(--muted); font-size: 14px; line-height: 1.6; margin: 12px 0 0; }

.tbl a.v.empty { text-decoration: none; }
.tbl a.r { color: inherit; text-decoration: none; }
.tbl a.r:hover .n { color: var(--cyan); }

.hist { font-size: 13px; color: var(--muted); }
.hist .r { display: flex; justify-content: space-between; gap: 12px; padding: 9px 0; border-bottom: 1px solid var(--line); }
.hist .r:last-child { border-bottom: 0; }
.hist b { color: var(--ink); font-weight: 500; }

form.plain { margin: 0; }
.pair form { flex: 1; }
.pair form .btn { width: 100%; }