/**
 * Poll component overrides — loaded last so it wins over style.min.css.
 */

/* Center the filled inner circle of a selected radio button. */
.form-check .form-check__group .form-check__item input[type=radio]:after,
.form-check.theme--dark .form-check__group .form-check__item input[type=radio]:after {
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

/* "Previous Polls Results" secondary action: underline the text only,
   not the trailing arrow icon. The submit input theme renders the value
   as a text node followed by an <i> icon, so we underline the button and
   stop the line at the icon by making it inline-block + no decoration. */
.govbh-polls .form-actions [id^="edit-result"] {
  text-decoration: underline;
  text-underline-offset: 3px;
}
.govbh-polls .form-actions [id^="edit-result"] i,
.govbh-polls .form-actions [id^="edit-result"] .ph {
  display: inline-block;
  text-decoration: none;
}

/* Inline text input for the "Other" poll option, shown via JS. */
.govbh-poll-form .poll-other-input {
  margin-top: 8px;
  margin-inline-start: 30px;
  display: none;
}
.govbh-poll-form .poll-other-input.is-visible {
  display: block;
}
.govbh-poll-form .poll-other-input input[type=text] {
  width: 100%;
  max-width: 360px;
  padding: 8px 12px;
  border-radius: var(--bh-border-radius-xs, 4px);
  border: 1px solid var(--bh-border-primary, #ccc);
  background: var(--bh-bg-primary, #fff);
  color: var(--bh-secondary, #333);
  font-size: var(--bh-fs-p-m, 16px);
}

/* Brief highlight when "View Poll Results" scrolls the user back to results. */
.govbh-poll-form--highlight {
  animation: govbh-poll-flash 1.5s ease-out;
}
@keyframes govbh-poll-flash {
  0%   { box-shadow: 0 0 0 4px rgba(255, 255, 255, 0); }
  20%  { box-shadow: 0 0 0 4px rgba(255, 255, 255, .55); }
  100% { box-shadow: 0 0 0 4px rgba(255, 255, 255, 0); }
}