/**
 * onisPetitions - przyciski udostępniania petycji (od 3.4.6).
 *
 * Selektory zaczynają się od ".onisShare:not(#_)": blok jest na stronie komponentu, wewnątrz
 * #onisWrapper, gdzie reguły frameworka Onis (Bootstrap 3 z identyfikatorem w selektorze)
 * wygrywałyby ze zwykłymi klasami. ":not(#_)" podnosi wagę selektora bez zmiany jego znaczenia.
 */
.onisShare:not(#_) {
  box-sizing: border-box;
  margin: 0;
  padding: 22px 16px 26px;
  text-align: center;
}

.onisShare:not(#_) *,
.onisShare:not(#_) *::before,
.onisShare:not(#_) *::after {
  box-sizing: border-box;
}

.onisShare:not(#_) .onisShare__heading {
  margin: 0 0 18px;
  padding: 0;
  text-align: center;
  line-height: 1.25;
}

.onisShare:not(#_) .onisShare__buttons {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 12px;
  margin: 0;
  padding: 0;
}

.onisShare:not(#_) .onisShare__btn {
  --onis-share-bg: #5f6b76;
  --onis-share-fg: #fff;
  --onis-share-border: transparent;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.6em;
  min-width: 210px;
  min-height: 60px;
  margin: 0;
  padding: 10px 26px;
  border: 2px solid var(--onis-share-border);
  border-radius: 6px;
  background: var(--onis-share-bg);
  color: var(--onis-share-fg);
  font-family: inherit;
  font-size: 22px;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: 0;
  text-align: center;
  text-decoration: none;
  text-shadow: none;
  text-transform: none;
  white-space: nowrap;
  box-shadow: none;
  cursor: pointer;
  transition: filter 0.15s ease, transform 0.15s ease;
  -webkit-appearance: none;
  appearance: none;
}

.onisShare:not(#_) .onisShare__btn[hidden] {
  display: none;
}

.onisShare:not(#_) .onisShare__btn:hover,
.onisShare:not(#_) .onisShare__btn:focus {
  background: var(--onis-share-bg);
  color: var(--onis-share-fg);
  text-decoration: none;
  filter: brightness(0.9);
}

.onisShare:not(#_) .onisShare__btn:focus-visible {
  outline: 3px solid #1f2933;
  outline-offset: 2px;
}

.onisShare:not(#_) .onisShare__btn:active {
  transform: translateY(1px);
}

.onisShare:not(#_) .onisShare__btn i {
  flex: none;
  width: 1.1em;
  margin: 0;
  color: inherit;
  font-size: 1.1em;
  line-height: 1;
  text-align: center;
}

.onisShare:not(#_) .onisShare__btn span {
  color: inherit;
}

/* Kolory przycisków: biały napis ma na każdym kontrast co najmniej 4,5:1. */
.onisShare:not(#_) .onisShare__btn--facebook { --onis-share-bg: #1368dc; }
.onisShare:not(#_) .onisShare__btn--x        { --onis-share-bg: #000; }
.onisShare:not(#_) .onisShare__btn--whatsapp { --onis-share-bg: #0e7a6e; }
.onisShare:not(#_) .onisShare__btn--telegram { --onis-share-bg: #1673b1; }
.onisShare:not(#_) .onisShare__btn--linkedin { --onis-share-bg: #0a66c2; }
.onisShare:not(#_) .onisShare__btn--email    { --onis-share-bg: #5f6b76; }

.onisShare:not(#_) .onisShare__btn--copy,
.onisShare:not(#_) .onisShare__btn--native {
  --onis-share-bg: #fff;
  --onis-share-fg: #1f2933;
  --onis-share-border: #b6bfc8;
}

.onisShare:not(#_) .onisShare__btn--copy.is-done {
  --onis-share-fg: #17663a;
  --onis-share-border: #17663a;
}

/* Telefon: przyciski jeden pod drugim, na całą szerokość. */
@media (max-width: 600px) {
  .onisShare:not(#_) {
    padding: 18px 10px 22px;
  }

  .onisShare:not(#_) .onisShare__btn {
    width: 100%;
    min-width: 0;
    min-height: 56px;
    font-size: 20px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .onisShare:not(#_) .onisShare__btn {
    transition: none;
  }
}
