/* Contact details are a single readable list; board tools retain their gold colour. */
.kadra-site .contact-page .contact-body { max-width: 52rem; }
.kadra-site .contact-page .board-contact { max-width: none; margin: 2rem 0; padding: 1.75rem 2rem; background: var(--paper-bright); border: 1px solid var(--line); border-top: 3px solid var(--accent); }
.contact-board-heading { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 1rem; padding-bottom: 1.5rem; }
.kadra-site .contact-board-heading h2 { margin: 0; font-size: 1.4rem; }
.kadra-site .contact-board-heading .contact-edit-link { font-size: .88rem; padding: .65rem 1rem; text-align: center; white-space: normal; }
.kadra-site .contact-page .board-contact .board-list { display: block; margin: 0; }
.kadra-site .contact-page .board-list > .board-member { padding: 1.35rem 0; border: 0; border-top: 1px solid var(--line); }
.kadra-site .contact-page .board-list > .board-member:last-child { padding-bottom: 0; }
.kadra-site .contact-page .board-list dt { margin: 0 0 .3rem; font-size: .88rem; color: var(--ink-soft); }
.kadra-site .contact-page .board-list dd { margin: 0; }
.board-member-name { display: block; color: var(--ink); font-size: 1.18rem; font-weight: 650; }
.board-member-contacts { display: flex; flex-wrap: wrap; gap: .25rem 1.6rem; margin-top: .45rem; }
.kadra-site .contact-page .board-member-contacts a { display: inline-block; margin: 0; color: var(--ink); font-size: .95rem; font-weight: 500; overflow-wrap: anywhere; }
.kadra-site .contact-page .board-vacancy { color: var(--ink-soft); font-size: .97rem; font-weight: 400; }
.contact-details { margin-top: 2.5rem; }
.kadra-site .contact-details h2 { margin: 0; font-size: 1.4rem; }
.contact-details .public-contact-list { margin-top: .75rem; }

/* The same portal form edits both the board and the union's public details. */
.kadra-site .contact-editor-page { max-width: 58rem; }
.contact-editor-form { margin-top: 2rem; padding: 1.75rem 2rem; border: 1px solid var(--line); border-top: 4px solid #d2aa47; border-radius: 5px; background: var(--paper-bright); }
.kadra-site .contact-editor-section h2 { margin: 0 0 .65rem; font-size: 1.45rem; }
.contact-form-note { margin: 0 0 1.5rem; color: var(--ink-soft); font-size: .95rem; }
.contact-member-fields { min-width: 0; margin: 1.7rem 0 0; padding: 1.15rem 1.25rem 1.25rem; border: 1px solid var(--line); border-radius: 4px; }
.contact-member-fields legend { padding: 0 .5rem; color: var(--ink); font-size: 1.05rem; font-weight: 650; }
.contact-fields-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.2rem; }
.contact-field-name { grid-column: 1 / -1; }
.contact-field { min-width: 0; }
.contact-field label { display: block; margin-bottom: .35rem; color: var(--ink); font-size: .92rem; font-weight: 600; }
.contact-required { font-size: .82rem; font-weight: 400; color: var(--ink-soft); }
.kadra-site .contact-editor-form .contact-field input, .kadra-site .contact-editor-form .contact-field textarea { box-sizing: border-box; width: 100%; max-width: 100%; padding: .7rem .8rem; border: 1px solid #94a8b8; border-radius: 4px; background: var(--paper-bright); color: var(--ink); font: inherit; line-height: 1.45; }
.contact-field textarea { resize: vertical; }
.contact-field-help { margin: .4rem 0 0; color: var(--ink-soft); font-size: .82rem; }
.contact-field-errors, .contact-error-summary { color: #9a2432; font-size: .9rem; }
.contact-field-errors .errorlist { margin: .4rem 0 0; padding-left: 1.25rem; }
.kadra-site .contact-editor-form .contact-field-error input, .kadra-site .contact-editor-form .contact-field-error textarea { border-color: #ae3541; }
.contact-form-errors { margin: 0 0 1.5rem; padding: 1rem 1.25rem; border: 1px solid #c46d76; border-radius: 4px; background: #fff0f1; color: #782029; }
.contact-form-errors p { margin: 0 0 .4rem; font-weight: 600; }
.contact-form-errors .errorlist { margin: 0; padding-left: 1.25rem; }
.contact-official-fields { margin-top: 2.5rem; padding-top: 2rem; border-top: 1px solid var(--line); }
.contact-form-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 1rem 1.5rem; margin-top: 2rem; padding-top: 1.5rem; border-top: 1px solid var(--line); }
.contact-form-actions .button { padding: .7rem 1.25rem; }
.contact-form-actions p { flex-basis: 100%; margin: 0; color: var(--ink-soft); font-size: .85rem; }
html[data-theme="dark"] .kadra-site .contact-page .board-contact { border-top-color: var(--accent); }
html[data-theme="dark"] .kadra-site .contact-editor-form .contact-field input,
html[data-theme="dark"] .kadra-site .contact-editor-form .contact-field textarea { background: var(--theme-field); border-color: var(--theme-control-line); }
html[data-theme="dark"] .contact-field-errors,
html[data-theme="dark"] .contact-error-summary { color: var(--danger); }
html[data-theme="dark"] .kadra-site .contact-editor-form .contact-field-error input,
html[data-theme="dark"] .kadra-site .contact-editor-form .contact-field-error textarea { border-color: var(--danger); }
html[data-theme="dark"] .contact-form-errors { color: var(--danger); background: var(--danger-soft); border-color: var(--accent); }
@media (max-width: 45rem) {
  .kadra-site .contact-page .board-contact { padding: 1.25rem; }
  .contact-board-heading { align-items: flex-start; padding-bottom: 1.25rem; }
  .board-member-contacts { flex-direction: column; gap: .4rem; }
  .contact-editor-form { padding: 1.25rem; }
  .contact-member-fields { padding: 1rem; }
  .contact-fields-grid { grid-template-columns: minmax(0, 1fr); }
}