.invite-block {
  margin-top: 0.25rem;
}

.invite-toggle {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;

  padding: 0.85rem 0.95rem;
  border-radius: 14px;

  border: 1px solid var(--bs-border-color);
  background: var(--bs-secondary-bg);
  color: var(--bs-body-color);

  text-align: left;
  cursor: pointer;
  transition: background-color 140ms ease, border-color 140ms ease,
    box-shadow 140ms ease, transform 60ms ease;
}


.invite-toggle:active {
  transform: translateY(1px);
}

.invite-toggle:focus-visible {
  outline: none;
  border-color: rgba(var(--flex-accent-rgb), 0.65);
  box-shadow: 0 0 0 0.22rem rgba(var(--flex-accent-rgb), 0.25);
}

.invite-toggle-text {
  display: grid;
  gap: 0.15rem;
}

.invite-toggle-title {
  font-weight: 700;
  letter-spacing: 0.2px;
  line-height: 1.1;
  color: var(--bs-heading-color);
}

.invite-toggle-sub {
  font-size: 0.86rem;
  color: var(--bs-secondary-color);
  line-height: 1.1;
}

.invite-caret {
  opacity: 0.85;
  transition: transform 180ms ease, opacity 180ms ease;
  font-size: 1.05rem;
  line-height: 1;
  color: var(--bs-body-color);
}

.invite-toggle[aria-expanded='true'] .invite-caret {
  transform: rotate(180deg);
  opacity: 1;
}

.invite-panel {
  margin-top: 0.65rem;
  padding: 0.9rem;
  border-radius: 14px;

  border: 1px solid var(--bs-border-color);
  background: var(--bs-secondary-bg);
  color: var(--bs-body-color);
}

.invite-label {
  margin-bottom: 0.4rem;
  opacity: 0.9;
  color: var(--bs-secondary-color);
}

.invite-prefix {
  font-weight: 800;
  letter-spacing: 0.12em;
  opacity: 0.82;
  border-color: var(--bs-border-color);
  background: var(--bs-tertiary-bg);
  color: var(--bs-body-color);
}

.invite-input {
  border-color: var(--bs-border-color);
  background-color: var(--bs-body-bg);
  color: var(--bs-body-color);
  background-clip: padding-box;

  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas,
    'Liberation Mono', 'Courier New', monospace;
  letter-spacing: 0.06em;
}

.invite-input::placeholder {
  color: var(--bs-secondary-color);
  opacity: 0.65;
}

.invite-hint {
  margin-top: 0.5rem;
  font-size: 0.86rem;
  color: var(--bs-secondary-color);
  opacity: 0.7;
}