/* TVT-372/374: member tasks and the public support journey. Role workspaces stay scoped out. */
.vt-page.vt-member-account-page,
.vt-page.narrow.vt-help-page {
  --ink: var(--wt-text);
  --ink-2: var(--wt-text-muted);
  --ink-3: var(--wt-text-muted);
  --paper: var(--wt-surface);
  --ivory: var(--wt-surface);
  --ivory-2: var(--wt-surface-soft);
  --hair: var(--wt-border);
  --hair-2: var(--wt-field-border);
  width: 100%;
  max-width: 800px;
  margin-inline: auto;
  padding: var(--wt-space-40) var(--wt-space-32) var(--wt-space-56);
  background: var(--wt-canvas);
  color: var(--wt-text);
  font: 400 16px/1.6 var(--wt-font-body);
}

:is(.vt-member-account-page, .vt-help-page) .vt-page-header {
  display: grid;
  gap: var(--wt-space-16);
  margin: 0 0 var(--wt-space-32);
}
:is(.vt-member-account-page, .vt-help-page) .vt-page-header h1 {
  margin: 0;
  color: var(--wt-text);
  font: 500 28px/1.25 var(--wt-font-body);
  letter-spacing: normal;
}
:is(.vt-member-account-page, .vt-help-page) h2,
:is(.vt-member-account-page, .vt-help-page) .vt-section-head h2 {
  margin: 0;
  color: var(--wt-text);
  font: 500 20px/1.4 var(--wt-font-body);
  letter-spacing: normal;
}
:is(.vt-member-account-page, .vt-help-page) h3 {
  margin: 0;
  color: var(--wt-text);
  font: 500 17px/1.4 var(--wt-font-body);
  overflow-wrap: anywhere;
}
:is(.vt-member-account-page, .vt-help-page) p {
  color: var(--wt-text-muted);
  line-height: 1.6;
  overflow-wrap: anywhere;
}
:is(.vt-member-account-page, .vt-help-page) .vt-page-header p { margin: var(--wt-space-12) 0 0; }
:is(.vt-member-account-page, .vt-help-page) .vt-eyebrow {
  color: var(--wt-text-muted);
  font: 400 13px/1.5 var(--wt-font-body);
  letter-spacing: normal;
  text-transform: none;
}
:is(.vt-member-account-page, .vt-help-page) label .vt-eyebrow {
  color: var(--wt-text);
  font-size: 14px;
}
.vt-member-account-page .vt-profile-actions { justify-content: flex-start; gap: var(--wt-space-8); }
.vt-member-account-page .vt-profile-grid,
.vt-member-account-page .vt-account-security-grid,
.vt-member-account-page .vt-account-data-grid {
  grid-template-columns: minmax(0, 1fr);
  gap: var(--wt-space-32);
  max-width: none;
  margin: 0;
}
.vt-member-account-page .vt-profile-panel,
.vt-help-page .vt-help-card {
  min-width: 0;
  gap: var(--wt-space-16);
  padding: 0;
  border: 0;
  border-radius: 0;
  background: var(--wt-surface);
  box-shadow: none;
}
.vt-member-account-page .vt-profile-grid > .vt-profile-panel + .vt-profile-panel,
.vt-member-account-page .vt-account-help {
  padding-top: var(--wt-space-24);
  border-top: 1px solid var(--wt-border);
}
.vt-member-account-page .vt-account-help { margin-top: var(--wt-space-32); }
.vt-member-account-page .vt-account-security-form,
.vt-member-account-page .vt-account-data-action {
  min-width: 0;
  padding: 0;
  gap: var(--wt-space-16);
  border: 0;
  border-radius: 0;
  background: var(--wt-surface);
}
.vt-member-account-page .vt-account-security-form + .vt-account-security-form,
.vt-member-account-page .vt-account-data-action + .vt-account-data-action {
  padding-top: var(--wt-space-24);
  border-top: 1px solid var(--wt-border);
}
.vt-member-account-page .vt-account-security-grid { gap: 0; }
.vt-member-account-page .vt-account-security-grid details { padding-block: var(--wt-space-8); border-bottom: 1px solid var(--wt-border); }
.vt-member-account-page .vt-account-security-grid summary { min-height: var(--wt-control-min-height); padding-block: var(--wt-space-8); color: var(--wt-text); font-weight: 500; cursor: pointer; }
.vt-member-account-page .vt-account-security-grid details[open] .vt-account-security-form { padding: var(--wt-space-16) 0 var(--wt-space-24); }
.vt-member-account-page .vt-account-current-email { color: var(--wt-text); margin-top: var(--wt-space-8); }
.vt-member-account-page .vt-profile-identity { max-width: 100%; }
.vt-member-account-page .vt-profile-shortlist { padding: 0 0 var(--wt-space-32); margin: 0 0 var(--wt-space-32); border-bottom: 1px solid var(--wt-border); }
.vt-member-account-page .vt-section-head { gap: var(--wt-space-16); align-items: center; margin-bottom: var(--wt-space-16); }
.vt-member-account-page .vt-section-head .vt-eyebrow { display: none; }
.vt-member-account-page .vt-venue-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--wt-space-16); }
.vt-member-account-page .vt-venue-card { min-width: 0; border: 1px solid var(--wt-border); border-radius: var(--wt-radius-control); box-shadow: none; background: var(--wt-surface); overflow: visible; }
.vt-member-account-page .vt-venue-card:hover { transform: none; box-shadow: none; }
.vt-member-account-page .vt-venue-card .vt-img { height: 144px; border-radius: var(--wt-radius-control) var(--wt-radius-control) 0 0; }
.vt-member-account-page .vt-venue-card-body { min-height: 0; padding: var(--wt-space-16); gap: var(--wt-space-12); }
.vt-member-account-page .vt-venue-card-body p { font-size: 15px; }
.vt-member-account-page .vt-contribution-history-list { gap: 0; }
.vt-member-account-page .vt-contribution-history-card { gap: var(--wt-space-12); padding: var(--wt-space-24) 0; border: 0; border-radius: 0; background: var(--wt-surface); }
.vt-member-account-page .vt-contribution-history-card + .vt-contribution-history-card { border-top: 1px solid var(--wt-border); }
.vt-member-account-page .vt-contribution-history-card:first-child { padding-top: 0; }
.vt-member-account-page .vt-contribution-history-card:last-child { padding-bottom: 0; }
.vt-member-account-page .vt-contribution-status { font: 400 13px/1.5 var(--wt-font-body); letter-spacing: normal; text-transform: none; border-color: var(--wt-border); }
.vt-member-account-page .vt-contribution-history-body { color: var(--wt-text); }
.vt-member-account-page .vt-contribution-history-head p { font-size: 13px; }
.vt-member-account-page .vt-contribution-venue-link { color: var(--wt-action); font-weight: 500; text-decoration-color: currentColor; }
.vt-member-account-page .vt-contribution-venue-link:hover { color: var(--wt-action-hover); }
.vt-member-account-page .vt-contribution-lifecycle-form { min-width: 0; }
.vt-member-account-page .vt-empty { padding: var(--wt-space-16) 0; border: 0; background: transparent; font-size: 15px; }

