/* Public communications forms (contact + recruiting).
   Aligned to the current site design language (see the intranet voting pages):
   a light background, sentence-case headings, soft rounded white cards, and the
   site's uniform orange primary button. Scoped here so shared CSS is untouched. */

/* Light hero: sentence-case headings (override the global uppercase) and dark,
   readable body text on the light section. */
.comms-page { color: var(--color-text-body); }
.comms-page h1 {
  text-transform: none;
  letter-spacing: 0;
  color: var(--color-accent);
  font-size: 2rem;
  line-height: 1.15;
}
.comms-page > .container > p { color: #4a4744; }

/* Card */
.comms-card {
  background: #fff;
  color: var(--color-text-body);
  border: 1px solid #e3e7ec;
  border-radius: 12px;
  box-shadow: 0 2px 12px rgba(15, 23, 42, 0.08);
  padding: 30px 32px;
  margin: 0 0 8px;
}
.comms-card h2 {
  margin: 0 0 6px;
  font-size: 1.4rem;
  text-transform: none;
  letter-spacing: 0;
  color: var(--color-text-body);
}
.comms-card .comms-card-sub {
  margin: 0 0 22px;
  color: #5f6f82;
  font-size: 0.95rem;
  line-height: 1.55;
}

/* Inputs: scoped to the comms forms so the rest of the site is untouched. */
.comms-card .form-group label { font-weight: 700; color: #374151; }
.comms-card .form-group input,
.comms-card .form-group textarea,
.comms-card .form-group select {
  border: 1px solid #cfd6df;
  border-radius: 10px;
  transition: border-color 0.18s ease, box-shadow 0.18s ease;
}
.comms-card .form-group input:focus,
.comms-card .form-group textarea:focus,
.comms-card .form-group select:focus {
  outline: none;
  border-color: var(--color-accent);
  box-shadow: 0 0 0 3px rgba(224, 90, 26, 0.14);
}

/* Uniform orange primary button (matches .vd-primary-btn / .vote-submit-btn). */
.comms-btn {
  display: inline-block;
  border: none;
  border-radius: 10px;
  padding: 13px 26px;
  min-height: 46px;
  background: var(--color-accent);
  color: #fff;
  font-weight: 700;
  font-size: 15px;
  font-family: var(--font-body);
  letter-spacing: 0;
  text-transform: none;
  cursor: pointer;
  box-shadow: 0 8px 18px rgba(224, 90, 26, 0.18);
  transition: background 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
}
.comms-btn:hover { background: #c94f16; box-shadow: 0 10px 22px rgba(224, 90, 26, 0.24); }
.comms-btn:active { transform: translateY(1px); }
.comms-btn:disabled { opacity: 0.6; cursor: default; box-shadow: none; }

/* Secondary (light) button, if a page needs one. */
.comms-btn-outline { background: #fff7ed; color: #9a3412; box-shadow: none; }
.comms-btn-outline:hover { background: #fed7aa; color: #7c2d12; }

/* Intent picker: radio cards. */
.comms-intent {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  margin: 0 0 20px;
}
.comms-intent label {
  display: block;
  border: 1px solid #cfd6df;
  border-radius: 10px;
  padding: 14px 16px;
  cursor: pointer;
  font-size: 14px;
  font-weight: 600;
  color: var(--color-text-body);
  background: #fff;
  transition: border-color 0.18s ease, box-shadow 0.18s ease;
}
.comms-intent input { position: absolute; opacity: 0; pointer-events: none; }
.comms-intent label:hover { border-color: var(--color-accent); }
.comms-intent label:has(input:checked) {
  border-color: var(--color-accent);
  box-shadow: 0 0 0 2px rgba(224, 90, 26, 0.18);
}

/* Inline notice (billing / patient interstitials). */
.comms-notice {
  border-radius: 10px;
  padding: 16px 18px;
  margin: 0 0 20px;
  font-size: 14px;
  line-height: 1.6;
  border: 1px solid #d7e2ec;
  border-left: 4px solid var(--color-primary);
  background: #f4f8fb;
  color: #243047;
}
.comms-notice.comms-notice-warn {
  border-color: #fed7aa;
  border-left-color: var(--color-accent);
  background: #fff7ed;
  color: #7c2d12;
}
.comms-notice a { color: var(--color-primary); font-weight: 600; }
.comms-notice strong { color: inherit; }
.comms-hidden { display: none; }

/* Upload intro + drag-and-drop zones (recruiting). */
.comms-uploads-intro {
  margin: 0 0 20px;
  font-size: 0.95rem;
  line-height: 1.55;
  color: #5f6f82;
}
.comms-dropzone {
  border: 2px dashed #c4ccd6;
  border-radius: 12px;
  padding: 22px 18px;
  text-align: center;
  cursor: pointer;
  background: #fbfcfd;
  transition: border-color 0.18s ease, background 0.18s ease;
}
.comms-dropzone:hover { border-color: var(--color-accent); }
.comms-dropzone.comms-dz-over { border-color: var(--color-accent); background: #fff7ed; }
.comms-file-input { display: none; }
.comms-dz-label { margin: 0; font-size: 14px; color: #5f6f82; }
.comms-dz-browse { color: var(--color-accent); font-weight: 700; text-decoration: underline; }
.comms-dz-file { margin: 8px 0 0; font-size: 13px; font-weight: 600; color: var(--color-text-body); }

/* Honeypot: visually and programmatically hidden, off-screen. */
.comms-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

.comms-status { margin: 16px 0 0; font-size: 14px; font-weight: 700; }
.comms-status.ok { color: #027a48; }
.comms-status.err { color: #b42318; }

.cf-turnstile { margin: 4px 0 18px; }

@media (max-width: 640px) {
  .comms-intent { grid-template-columns: 1fr; }
  .comms-card { padding: 24px 20px; }
}