/*
 * Legal Document Module — im-doc-legal
 *
 * Styles professional-looking legal documents (umowy, regulaminy, polityki, etc.)
 * by scoping all rules to the .im-doc-legal class.
 *
 * HOW TO USE (Divi Builder):
 *   Add the class  im-doc-legal  to the Divi Section that contains the document.
 *   Divi: Section settings → Advanced → CSS Class → im-doc-legal
 *
 *   The document text module itself should use standard Divi Text module.
 *   No extra classes needed on individual modules.
 *
 * OTHER DOCUMENT PAGES:
 *   Same class works for: regulamin, polityka prywatności, tabela opłat, FAQ, etc.
 *   Just add  im-doc-legal  to the section of any document-type page.
 */

/* ── CSS custom properties ──────────────────────────────────────────────── */
body.im-doc-legal {
  --doc-green:        var(--imc-green, #9bd818);
  --doc-green-dark:   var(--imc-green-dark, #7aa014);
  --doc-ink:          #1e2024;        /* main text */
  --doc-ink-soft:     #4a4f5a;        /* secondary text */
  --doc-ink-faint:    #717880;        /* captions, helpers */
  --doc-surface:      #ffffff;
  --doc-surface-alt:  #f8f9fa;        /* table even rows */
  --doc-border:       #e4e6ea;
  --doc-border-strong: #c8cdd5;  /* darker table grid lines for better visibility */
  --doc-accent-bar:   3px solid var(--doc-green);
  --doc-radius:       6px;
  --doc-font-body:    1.15rem;        /* slightly under site 1.2rem for dense legal text */
  --doc-font-small:   0.875rem;
  --doc-line-height:  1.75;
  --doc-para-marker:  var(--imc-green, #9bd818); /* bright brand green for markers */
}

/* ── Section container ──────────────────────────────────────────────────── */
body.im-doc-legal #main-content .et_pb_section,
body.im-doc-legal #main-content .et_pb_row {
  max-width: 1100px !important;
  margin-left:  auto;
  margin-right: auto;
}

/* ── Inner text wrapper ─────────────────────────────────────────────────── */
body.im-doc-legal #main-content .et_pb_text_inner {
  background:    var(--doc-surface);
  border-radius: var(--doc-radius);
  padding:       2.5rem 3rem;
  box-shadow:    0 4px 28px rgba(0, 0, 0, .09), 0 1px 6px rgba(155, 216, 24, .08);
  overflow:      hidden;
  font-family:   'Poppins', sans-serif;
  font-size:     var(--doc-font-body);
  line-height:   var(--doc-line-height);
  color:         var(--doc-ink);
}

@media (max-width: 767px) {
  body.im-doc-legal #main-content .et_pb_text_inner {
    padding: 1.5rem 1.25rem;
  }
}

/* ── Document title (h1) ────────────────────────────────────────────────── */
body.im-doc-legal #main-content .et_pb_text_inner h1 {
  font-family: var(--imc-font-header, "Quicksand", sans-serif);
  font-size:   clamp(1.6rem, 3vw + 0.6rem, 2.4rem) !important;
  font-weight: 800;
  color:       var(--doc-ink) !important;
  text-align:  center;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  margin-bottom: 0.35em !important;

}

/* ── Paragraph marker headlines (§1 Przedmiot umowy) ───────────────────── */
/*  Typically rendered as h2, h3, or strong text in Divi text modules       */
body.im-doc-legal #main-content .et_pb_text_inner h2,
body.im-doc-legal #main-content .et_pb_text_inner h3 {
  font-family: var(--imc-font-header, "Quicksand", sans-serif);
  font-size:   1.05rem !important;
  font-weight: 700;
  color:       var(--doc-ink) !important;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin-top:   2rem !important;
  margin-bottom: 0.4rem !important;

  /* left accent bar with subtle background tint */
  border-left:      var(--doc-accent-bar);
  padding:          0.25rem 0.75rem;
  background-color: rgba(155, 216, 24, 0.07);
  border-radius:    0 4px 4px 0;
}

/* ── Body paragraphs ────────────────────────────────────────────────────── */
body.im-doc-legal #main-content .et_pb_text_inner p {
  color:         var(--doc-ink);
  margin-bottom: 0.85em !important;
  text-align:    left;
}