:is(.vt-member-account-page, .vt-help-page) :is(input:not([type='checkbox']), textarea, select) {
  width: 100%;
  min-width: 0;
  min-height: var(--wt-control-min-height);
  padding: var(--wt-space-12);
  border: 1px solid var(--wt-field-border);
  border-radius: var(--wt-radius-control);
  background: var(--wt-surface);
  color: var(--wt-text);
  font: 400 16px/1.6 var(--wt-font-body);
}
:is(.vt-member-account-page, .vt-help-page) input::placeholder,
:is(.vt-member-account-page, .vt-help-page) textarea::placeholder { color: var(--wt-text-muted); opacity: 1; }
:is(.vt-member-account-page, .vt-help-page) label { min-width: 0; }
:is(.vt-member-account-page, .vt-help-page) label:has(input[type='checkbox']) { min-height: var(--wt-control-min-height); align-items: center; }
:is(.vt-member-account-page, .vt-help-page) input[type='checkbox'] { width: 18px; height: 18px; accent-color: var(--wt-action); flex: 0 0 auto; }
:is(.vt-member-account-page, .vt-help-page) .vt-form-note {
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--wt-text-muted);
  font-size: 14px;
}
:is(.vt-member-account-page, .vt-help-page) .vt-field-hint { color: var(--wt-text-muted); font-size: 13px; }
:is(.vt-member-account-page, .vt-help-page) [role='alert'] { color: var(--wt-error); }
:is(.vt-member-account-page, .vt-help-page) p[role='alert'] { padding: var(--wt-space-12); border-left: 3px solid var(--wt-error); background: var(--wt-error-surface); }
:is(.vt-member-account-page, .vt-help-page) .vt-btn {
  justify-self: start;
  min-height: var(--wt-control-min-height);
  max-width: 100%;
  padding: var(--wt-space-12) var(--wt-space-16);
  border: 1px solid var(--wt-action);
  border-radius: var(--wt-radius-control);
  background: var(--wt-action);
  color: var(--wt-on-action);
  font: 500 14px/1.4 var(--wt-font-body);
  text-align: center;
  letter-spacing: normal;
  white-space: normal;
  transition: background-color var(--wt-motion-fast), border-color var(--wt-motion-fast);
}
:is(.vt-member-account-page, .vt-help-page) .vt-btn:hover { transform: none; background: var(--wt-action-hover); border-color: var(--wt-action-hover); }
:is(.vt-member-account-page, .vt-help-page) .vt-btn.outline,
:is(.vt-member-account-page, .vt-help-page) .vt-btn.ghost { background: var(--wt-surface); color: var(--wt-action); border-color: var(--wt-field-border); }
:is(.vt-member-account-page, .vt-help-page) .vt-btn.ghost { border-color: transparent; }
:is(.vt-member-account-page, .vt-help-page) .vt-btn.outline:hover,
:is(.vt-member-account-page, .vt-help-page) .vt-btn.ghost:hover { background: var(--wt-surface-soft); }
:is(.vt-member-account-page, .vt-help-page) .vt-btn.danger { color: var(--wt-error); background: var(--wt-surface); border-color: var(--wt-error); }
.vt-member-account-page .vt-link-button.inline,
.vt-member-account-page .vt-save-button {
  min-height: var(--wt-control-min-height);
  color: var(--wt-action);
  font: 500 14px/1.4 var(--wt-font-body);
  white-space: normal;
}
.vt-member-account-page .vt-save-button { min-width: 44px; border-color: var(--wt-field-border); border-radius: var(--wt-radius-control); background: var(--wt-surface); }
:is(.vt-member-account-page, .vt-help-page) :is(button, a, input, textarea, select, summary, [tabindex]):focus-visible {
  outline: var(--wt-focus-width) solid var(--wt-focus);
  outline-offset: var(--wt-focus-offset);
}
.vt-help-page .vt-help-intro { grid-template-columns: minmax(0, 1fr); gap: var(--wt-space-16); padding-bottom: var(--wt-space-24); }
.vt-help-page .vt-support-form { gap: var(--wt-space-16); padding-top: var(--wt-space-24); }
.vt-help-page .vt-help-intro p { margin: var(--wt-space-8) 0 0; }
.vt-help-page .vt-support-confirm-row { font-size: 14px; }

@media (max-width: 480px) {
  .vt-page.vt-member-account-page, .vt-page.narrow.vt-help-page { padding: var(--wt-space-24) var(--wt-space-16) var(--wt-space-40); }
  :is(.vt-member-account-page, .vt-help-page) .vt-page-header h1 { font-size: 24px; }
  .vt-member-account-page .vt-venue-grid { grid-template-columns: minmax(0, 1fr); }
  .vt-member-account-page .vt-section-head { align-items: flex-start; }
  .vt-member-account-page .vt-profile-actions { gap: var(--wt-space-4); }
}
@media (prefers-reduced-motion: reduce) {
  :is(.vt-member-account-page, .vt-help-page) .vt-btn,
  :is(.vt-member-account-page, .vt-help-page) *,
  :is(.vt-member-account-page, .vt-help-page) *::before,
  :is(.vt-member-account-page, .vt-help-page) *::after { transition: none; animation: none; scroll-behavior: auto; }
}
