.faran-captcha {
  --frnc-border: #d7dce4;
  --frnc-text: #172033;
  direction: rtl;
  display: block;
  box-sizing: border-box;
  width: 100%;
  max-width: 360px;
  margin: 16px 0;
  color: var(--frnc-text);
  font-family: inherit;
}

.faran-captcha *, .faran-captcha *::before, .faran-captcha *::after { box-sizing: border-box; }
.faran-captcha__label { display: block; margin: 0 0 7px; font-size: 14px; font-weight: 600; }
.faran-captcha__visual { display: flex; align-items: stretch; gap: 8px; margin-bottom: 8px; }
.faran-captcha__image { display: block; width: 190px; height: 58px; max-width: calc(100% - 54px); border: 1px solid var(--frnc-border); border-radius: 10px; background: #f3f4f6; object-fit: cover; }
.faran-captcha__refresh { width: 46px; min-width: 46px; min-height: 46px; padding: 0; border: 1px solid var(--frnc-border); border-radius: 10px; background: #fff; color: #24314d; font: 700 24px/1 sans-serif; cursor: pointer; transition: transform .18s ease, background .18s ease; }
.faran-captcha__refresh:hover { background: #f5f7fa; transform: rotate(25deg); }
.faran-captcha__refresh:focus-visible, .faran-captcha__answer:focus { outline: 2px solid #2563eb; outline-offset: 2px; }
.faran-captcha__refresh:disabled { opacity: .55; cursor: wait; }
.faran-captcha__answer { display: block; width: 100% !important; min-height: 44px; padding: 9px 12px !important; border: 1px solid var(--frnc-border) !important; border-radius: 9px !important; background: #fff !important; color: #111827 !important; text-align: center; direction: ltr; font: 700 18px/1.2 monospace !important; letter-spacing: 7px; }
.faran-captcha__hp { position: absolute !important; left: -10000px !important; width: 1px !important; height: 1px !important; overflow: hidden !important; opacity: 0 !important; pointer-events: none !important; }
.faran-captcha__status { display: block; min-height: 18px; margin-top: 5px; color: #667085; font-size: 12px; }
.faran-captcha.is-loading .faran-captcha__image { opacity: .55; }
.faran-captcha__notice { margin: 10px 0; padding: 10px 12px; border-right: 4px solid #dc2626; border-radius: 6px; background: #fef2f2; color: #991b1b; }

#loginform .faran-captcha, #registerform .faran-captcha, #lostpasswordform .faran-captcha { max-width: none; }
.woocommerce .faran-captcha { max-width: 420px; }

/* Gravity Forms uses a flex footer in recent versions. Prevent the theme or
   footer from stretching the submit and refresh buttons to captcha height. */
.gform_wrapper .gform_footer,
.gform_wrapper .gform_page_footer {
  align-items: flex-end !important;
  flex-wrap: wrap !important;
  gap: 14px 18px !important;
}

.gform_wrapper .gform_footer .faran-captcha,
.gform_wrapper .gform_page_footer .faran-captcha {
  align-self: flex-start !important;
  flex: 0 1 360px !important;
  margin: 0 !important;
}

.gform_wrapper .faran-captcha .faran-captcha__visual {
  display: flex !important;
  flex-flow: row nowrap !important;
  align-items: stretch !important;
  justify-content: flex-start !important;
  gap: 8px !important;
  width: 100% !important;
}

.gform_wrapper .faran-captcha .faran-captcha__image {
  position: static !important;
  display: block !important;
  flex: 0 1 190px !important;
  width: 190px !important;
  max-width: calc(100% - 54px) !important;
  height: 58px !important;
  margin: 0 !important;
}

.gform_wrapper .faran-captcha .faran-captcha__refresh {
  position: static !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  align-self: auto !important;
  flex: 0 0 46px !important;
  width: 46px !important;
  min-width: 46px !important;
  max-width: 46px !important;
  height: 58px !important;
  min-height: 58px !important;
  max-height: 58px !important;
  margin: 0 !important;
  padding: 0 !important;
  line-height: 1 !important;
}

.gform_wrapper .gform_footer .gform_button,
.gform_wrapper .gform_page_footer .gform_button,
.gform_wrapper .gform_footer input[type="submit"],
.gform_wrapper .gform_page_footer input[type="submit"] {
  align-self: flex-end !important;
  flex: 0 0 auto !important;
  width: auto !important;
  min-width: 120px !important;
  height: 48px !important;
  min-height: 48px !important;
  max-height: 48px !important;
  margin: 0 !important;
  padding: 0 24px !important;
  line-height: 48px !important;
  white-space: nowrap !important;
}

@media (max-width: 640px) {
  .gform_wrapper .gform_footer .faran-captcha,
  .gform_wrapper .gform_page_footer .faran-captcha {
    flex-basis: 100% !important;
    max-width: 100%;
  }
}

@media (prefers-color-scheme: dark) {
  .faran-captcha { --frnc-border: #4b5563; --frnc-text: #e5e7eb; }
  .faran-captcha__refresh { background: #1f2937; color: #f3f4f6; }
  .faran-captcha__refresh:hover { background: #273244; }
}