main.wrapper { margin-top: 1rem; }
main h1 { font-size: 1.8rem; margin-bottom: 1rem; }
.table-scroll { overflow-x: auto; }
table.center { width: 100%; }
table th { text-align: center; }
table td { vertical-align: middle; }
.btn { white-space: normal; }
.toy-choice { display: block; margin: .4rem auto; }
.volunteer-form { max-width: 55rem; }
.activity { padding: 1rem 0; border-top: 1px solid #ddd; }
.activity input { max-width: 6rem; }
.field-error { color: #b21f2d; }
.form-actions { display: flex; gap: 1rem; margin: 1.5rem 0; }
.volunteer-activity { margin: 2rem 0; padding: 1.25rem; background: #f2f5f8; border: 1px solid #d9e1e8; border-radius: .5rem; }
.volunteer-activity .volunteer-person { background: #fff; }
@media (max-width: 575px) { .volunteer-activity { padding: .75rem; } }
.volunteer-activity h2 { font-size: 1.25rem; line-height: 1.5; }
.volunteer-person { border: 1px solid #ddd; border-radius: .25rem; padding: 1rem; margin: 1rem 0; }
.volunteer-person legend { float: left; width: 100%; padding: 0; margin-bottom: 1rem; font-size: 1rem; font-weight: 600; }
.volunteer-person > .row { clear: both; }
.volunteer-form .form-actions { flex-wrap: wrap; }

/* Clear, calm notices for unavailable data and completed needs. */
.needs-notice { margin: 1.25rem 0; padding: 1rem 1.25rem; border: 1px solid; border-left-width: 4px; border-radius: .35rem; line-height: 1.55; }
.needs-notice h2 { margin: 0 0 .35rem; font-size: 1.2rem; font-weight: 700; line-height: 1.35; }
.needs-notice p { margin: 0; }
.needs-notice--pending { color: #234d68; background: #eef6fb; border-color: #8bb8d2; }
.needs-notice--complete { color: #22583b; background: #edf7f0; border-color: #86b99a; }
.coat-filters,.coat-buyer-field,.coat-confirm-card,.coat-card,.coat-desktop-table,.coat-confirm-table { background:#f2f5f8; border:1px solid #aab8c4; border-radius:.5rem; box-shadow:0 2px 6px rgba(28,45,61,.12); }
.coat-filters,.coat-buyer-field,.coat-confirm-card { padding:1rem; margin:1rem 0; }
.coat-desktop-table,.coat-confirm-table { margin:1rem 0; }
.coat-desktop-table table,.coat-confirm-table table { margin:0; border:0; border-radius:0; box-shadow:none; background:#f2f5f8; color:#344454; text-shadow:none; }
.coat-desktop-table table th,.coat-confirm-table table th { background:#f2f5f8; border-top:0; border-bottom:1px solid #aab8c4; }
.coat-desktop-table table td,.coat-confirm-table table td { background:#fff; border-top:0; border-bottom:1px solid #c3cdd6; border-left:1px solid #c3cdd6; }
.coat-desktop-table table tbody tr:nth-child(odd) td,.coat-confirm-table table tbody tr:nth-child(odd) td { background:#fff; }
.coat-desktop-table table tbody tr:nth-child(even) td,.coat-confirm-table table tbody tr:nth-child(even) td { background:#e9eff4; }
.coat-desktop-table table tbody tr:hover td,.coat-confirm-table table tbody tr:hover td { background:#dfe9f1; }
.coat-filters h2,.coat-confirm-card h2 { font-size:1.3rem; margin:0 0 1rem; }
.coat-filter-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1rem; }
.coat-filter-grid label,.coat-buyer-field label { display:block; font-weight:600; min-width:0; }
.coat-filter-grid select,.coat-buyer-field input { display:block; width:100%; min-height:2.75rem; padding:.4rem .6rem; border:1px solid #767676; border-radius:.25rem; background:#fff; font-size:1rem; }
.coat-filter-actions { display:flex; flex-wrap:wrap; gap:.75rem; margin-top:1rem; }
.coat-buyer-field { max-width:36rem; }
.coat-buyer-field p { margin:.4rem 0 .75rem; }
.coat-delivery-note { max-width:44rem; line-height:1.5; }
.coat-results { font-weight:600; margin:1rem 0; }
.coat-card-list,.coat-show-more,.coat-confirm-card { display:none; }
@media (max-width:767px) {
  .coat-filter-grid { grid-template-columns:minmax(0,2fr) minmax(0,3fr); gap:.75rem; }
  .coat-filter-grid label:first-child,.coat-filter-grid label:last-child { grid-column:1/-1; }
  .coat-filters,.coat-buyer-field,.coat-confirm-card { padding:1rem; }
  .coat-filter-actions .btn,.coat-card .btn,.coat-show-more,.coat-shop-form .btn,.form-actions .btn { min-height:2.75rem; }
  .coat-card-list { display:block; }
  .coat-desktop-table,.coat-confirm-table { display:none; }
  .coat-card { padding:1rem; margin:0 0 .85rem; }
  .coat-card[hidden] { display:none; }
  .coat-card h2 { font-size:1.2rem; margin:0 0 .75rem; }
  .coat-card dl,.coat-confirm-card dl { margin:0 0 1rem; }
  .coat-card dl div,.coat-confirm-card dl div { display:flex; gap:.75rem; padding:.35rem 0; border-bottom:1px solid #9eafbd; }
  .coat-card dt,.coat-confirm-card dt { width:6rem; flex:none; }
  .coat-card dd,.coat-confirm-card dd { margin:0; overflow-wrap:anywhere; }
  .coat-card .btn { width:100%; font-size:1.05rem; }
  .coat-show-more:not([hidden]),.coat-confirm-card { display:block; }
  .coat-show-more { width:100%; margin:.5rem 0 1.5rem; }
  .form-actions { flex-wrap:wrap; }
}