/* Turn the whole widget into a simple 2-row grid */
.frc-captcha {
  display: grid;
  grid-template-columns: auto 1fr;  /* icon | text column */
  grid-template-rows: auto auto;    /* row 1: icon+text, row 2: banner */
  column-gap: 0.4rem;
  align-items: start;
  margin: 12px 0 !important;
  transform-origin: left center;
  background: none;
  border: 0 !important;
  padding: 0;
  position: static !important;
}
.frc-captcha * {
  position: static !important;
  margin: 0;
}
/* Let FriendlyCaptcha's internal wrapper disappear into the grid */
.frc-captcha .frc-container {
  display: contents;
  width: auto;
}
/* --- ICON --- */
/* Put icon in the first row only */
.frc-captcha .frc-icon {
  grid-column: 1;
  grid-row: 1;
  width: 18px !important;
  height: 18px !important;
  margin: 0;
  margin-top: 2px;
}
/* --- TEXT (frc-content → contains frc-text) --- */
.frc-captcha .frc-content {
  grid-column: 2;
  grid-row: 1;          /* same row as icon */
  overflow-x: visible !important;
  white-space: normal !important;
  word-break: break-word;   /* Safely wraps long unbroken strings */
  max-width: 100% !important;
}
/* Button that appears sometimes should left align */
.frc-captcha .frc-content button {
  text-align: left !important;
  font-size: 0.65rem !important
}

/* --- BANNER (FriendlyCaptcha branding) --- */
.frc-captcha .frc-banner {
  grid-column: 2;
  grid-row: 2;          /* directly under the text */
  margin-top: 2px;
  font-size: 0.6rem !important;
  align-self: start;
}
/* --- Float right on larger screens --- */
/*@media screen and (min-width: 768px) {*/
  .wpforms-container-full .frc-captcha,
  .wppb-user-forms .frc-captcha,
  .clk-captcha.frc-captcha {
    float: right !important;
    margin: 0 !important;
    max-width: 180px; /* this may cause issues */
    min-width: 180px; /* this may cause issues */
  }
/*}*/


/* --- Replace built-in text with custom text --- */

/* Hide the original text visually but keep it in the DOM for a11y */
.frc-captcha .frc-text {
  position: relative;
  font-size: 0;        /* hide original text size */
  line-height: 0;    /* hide original line height */
  color: transparent;  /* hide original color */
}

.frc-captcha .frc-container .frc-text::before {
  font-size: 0.7rem;
  line-height: 1.2;
  color: #000000;
}

/* Default text (before success) */
.frc-captcha .frc-container:not(.frc-success):not(.frc-error) .frc-text::before {
  content: "Spam check in progress…";
}

/* Text when the widget is in success state */
.frc-captcha .frc-container.frc-success .frc-text::before {
  content: "Spam check successful";
}

/* Text when the widget is in success state */
.frc-captcha .frc-container.frc-error .frc-text::before {
  content: "Spam check failed. Please try again.";
}