/* Phase 3 opt-in fields. Existing theme tokens; no global form restyle.
   Callers keep validation rules, submission handlers and server authority. */
.ep-forms-v3 .ep-field { gap: 8px; min-width: 0; }
.ep-forms-v3 .ep-label { font-size: 13px; line-height: 1.7; }
.ep-forms-v3 .ep-hint { font-size: 12px; color: var(--ep-ink-3); line-height: 1.8; margin: 0; }
.ep-forms-v3 :is(.ep-input,.ep-select,.ep-textarea) {
  box-sizing: border-box; min-height: 48px; width: 100%; min-width: 0;
  border-radius: 10px; padding: 12px 14px; font: inherit; font-size: 14px;
  color: var(--ep-ink); background-color: var(--ep-inset);
  border: 1px solid var(--ep-border-2); box-shadow: none;
  transition: border-color 150ms ease, box-shadow 150ms ease;
}
.ep-forms-v3 :is(.ep-input,.ep-textarea)::placeholder { color: var(--ep-ink-3); opacity: 1; }
.ep-forms-v3 :is(.ep-input,.ep-select,.ep-textarea):focus {
  border-color: var(--ep-accent); outline: 2px solid var(--ep-accent);
  outline-offset: 2px; box-shadow: none;
}
.ep-forms-v3 :is(.ep-input,.ep-select,.ep-textarea)[aria-invalid="true"] { border-color: var(--ep-bad); }
.ep-forms-v3 :is(.ep-input,.ep-select,.ep-textarea)[aria-invalid="true"]:focus { outline-color: var(--ep-bad); }
.ep-forms-v3 .ep-field[data-field-state="success"] :is(.ep-input,.ep-select,.ep-textarea) { border-color: var(--ep-ok); }
.ep-forms-v3 :is(.ep-input,.ep-select,.ep-textarea):disabled { opacity: .55; cursor: not-allowed; box-shadow: none; }
.ep-forms-v3 :is(.ep-input,.ep-textarea)[readonly] { color: var(--ep-ink-3); background: var(--ep-surface); }
.ep-forms-v3 .ep-textarea { min-height: 112px; resize: vertical; line-height: 1.9; }
.ep-forms-v3 .ep-select { padding-inline-end: 40px; padding-inline-start: 14px; background-position: left 14px center; }
.ep-forms-v3 .ep-select:dir(ltr) { background-position: right 14px center; }
.ep-forms-v3 .ep-control { position: relative; min-width: 0; }
/* Icon placement follows its wrapper, even when the value itself is LTR. */
.ep-forms-v3 .ep-input-icon:dir(rtl) > .ep-input { padding-right: 40px; }
.ep-forms-v3 .ep-input-icon:dir(ltr) > .ep-input { padding-left: 40px; }
.ep-forms-v3 .ep-control:has([data-ep-password-toggle]) .ep-input { padding-left: 56px; }
.ep-forms-v3 [data-ep-password-toggle] {
  position: absolute; left: 2px; top: 2px; width: 44px; height: 44px;
  display: grid; place-items: center; border-radius: 8px; padding: 0;
  background: transparent; color: var(--ep-ink-3); border: 0; cursor: pointer;
}
.ep-forms-v3 [data-ep-password-toggle] svg { width: 20px; height: 20px; }
.ep-forms-v3 [data-ep-password-toggle]:focus-visible { outline: 2px solid var(--ep-accent); outline-offset: 1px; }
.ep-forms-v3 [data-ep-password-toggle]:disabled { cursor: not-allowed; opacity: .5; }
.ep-forms-v3 [data-ep-password-toggle] .eye-hide,
.ep-forms-v3 [data-ep-password-toggle][aria-pressed="true"] .eye-show { display: none; }
.ep-forms-v3 [data-ep-password-toggle][aria-pressed="true"] .eye-hide { display: block; }
.ep-forms-v3 [data-field-message] { margin: 0; font-size: 12px; line-height: 1.8; overflow-wrap: anywhere; }
.ep-forms-v3 [data-field-message][hidden] { display: none; }
.ep-forms-v3 [data-field-state="error"] [data-field-message] { color: var(--ep-bad); }
.ep-forms-v3 [data-field-state="success"] [data-field-message] { color: color-mix(in srgb, var(--ep-ok) 85%, var(--ep-ink)); }
.ep-forms-v3 .ep-form-feedback { padding: 14px 16px; border-radius: 10px; border: 1px solid var(--ep-border-2); background: var(--ep-surface); font-size: 13px; line-height: 1.9; }
.ep-forms-v3 .ep-form-feedback[hidden] { display: none; }
.ep-forms-v3 .ep-form-feedback[data-tone="success"] { border-color: var(--ep-ok); color: color-mix(in srgb, var(--ep-ok) 85%, var(--ep-ink)); }
.ep-forms-v3 .ep-form-feedback[data-tone="error"] { border-color: var(--ep-bad); color: var(--ep-bad); }
@media (hover: hover) and (pointer: fine) {
  .ep-forms-v3 [data-ep-password-toggle]:hover { background: var(--ep-surface-2); color: var(--ep-ink); }
}
@media (max-width: 640px) {
  .ep-forms-v3 :is(.ep-input,.ep-select,.ep-textarea) { font-size: 16px; }
}
@media (prefers-reduced-motion: reduce) {
  .ep-forms-v3 :is(.ep-input,.ep-select,.ep-textarea) { transition: none; }
}