/* LIOVELA B2C V94F - kosmetyka zgód w rejestracji
   Autor: Modyfikator stworzony przez gumis */

/*
  Cel:
  - równa kolumna gwiazdek,
  - równa kolumna checkboxów,
  - tekst zgody równo z checkboxem,
  - opis pod ostatnią zgodą z wcięciem pod tekstem, nie pod gwiazdką.
*/

html.liovela-v94e-scope form .liovela-v94e-required-holder,
body#authentication form .liovela-v94e-required-holder,
body#identity form .liovela-v94e-required-holder,
body.page-authentication form .liovela-v94e-required-holder,
body.page-identity form .liovela-v94e-required-holder {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  min-height: 26px !important;
  vertical-align: middle !important;
  line-height: 1.35 !important;
}

html.liovela-v94e-scope form .liovela-v94e-required-holder::before,
body#authentication form .liovela-v94e-required-holder::before,
body#identity form .liovela-v94e-required-holder::before,
body.page-authentication form .liovela-v94e-required-holder::before,
body.page-identity form .liovela-v94e-required-holder::before {
  width: 18px !important;
  min-width: 18px !important;
  flex: 0 0 18px !important;
  margin: 0 !important;
  padding: 0 !important;
  line-height: 20px !important;
  font-size: 31px !important;
  transform: translateY(5px) !important;
  text-align: center !important;
}

html.liovela-v94e-scope form input.liovela-v94e-required,
body#authentication form input.liovela-v94e-required,
body#identity form input.liovela-v94e-required,
body.page-authentication form input.liovela-v94e-required,
body.page-identity form input.liovela-v94e-required {
  flex: 0 0 auto !important;
  margin: 0 4px 0 0 !important;
  position: relative !important;
  top: 0 !important;
}

/* Gdy tekst etykiety jest w tym samym rodzicu co checkbox */
html.liovela-v94e-scope form .liovela-v94e-required-holder label,
html.liovela-v94e-scope form .liovela-v94e-required-holder span,
html.liovela-v94e-scope form .liovela-v94e-required-holder .custom-checkbox,
body#authentication form .liovela-v94e-required-holder label,
body#identity form .liovela-v94e-required-holder label,
body.page-authentication form .liovela-v94e-required-holder label,
body.page-identity form .liovela-v94e-required-holder label {
  margin: 0 !important;
  line-height: 1.35 !important;
  vertical-align: middle !important;
}

/* Opisy pod zgodami nie mogą startować pod gwiazdką/checkboxem */
html.liovela-v94e-scope form .liovela-v94e-required-holder ~ em,
html.liovela-v94e-scope form .liovela-v94e-required-holder ~ i,
html.liovela-v94e-scope form .liovela-v94e-required-holder ~ small,
html.liovela-v94e-scope form .liovela-v94e-required-holder ~ p,
html.liovela-v94e-scope form .liovela-v94e-required-holder ~ .form-text,
html.liovela-v94e-scope form .liovela-v94e-required-holder ~ .help-block,
body#authentication form .liovela-v94e-required-holder ~ em,
body#authentication form .liovela-v94e-required-holder ~ i,
body#authentication form .liovela-v94e-required-holder ~ small,
body#authentication form .liovela-v94e-required-holder ~ p,
body#identity form .liovela-v94e-required-holder ~ em,
body#identity form .liovela-v94e-required-holder ~ i,
body#identity form .liovela-v94e-required-holder ~ small,
body#identity form .liovela-v94e-required-holder ~ p {
  display: block !important;
  margin-left: 54px !important;
  margin-top: 6px !important;
  max-width: 620px !important;
  line-height: 1.48 !important;
}

/* Jeśli opis siedzi jako element wewnątrz całego wiersza, zachowaj ten sam wizualny offset */
html.liovela-v94e-scope form .form-group:has(.liovela-v94e-required-holder) em,
html.liovela-v94e-scope form .form-group:has(.liovela-v94e-required-holder) i,
html.liovela-v94e-scope form .form-group:has(.liovela-v94e-required-holder) small,
html.liovela-v94e-scope form .form-group:has(.liovela-v94e-required-holder) p,
body#authentication form .form-group:has(.liovela-v94e-required-holder) em,
body#authentication form .form-group:has(.liovela-v94e-required-holder) i,
body#authentication form .form-group:has(.liovela-v94e-required-holder) small,
body#authentication form .form-group:has(.liovela-v94e-required-holder) p,
body#identity form .form-group:has(.liovela-v94e-required-holder) em,
body#identity form .form-group:has(.liovela-v94e-required-holder) i,
body#identity form .form-group:has(.liovela-v94e-required-holder) small,
body#identity form .form-group:has(.liovela-v94e-required-holder) p {
  margin-left: 54px !important;
  max-width: 620px !important;
  line-height: 1.48 !important;
}

/* Normalne checkboxy bez gwiazdki też trzymamy w tej samej osi wizualnej */
html.liovela-v94e-scope form input[type="checkbox"]:not(.liovela-v94e-required),
body#authentication form input[type="checkbox"]:not(.liovela-v94e-required),
body#identity form input[type="checkbox"]:not(.liovela-v94e-required),
body.page-authentication form input[type="checkbox"]:not(.liovela-v94e-required),
body.page-identity form input[type="checkbox"]:not(.liovela-v94e-required) {
  margin-top: 0 !important;
  vertical-align: middle !important;
}

/* Odstępy między checkboxami w sekcji, żeby nie wyglądały jak rozsypane */
html.liovela-v94e-scope form .form-group:has(input[type="checkbox"]),
body#authentication form .form-group:has(input[type="checkbox"]),
body#identity form .form-group:has(input[type="checkbox"]),
body.page-authentication form .form-group:has(input[type="checkbox"]),
body.page-identity form .form-group:has(input[type="checkbox"]) {
  margin-bottom: 14px !important;
}

@media (max-width: 767px) {
  html.liovela-v94e-scope form .liovela-v94e-required-holder::before,
  body#authentication form .liovela-v94e-required-holder::before,
  body#identity form .liovela-v94e-required-holder::before,
  body.page-authentication form .liovela-v94e-required-holder::before,
  body.page-identity form .liovela-v94e-required-holder::before {
    width: 16px !important;
    min-width: 16px !important;
    flex-basis: 16px !important;
    font-size: 28px !important;
    transform: translateY(5px) !important;
  }

  html.liovela-v94e-scope form .liovela-v94e-required-holder ~ em,
  html.liovela-v94e-scope form .liovela-v94e-required-holder ~ i,
  html.liovela-v94e-scope form .liovela-v94e-required-holder ~ small,
  html.liovela-v94e-scope form .liovela-v94e-required-holder ~ p,
  html.liovela-v94e-scope form .form-group:has(.liovela-v94e-required-holder) em,
  html.liovela-v94e-scope form .form-group:has(.liovela-v94e-required-holder) i,
  html.liovela-v94e-scope form .form-group:has(.liovela-v94e-required-holder) small,
  html.liovela-v94e-scope form .form-group:has(.liovela-v94e-required-holder) p {
    margin-left: 48px !important;
    max-width: calc(100% - 48px) !important;
  }
}