/* CF7 Spinner Control — v1.2.0 */
/* Color tokens */
:root {
  --cf7sc-accent: #128277;   /* wait text color */
  --cf7sc-orange: #F77F00;   /* spinner stroke + left accent */
  --cf7sc-msg-bg: #fffaf3;
  --cf7sc-msg-border: #ffe2c4;
}

/* === Spinner container === */
.wpcf7 .wpcf7-spinner {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  margin-left: 10px;
  visibility: hidden;
  opacity: 0;
  transition: opacity .15s ease;
  background: transparent !important;
}

/* Hide CF7's default background spinner pseudo if any */
.wpcf7 .wpcf7-spinner::before { content: none !important; }

/* Show during send */
.wpcf7 .wpcf7-spinner.active,
.wpcf7.is-sending .wpcf7-spinner {
  visibility: visible;
  opacity: 1;
}

/* === Modern SVG spinner (Material-like circular progress) === */
.wpcf7 .cf7sc-svg {
  width: 24px;
  height: 24px;
  display: block;
  transform-origin: center;
  animation: cf7sc-rotate 2s linear infinite;
}
.wpcf7 .cf7sc-svg .cf7sc-circle {
  fill: none;
  stroke: var(--cf7sc-orange);
  stroke-width: 3;
  stroke-linecap: round;
  stroke-dasharray: 1, 200;
  stroke-dashoffset: 0;
  animation: cf7sc-dash 1.5s ease-in-out infinite;
}

/* Rotating container */
@keyframes cf7sc-rotate {
  100% { transform: rotate(360deg); }
}
/* Dash animation */
@keyframes cf7sc-dash {
  0%   { stroke-dasharray: 1, 200; stroke-dashoffset: 0; }
  50%  { stroke-dasharray: 90, 200; stroke-dashoffset: -35px; }
  100% { stroke-dasharray: 90, 200; stroke-dashoffset: -124px; }
}

/* "Please wait…" text */
.wpcf7 .cf7sc-wait-text {
  margin-left: 8px;
  font-weight: 600;
  color: var(--cf7sc-accent);
  font-size: 14px;
  line-height: 1;
  display: none;
}
.wpcf7.is-sending .cf7sc-wait-text { display: inline-block; }

/* === Response message card with left accent === */
.wpcf7 .wpcf7-response-output {
  display: block;
  margin-top: 14px;
  padding: 14px 16px;
  border-radius: 10px;
  border: 1px solid var(--cf7sc-msg-border);
  background: var(--cf7sc-msg-bg);
  position: relative;
  box-shadow: 0 6px 20px rgba(0,0,0,0.06);
  transition: opacity .4s ease;
}
.wpcf7 .wpcf7-response-output::before {
  content: "";
  position: absolute;
  left: 0; top: 0; bottom: 0;
  width: 6px;
  border-top-left-radius: 10px;
  border-bottom-left-radius: 10px;
  background-color: var(--cf7sc-orange);
}
.wpcf7 .wpcf7-response-output.is-fading-out { opacity: 0; }

/* Optional readable text colors */
.wpcf7 form.sent .wpcf7-response-output { color: #0b6b3a; }
.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.failed .wpcf7-response-output { color: #7a1f1f; }