/*
 * Connector Spinner States
 * Applies to: Settings > Connectors action button + status badge while
 *             OAuth/connect operations are in progress.
 */

/* ── Positioning Context for Pseudo-Element Spinners ─────────────────────── */
.connector-action-button,
.connector-status-badge {
  position: relative;
}

/* ── Action Button: Connecting Spinner ────────────────────────────────────── */
.connector-action-button.is-connecting {
  padding-left: 30px !important;
}

.connector-action-button.is-connecting::before {
  content: "";
  position: absolute;
  left: 10px;
  top: 50%;
  width: 12px;
  height: 12px;
  margin-top: -6px;
  border: 2px solid rgba(255, 255, 255, 0.45);
  border-top-color: #ffffff;
  border-radius: 50%;
  animation: yc-spin 0.8s linear infinite;
}

/* ── Status Badge: Connecting Spinner ─────────────────────────────────────── */
.connector-status-badge.is-connecting {
  padding-left: 22px !important;
}

.connector-status-badge.is-connecting::before {
  content: "";
  position: absolute;
  left: 8px;
  top: 50%;
  width: 9px;
  height: 9px;
  margin-top: -4.5px;
  border: 2px solid rgba(29, 78, 216, 0.25);
  border-top-color: #1d4ed8;
  border-radius: 50%;
  animation: yc-spin 0.8s linear infinite;
}

/* ── Shared Spinner Keyframes ─────────────────────────────────────────────── */
@keyframes yc-spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}