/* ── Ordered & unordered lists ──────────────────────────────────────────── */
body.im-doc-legal #main-content .et_pb_text_inner ol,
body.im-doc-legal #main-content .et_pb_text_inner ul {
  padding-left:  1.6em;
  margin-bottom: 1em;
}

body.im-doc-legal #main-content .et_pb_text_inner li {
  margin-bottom: 0.45em;
  color: var(--doc-ink);
}

body.im-doc-legal #main-content .et_pb_text_inner ol > li::marker {
  color:       var(--doc-para-marker);
  font-weight: 700;
}

body.im-doc-legal #main-content .et_pb_text_inner ul > li::marker {
  color: var(--doc-para-marker);
}

/* ── ol[type] — HTML type attribute support (CSS overrides HTML attribute)  */
body.im-doc-legal #main-content .et_pb_text_inner ol[type="a"] { list-style-type: lower-alpha; }
body.im-doc-legal #main-content .et_pb_text_inner ol[type="A"] { list-style-type: upper-alpha; }
body.im-doc-legal #main-content .et_pb_text_inner ol[type="i"] { list-style-type: lower-roman; }
body.im-doc-legal #main-content .et_pb_text_inner ol[type="I"] { list-style-type: upper-roman; }
body.im-doc-legal #main-content .et_pb_text_inner ol[type="1"] { list-style-type: decimal;     }

/* ── Paragraph markers inline: § bold text ──────────────────────────────── */
body.im-doc-legal #main-content .et_pb_text_inner strong {
  color:       var(--doc-ink);
  font-weight: 700;
}

/* ── "Podstawowe Warunki Pożyczki" summary table ────────────────────────── */
/*  This is the 2-column key-value summary right before §1                   */
body.im-doc-legal #main-content .et_pb_text_inner table:first-of-type {
  background:    var(--doc-surface-alt);
  border:        2px solid var(--doc-green);
  border-radius: var(--doc-radius);
  overflow:      hidden;
}

body.im-doc-legal #main-content .et_pb_text_inner table:first-of-type td {
  padding:       0.7rem 1.1rem;
  font-weight:   600;
  border:        1px solid var(--doc-border-strong);
  word-break:    break-word;
  overflow-wrap: break-word;
}

body.im-doc-legal #main-content .et_pb_text_inner table:first-of-type td:first-child {
  color:            var(--doc-ink-soft);
  font-weight:      500;
  font-size:        var(--doc-font-small);
  white-space:      normal;
  background-color: var(--doc-surface-alt);
  width:            42%;
}

body.im-doc-legal #main-content .et_pb_text_inner table:first-of-type td:last-child {
  color:       var(--doc-ink);
  font-weight: 700;
}

/* ── All remaining tables (harmonogram, tabela opłat) ───────────────────── */
body.im-doc-legal #main-content .et_pb_text_inner table {
  width:          100%;
  border-collapse: collapse;
  margin:         1.5rem 0;
  font-size:      var(--doc-font-small);
}

body.im-doc-legal #main-content .et_pb_text_inner table th,
body.im-doc-legal #main-content .et_pb_text_inner table td {
  padding:        0.55rem 0.9rem;
  border:         1px solid var(--doc-border-strong);
  text-align:     left;
  vertical-align: top;
  word-break:     break-word;
  overflow-wrap:  break-word;
}

body.im-doc-legal #main-content .et_pb_text_inner table th {
  background:     var(--doc-green);
  color:          var(--imc-on-green, #1a1a1a);
  font-family:    var(--imc-font-header, "Quicksand", sans-serif);
  font-weight:    700;
  font-size:      0.8rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  white-space:    nowrap;
}

/* Alternating rows on standard tables */
body.im-doc-legal #main-content .et_pb_text_inner table tr:nth-child(even) td {
  background-color: var(--doc-surface-alt);
}

body.im-doc-legal #main-content .et_pb_text_inner table tr:hover td {
  background-color: rgba(155, 216, 24, 0.10); /* brand green tint */
  transition: background-color 0.15s ease;
}

