/**
 * onisPetitions - wygląd listy petycji, strony petycji, formularza podpisu i modułów (Fundacja Grupa Proelio).
 *
 * Reguły przeniesione bez zmian wartości z własnego arkusza szablonu proelio.pl (Gantry 5, custom.scss,
 * autor: Krzysztof Procajło), żeby komponent wyglądał tak samo na każdym szablonie i wersji Joomli.
 * Wcześniej szablony komponentu używały tych klas, ale pakiet ich nie definiował.
 *
 * :where(#onisWrapper) ogranicza reguły do interfejsu Onis i NIE podnosi ich wagi - selektor waży tyle,
 * co sama klasa. Dzięki temu arkusz szablonu witryny (ładowany później) nadal może każdą z nich nadpisać,
 * a na proelio.pl, gdzie te same reguły są w custom.scss, nic się nie zmienia.
 *
 * Ładowane tylko na witrynie (libraries/oniscore/css.php).
 */

/* --- obcinanie tekstu do N linii (karuzela) --- */
:where(#onisWrapper) .Only2Lines {
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
          line-clamp: 2;
  -webkit-box-orient: vertical;
}
:where(#onisWrapper) .Only7Lines {
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 7;
          line-clamp: 7;
  -webkit-box-orient: vertical;
}

/* --- przycisk "Podpisz petycję": tylko telefon, przyklejony do dołu ekranu --- */
:where(#onisWrapper) .mobileShow {
  display: none;
}
:where(#onisWrapper) .mobileShow img {
  width: 100%;
}
/* Smartphone Portrait and Landscape */
@media only screen and (min-device-width: 320px) and (max-device-width: 480px) {
  :where(#onisWrapper) .mobileShow {
    display: block;
    position: fixed;
    bottom: 0;
    margin: 0 0 0 -4%;
  }
}

/* --- karuzela (mod_onispetitions_slider) --- */
:where(#onisWrapper) .ZPetitionSliderTitle {
  font-size: 20px;
  text-align: center;
  margin-bottom: 5px;
}
:where(#onisWrapper) .ZPetitionSliderDescription {
  font-size: 16px;
  text-align: center;
}
:where(#onisWrapper) .ZPetitionSliderPhoto {
  max-width: 100%;
  height: auto;
  background-size: cover;
}
:where(#onisWrapper) .ZPetitionSliderPhoto img {
  overflow: hidden;
  object-fit: fill;
  height: 250px !important;
  width: 100%;
}
#onisWrapper .bg-red_v2 {
  color: #000000 !important;
  background: #E74C3C !important;
}

/* --- lista petycji --- */
:where(#onisWrapper) .BoxPetycji {
  display: flex;
  min-height: 466px !important;
}
:where(#onisWrapper) .OpisPetycji {
  text-align: center;
  font-size: 1.1rem;
}
:where(#onisWrapper) .tytul {
  font-variant-caps: small-caps;
}
:where(#onisWrapper) .krotkiopis {
  font-size: medium;
}
:where(#onisWrapper) .PetitionListPhotoDIV {
  position: relative;
  max-width: 1000px;
  height: 260px;
  overflow: hidden;
  object-fit: fill;
}
:where(#onisWrapper) .PetitionListPhotoDIV img {
  position: absolute;
  top: 1px;
  left: 1px;
  right: 1px;
  bottom: 1px;
  margin: auto;
  object-fit: fill;
}

/* --- strona petycji i formularz podpisu --- */
:where(#onisWrapper) .ZPetition_Title {
  font-size: 40px;
  font-weight: bold;
  font-variant-caps: small-caps;
}
:where(#onisWrapper) .ZShortDescriptionPetition {
  font-weight: normal;
  font-size: 20px;
  text-align: center;
  font-variant-caps: petite-caps;
}
:where(#onisWrapper) .ZProgressCount {
  text-align: center;
}
:where(#onisWrapper) .BoxTrescPetycji {
  background-color: #ececec9e;
}
:where(#onisWrapper) .AdresatPetycji {
  text-align: center;
  padding-bottom: 2rem;
  color: #e74c3c;
  font-weight: bold;
}
:where(#onisWrapper) .PetitionSignButton {
  color: white !important;
  text-align: center !important;
  background-color: #e74c3c !important;
  font-weight: bold !important;
  text-transform: uppercase;
  font-size: 1.6rem !important;
}
:where(#onisWrapper) .FormGroupRow {
  display: flex;
}
:where(#onisWrapper) .FormGroupRowColumn {
  flex: 50%;
}
:where(#onisWrapper) .adminPetitionImage {
  width: 20%;
}

/* --- moduł mod_onispetitions (strona główna) --- */
:where(#onisWrapper) .HomepagePetitionListPhotoDIV {
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden;
}
:where(#onisWrapper) .HomepagePetitionListPhotoDIV img {
  object-fit: cover;
}
:where(#onisWrapper) .HomepagePetitionListTitleDIV {
  text-align: center;
  font-size: 1.1rem;
}
:where(#onisWrapper) .boxImage img {
  width: 350px;
  height: 180px;
}
:where(#onisWrapper) .trwajaca-blue-box {
  background-color: #66b3dd;
  border-color: #b0c7ed;
  border-radius: 4px;
  display: flex;
  grid-column: 1/-1;
  height: 25px;
  justify-content: center;
  left: -7px;
  position: relative;
  top: 15px;
  width: 195px;
  z-index: 10;
}
:where(#onisWrapper) .trwajaca-blue-box .trwajaca-blue-box-text {
  color: #fff;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 1px;
  padding-top: 2px;
  text-transform: uppercase;
}
:where(#onisWrapper) .overlay {
  position: absolute;
  background: rgba(57, 57, 57, 0.5);
  /* center overlay text */
  display: flex;
  align-items: center;
  justify-content: center;
}
:where(#onisWrapper) .overlay_1 {
  left: 0;
  bottom: 0;
  width: 100%;
  padding: 1rem;
  margin: 0 0px 0px 14px;
  color: white;
}

/* Formularz podpisu: komunikat pod polem kodu pocztowego (od 3.4.2) może się zawijać,
   a kolumny e-mail / kod pocztowy zachowują równą szerokość także z długim komunikatem. */
:where(#onisWrapper) .FormGroupRowColumn {
  min-width: 0;
}
/* !important: klasa .label frameworka Onis sama wymusza nowrap i inline-block */
#onisWrapper .signature-form .postcode-wrong {
  display: block !important;
  padding: 4px 8px !important;
  line-height: 1.3 !important;
  text-align: left;
  white-space: normal !important;
}
#onisWrapper .signature-form .postcode-wrong.hide {
  display: none !important;
}