/* ============================================================
   Wolvex — Form fields (contact, sign-in, account)
   Big touch targets and clear labels for elderly visitors.
   ============================================================ */
.form-card{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius-m);padding:28px;}
.form-field{margin-bottom:18px;}
.form-field label{display:block;font-weight:700;margin-bottom:6px;color:var(--ink);}
.form-field .hint{display:block;font-weight:500;font-size:.85em;color:var(--slate);margin-bottom:6px;}
.form-input,
.form-select,
.form-textarea{width:100%;border:2px solid var(--line);border-radius:var(--radius-s);padding:12px 14px;font-size:1em;font-family:inherit;background:var(--paper);color:var(--ink-deep);min-height:52px;}
.form-textarea{min-height:150px;resize:vertical;}
.form-input:focus,
.form-select:focus,
.form-textarea:focus{outline:3px solid var(--focus);outline-offset:1px;border-color:var(--ink);}
.field-error{color:var(--red-deep);font-weight:600;font-size:.9em;margin-top:6px;display:block;}

/* Large single-code input for OTP entry */
.otp-input{font-size:2em;letter-spacing:.45em;text-align:center;font-weight:800;min-height:72px;}

/* Honeypot — hidden from humans, present for bots */
.hp-field{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden;}

.checkbox-row{display:flex;align-items:center;gap:10px;font-weight:600;}
.checkbox-row input{width:22px;height:22px;accent-color:var(--red);}

/* ---- Generic form primitives used by account/auth/admin/contact pages ---- */
.form-group{display:flex;flex-direction:column;gap:var(--space-2);margin-bottom:var(--space-5);}
.form-group label{font-size:var(--fs-base);font-weight:700;color:var(--ink);}
.form-hint{font-size:var(--fs-sm);color:var(--slate);}
.form-control{width:100%;padding:var(--space-3) var(--space-4);min-height:var(--touch-target);border:2px solid var(--line);border-radius:var(--radius-md);font-size:var(--fs-base);font-family:var(--font-body);color:var(--ink-deep);background:var(--paper);transition:border-color .15s ease, box-shadow .15s ease;}
.form-control::placeholder{color:var(--slate);}
.form-control:focus{outline:none;border-color:var(--focus);box-shadow:0 0 0 3px rgba(77,163,255,.25);}
.form-control.is-invalid{border-color:var(--color-danger);}
.invalid-feedback{font-size:var(--fs-sm);font-weight:700;color:var(--color-danger);}
textarea.form-control{min-height:8rem;resize:vertical;}
select.form-control{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23253455' stroke-width='3' stroke-linecap='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right var(--space-3) center;padding-right:var(--space-8);}

.form-check{display:flex;align-items:flex-start;gap:var(--space-3);min-height:var(--touch-target);padding:var(--space-2) 0;}
.form-check input[type="checkbox"],
.form-check input[type="radio"]{width:1.5rem;height:1.5rem;margin-top:.15rem;accent-color:var(--ink);flex-shrink:0;}
.form-check label{font-weight:400;}

.inline-search{display:flex;max-width:34rem;margin:0 auto;border-radius:var(--radius-md);overflow:hidden;border:2px solid var(--line);background:var(--paper);}
.inline-search:focus-within{border-color:var(--focus);}
.inline-search input{flex:1;min-width:0;border:none;padding:var(--space-3) var(--space-4);font-size:var(--fs-base);}
.inline-search input:focus{outline:none;}
.inline-search button{background:var(--red);color:#fff;padding:0 var(--space-5);min-width:var(--touch-target);font-weight:700;display:flex;align-items:center;justify-content:center;}
.inline-search button:hover{background:var(--red-deep);}