/* ============================================================================
   GeneratePress Child Theme — components.css
   Voucher, Discount, s5o-legal (Voucher), ProvenExpert Seal, Code Directory Structure
   ============================================================================ */

/* ==========================================================================
   Code / Directory Structur
   ========================================================================== */
.s5o-directory-dark {
  background-color: var(
    --s5o-neutral-grey-700
  ); /* COLMIG: was s5o-c-grey-dark-1 (#333332 → #4f5668 Blaugrau statt Dunkelgrau) */
  color: var(--s5o-text-inverse);
  padding: 2rem;
  margin-top: 1rem;
  margin-bottom: 1rem;
  border-radius: 1rem;
  font-family: var(--s5o-f-text-mono);
}

/* ==========================================================================
   ProvenExpert Seal
   ========================================================================== */

.pe-pro-seal {
  top: 460px !important;
  bottom: unset !important;
}

/* MOD Voucher - Order
   ========================================================================== */
.s5o-voucher-order {
  background-color: var(--s5o-surface-white);
  margin-bottom: 2rem;
}

.s5o-voucher-order-details-preview h3 {
  font-weight: initial !important;
  font-size: 1.75rem !important;
}

/* MOD Discount
   ========================================================================== */
.s5o-voucher-btn {
  border: 2px dashed black !important;
  border-radius: 1rem;
  background-image: url("/wp-content/uploads/cms/common/couponcode_guilloche_1-300x300.webp") !important;
  padding: 2rem;
  color: var(--s5o-deep-cyan);
  font-size: 2rem !important;
  line-height: 2rem !important;
}

.s5o-voucher-btn:hover {
  color: var(--s5o-neutral-black) /* COLMIG: was s5o-c-pure-black (1:1 match) */;
}

/* s5o legal (s5o-legal/Voucher)
   ========================================================================== */
/* #region */
.s5o-legal {
  -moz-column-count: 2;
  -webkit-column-count: 2;
  column-count: 2;
  font-size: 0.9rem;
  line-height: 1.125rem;
  font-family: var(--s5o-f-text-cond);
  hyphens: auto;
  text-align: justify;
}

.s5o-legal.__col-1 {
  -moz-column-count: 1;
  -webkit-column-count: 1;
  column-count: 1;
}

.s5o-legal h2,
.s5o-legal h3,
.s5o-legal h4,
.s5o-legal h5 {
  margin: 0.5rem 0;
  color: var(--s5o-content-primary);
  font-weight: 700;
  font-family: var(--s5o-f-text-cond);
  text-transform: unset;
}

.s5o-legal h2 {
  margin-top: 3rem;
  margin-bottom: 1rem;
  margin-left: -5px;
  border-left: 5px solid var(--s5o-content-primary);
  padding-bottom: 1rem;
  padding-left: 1rem;
  color: var(--s5o-content-primary);
  font-size: 1.25rem;
}

.s5o-legal h3 {
  margin-top: 2rem;
  border-bottom: 1px solid var(--s5o-content-primary);
  font-size: 1.25rem;
}

.s5o-legal h4 {
  font-size: 1.125rem;
}

.s5o-legal h5 {
  font-size: 1rem;
}

.s5o-legal > h2:first-child,
.s5o-legal > h3:first-child {
  margin-top: 0;
}

.s5o-legal ol li {
  text-align: justify;
}

.s5o-legal > ol {
  counter-reset: listenpunkt_l1;
  margin-left: 0;
  font-weight: bold;
  list-style-type: none;
}

.s5o-legal > ol > li {
  margin-bottom: 0.5em !important;
}

.s5o-legal > ol > li::before {
  counter-increment: listenpunkt_l1;
  content: "§ " counter(listenpunkt_l1) " ";
  /* ALT: content: counter(listenpunkt_l1) ". "; */
}

.s5o-legal > ol > li > ol {
  counter-reset: listenpunkt_l2;
  font-weight: 400;
  list-style-type: none;
}

.s5o-legal > ol > li > ol > li::before {
  counter-increment: listenpunkt_l2;
  content: counter(listenpunkt_l1) "." counter(listenpunkt_l2) " ";
  font-weight: bold;
}

.s5o-legal > ol > li > ol > li > ol {
  counter-reset: listenpunkt_l3;
  font-weight: 400;
  list-style-type: none;
}

.s5o-legal > ol > li > ol > li > ol > li::before {
  counter-increment: listenpunkt_l3;
  content: counter(listenpunkt_l1) "." counter(listenpunkt_l2) "."
    counter(listenpunkt_l3) " ";
  font-weight: bold;
}

.s5o-legal blockquote {
  font-size: 0.8rem !important;
  font-style: normal !important;
  padding: 0 0 0 1rem;
  margin: 1rem 0;
}

.s5o-legal p,
.s5o-legal li {
  orphans: 2; /* At least two lines at the beginning of the column */
  widows: 2; /* At least two lines at the end of the column */
}

/* #endregion */