/* ── 2-column fee tables (Pozycja / Koszt) — 3:1 column ratio ───────────── */
/*  Detects tables that have no 3rd cell — i.e. exactly 2 columns.          */
body.im-doc-legal #main-content .et_pb_text_inner table:not(:first-of-type):not(:has(td:nth-child(3))) {
  table-layout: fixed;
}

body.im-doc-legal #main-content .et_pb_text_inner table:not(:first-of-type):not(:has(td:nth-child(3))) td:first-child {
  width: 75%;
}

/* ── Multi-column schedule tables (Harmonogram, 3+ cols) ────────────────── */
/*  LP column stays as narrow as its content; remaining cols share rest equally. */
body.im-doc-legal #main-content .et_pb_text_inner table:not(:first-of-type):has(td:nth-child(3)) {
  table-layout: fixed;
}

body.im-doc-legal #main-content .et_pb_text_inner table:not(:first-of-type):has(td:nth-child(3)) th:first-child,
body.im-doc-legal #main-content .et_pb_text_inner table:not(:first-of-type):has(td:nth-child(3)) td:first-child {
  width:      3rem;
  text-align: center;
  word-break: normal;   /* numbers in Lp. column should never break */
}

/* ── Mobile: horizontal scroll for wide tables ──────────────────────────── */
@media (max-width: 767px) {
  body.im-doc-legal #main-content .et_pb_text_inner table {
    display:           block;
    overflow-x:        auto;
    -webkit-overflow-scrolling: touch;
    white-space:       nowrap;
  }

  /* But allow 2-column key-value tables to wrap */
  body.im-doc-legal #main-content .et_pb_text_inner table:first-of-type {
    display:     table;
    white-space: normal;
  }

  body.im-doc-legal #main-content .et_pb_text_inner table:first-of-type td:first-child {
    white-space: normal;
  }
}

/* ── Horizontal rule / spacer ───────────────────────────────────────────── */
body.im-doc-legal #main-content .et_pb_text_inner hr {
  border:  none;
  margin:  2rem 0;
}


/* ── Attachment headings ────────────────────────────────────────────────── */
/*  "Załącznik nr X" — <p><strong>Załącznik…</strong></p> followed by <ol>  */
body.im-doc-legal #main-content .et_pb_text_inner p:has(strong):has(+ ol) {
  margin-top:  2rem;
  padding-top: 1rem;
}

/* ── Links ──────────────────────────────────────────────────────────────── */
body.im-doc-legal #main-content .et_pb_text_inner a {
  color:           var(--doc-green-dark);
  text-decoration: underline;
  text-underline-offset: 2px;
}

body.im-doc-legal #main-content .et_pb_text_inner a:hover {
  color: var(--doc-green);
}

/* ── "Nota o dacie" / document date line ───────────────────────────────── */
/*  "Zawarta w Warszawie w dniu" — first paragraph after h1                  */
body.im-doc-legal #main-content .et_pb_text_inner h1 + p {
  text-align:  center;
  color:       var(--doc-ink-soft);
  font-style:  italic;
  font-size:   var(--doc-font-small);
  margin-top:  0.6rem !important;
  margin-bottom: 2rem !important;
}

/* ── Page/section break hint (print) ───────────────────────────────────── */
body.im-doc-legal .im-doc-page-break {
  page-break-after: always;
  break-after:      page;
}

/* ── Print Styles ───────────────────────────────────────────────────────── */
@media print {
  body.im-doc-legal #main-content .et_pb_text_inner {
    box-shadow: none;
    padding:    0;
    max-width:  100%;
  }

  body.im-doc-legal #main-content .et_pb_text_inner h1 {
    font-size: 18pt !important;
  }

  body.im-doc-legal #main-content .et_pb_text_inner h2,
  body.im-doc-legal #main-content .et_pb_text_inner h3 {
    font-size: 12pt !important;
    border-left: 2pt solid #000;
  }

  body.im-doc-legal #main-content .et_pb_text_inner table th {
    background: #e0e0e0 !important;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }

  body.im-doc-legal #main-content .et_pb_text_inner table tr:nth-child(even) td {
    background-color: #f5f5f5 !important;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }

  /* Hide Divi chrome for print */
  .et-fixed-header,
  #main-footer,
  .et_pb_section .et_pb_row:empty {
    display: none !important;
  }
}