/*
 * KoloPlus — widgets/profile/profile_relationship_actions · v1.1.3.007
 * Friend/follow/block toggle buttons on profile.
 */

.w-profile-profile-relationship-actions {
  display: flex;
  align-items: center;
  gap: var(--n-s-2);
  flex-wrap: wrap;
}

.w-profile-profile-relationship-actions--own {
  /* No actions for own profile */
}

.w-profile-profile-relationship-actions__friend-toggle,
.w-profile-profile-relationship-actions__follow-toggle {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 14px;
  font-family: inherit;
  font-size: var(--n-fs);
  font-weight: var(--n-w-sem);
  border-radius: var(--n-r-pill);
  cursor: pointer;
  text-decoration: none;
  transition: background var(--n-dur-base) var(--n-ease),
              color var(--n-dur-base) var(--n-ease);
}

.w-profile-profile-relationship-actions__friend-toggle {
  background: var(--n-accent);
  color: var(--n-text-on-accent);
  border: none;
}
.w-profile-profile-relationship-actions__friend-toggle:hover {
  background: var(--n-accent-hover);
}

.w-profile-profile-relationship-actions__follow-toggle {
  background: transparent;
  color: var(--n-text);
  border: 1px solid var(--n-line);
}
.w-profile-profile-relationship-actions__follow-toggle:hover {
  background: var(--n-bg-hover);
  border-color: var(--n-line-strong);
}
.w-profile-profile-relationship-actions__follow-toggle.is-active {
  background: var(--n-accent-soft);
  color: var(--n-accent);
  border-color: transparent;
}

.w-profile-profile-relationship-actions__blocked-msg {
  padding: var(--n-s-2) var(--n-s-3);
  background: var(--n-danger-soft);
  color: var(--n-danger);
  border-radius: var(--n-r-md);
  font-weight: var(--n-w-med);
}