/* XGR Whitepaper CSS v3
   CSS-only document theme for MiCAR / iXBRL whitepaper pages.

   Load order in every whitepaper HTML:
   1) /css/styles.css
   2) /css/whitepaper.css?v=3  <-- last stylesheet

   Important:
   - This file does NOT style the shared header/footer.
   - All link/table/card/document styling is scoped to main.container / .light-section.
   - Do not change Inline-XBRL / ix:* structure in the HTML.
*/

:root {
  --wp-bg: #f6f8f3;
  --wp-paper: rgba(255, 255, 250, 0.96);
  --wp-text: #10241d;
  --wp-soft: #31483f;
  --wp-muted: #5d7168;
  --wp-green-950: #061a14;
  --wp-green-900: #06241c;
  --wp-green-800: #0b3a2e;
  --wp-green-700: #17633a;
  --wp-border: rgba(6, 36, 28, 0.14);
  --wp-shadow: 0 24px 70px rgba(6, 36, 28, 0.08);
}

/* Page base.
   Safe global rules only: background and legacy body offset.
   No global link/header/footer styling here. */
html,
body {
  background:
    radial-gradient(circle at 86% 7%, rgba(141, 221, 98, 0.13), transparent 34rem),
    radial-gradient(circle at 8% 78%, rgba(47, 143, 63, 0.045), transparent 30rem),
    linear-gradient(180deg, #fbfcf8 0%, var(--wp-bg) 100%) !important;
  color: var(--wp-text) !important;
}

body {
  display: block !important;
  min-height: 100vh !important;
  margin: 0 !important;
  padding-top: 0 !important;
}

body::before {
  content: "" !important;
  position: fixed !important;
  inset: 0 !important;
  z-index: -3 !important;
  pointer-events: none !important;
  background:
    linear-gradient(rgba(7, 34, 26, 0.014) 1px, transparent 1px),
    linear-gradient(90deg, rgba(7, 34, 26, 0.014) 1px, transparent 1px),
    radial-gradient(circle at 22% 30%, rgba(47, 143, 63, 0.06) 0 1.4px, transparent 2.4px),
    radial-gradient(circle at 78% 24%, rgba(47, 143, 63, 0.055) 0 1.4px, transparent 2.4px),
    radial-gradient(circle at 70% 74%, rgba(201, 154, 46, 0.075) 0 1.4px, transparent 2.4px) !important;
  background-size: 48px 48px, 48px 48px, 260px 260px, 320px 320px, 360px 360px !important;
}

/* Main document container */
main,
main.container,
body > .container {
  width: min(1120px, calc(100% - 44px)) !important;
  max-width: 1120px !important;
  margin: 0 auto !important;
  padding: clamp(38px, 5vw, 62px) 0 86px !important;
  color: var(--wp-text) !important;
  flex: initial !important;
}

main.container > .light-section,
main .light-section,
body > .container > .light-section {
  max-width: 1120px !important;
  margin: 0 auto !important;
  padding: clamp(28px, 4vw, 48px) !important;
  border-radius: 34px !important;
  color: var(--wp-text) !important;
  background:
    linear-gradient(rgba(7, 34, 26, 0.012) 1px, transparent 1px),
    linear-gradient(90deg, rgba(7, 34, 26, 0.012) 1px, transparent 1px),
    radial-gradient(circle at 88% 22%, rgba(136, 225, 104, 0.10), transparent 30rem),
    var(--wp-paper) !important;
  background-size: 48px 48px, 48px 48px, auto, auto !important;
  border: 1px solid var(--wp-border) !important;
  box-shadow: var(--wp-shadow) !important;
  overflow: visible !important;
  isolation: auto !important;
}

main.container > .light-section::before,
main.container > .light-section::after,
main .light-section::before,
main .light-section::after,
main .hero::before,
main .hero::after,
main .hero-box::before,
main .hero-box::after,
main .databox::before,
main .databox::after {
  display: none !important;
  content: none !important;
}

/* Document typography scoped to whitepaper content only */
main .page,
main section,
main article,
main p,
main li,
main td,
main th,
main dd,
main dt,
main caption,
main ix\:nonNumeric,
main ix\:nonFraction {
  color: var(--wp-text) !important;
}

main .page {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 auto !important;
}

main p,
main li,
main td,
main th,
main dd,
main dt {
  line-height: 1.52 !important;
}

main a,
main .page a,
main table a {
  color: var(--wp-green-700) !important;
  text-decoration: underline !important;
  text-decoration-thickness: 1px !important;
  text-underline-offset: 2px !important;
}

main a:hover,
main .page a:hover,
main table a:hover {
  color: var(--wp-green-950) !important;
}

main h1,
main h2,
main h3,
main h4,
main h5,
main h6 {
  color: var(--wp-green-950) !important;
}

main h2.section {
  margin-top: 2.25rem !important;
  margin-bottom: 1rem !important;
  padding-bottom: 0.55rem !important;
  border-bottom: 2px solid rgba(47, 143, 63, 0.26) !important;
  color: var(--wp-green-950) !important;
  font-size: clamp(1.65rem, 3vw, 2.45rem) !important;
  line-height: 1.08 !important;
  letter-spacing: -0.035em !important;
  font-weight: 900 !important;
}

/* Cover page: light premium document hero */
main .cover-page {
  max-width: 100% !important;
  margin: 0 0 2rem !important;
  padding: clamp(2.6rem, 5vw, 4.4rem) clamp(1.6rem, 5vw, 3.4rem) !important;
  border-radius: 28px !important;
  text-align: left !important;
  color: var(--wp-green-950) !important;
  background:
    radial-gradient(circle at 88% 14%, rgba(141, 221, 98, 0.14), transparent 32rem),
    linear-gradient(rgba(7, 34, 26, 0.018) 1px, transparent 1px),
    linear-gradient(90deg, rgba(7, 34, 26, 0.018) 1px, transparent 1px),
    rgba(255, 255, 250, 0.96) !important;
  background-size: auto, 48px 48px, 48px 48px, auto !important;
  border: 1px solid rgba(6, 36, 28, 0.13) !important;
  box-shadow: 0 24px 70px rgba(6, 36, 28, 0.08) !important;
  page-break-after: auto !important;
}

main .cover-page h1 {
  max-width: 820px !important;
  margin: 0 0 1rem !important;
  color: var(--wp-green-950) !important;
  font-size: clamp(2.5rem, 5vw, 4.7rem) !important;
  line-height: 0.98 !important;
  letter-spacing: -0.055em !important;
  font-weight: 950 !important;
}

main .cover-page h2 {
  margin: 0.2rem 0 !important;
  color: var(--wp-green-700) !important;
  font-size: clamp(1.2rem, 2vw, 1.7rem) !important;
  font-weight: 850 !important;
}

main .cover-page p {
  margin: 0.25rem 0 0 !important;
  color: var(--wp-soft) !important;
  font-size: 1rem !important;
}

/* TOC / small document cards */
main nav.toc,
main .hero,
main .hero-box,
main .databox {
  margin: 0 0 2rem !important;
  padding: clamp(1.4rem, 3vw, 2rem) !important;
  border-radius: 24px !important;
  background:
    radial-gradient(circle at 90% 0%, rgba(141, 221, 98, 0.10), transparent 34rem),
    rgba(255, 255, 250, 0.92) !important;
  color: var(--wp-text) !important;
  border: 1px solid rgba(6, 36, 28, 0.12) !important;
  box-shadow: 0 16px 44px rgba(6, 36, 28, 0.07) !important;
}

main nav.toc h2 {
  margin-top: 0 !important;
  color: var(--wp-green-950) !important;
  font-size: clamp(1.9rem, 3vw, 2.8rem) !important;
  line-height: 1.05 !important;
  letter-spacing: -0.045em !important;
  font-weight: 950 !important;
  border-bottom: 1px solid rgba(6, 36, 28, 0.11) !important;
}

main nav.toc ul {
  list-style: none !important;
  padding-left: 0 !important;
  margin: 1rem 0 0 !important;
  columns: 1 !important;
}

main nav.toc li {
  margin: 0.52rem 0 !important;
  color: var(--wp-soft) !important;
  break-inside: avoid !important;
}

main nav.toc a {
  color: var(--wp-green-700) !important;
  text-decoration: none !important;
  font-weight: 650 !important;
}

main nav.toc a:hover {
  color: var(--wp-green-950) !important;
  text-decoration: underline !important;
}

/* Tables */
main table,
main table.wp-table,
main table.micar {
  width: 100% !important;
  table-layout: fixed !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
  margin: 1rem 0 2rem !important;
  overflow: hidden !important;
  border-radius: 14px !important;
  border: 1px solid rgba(6, 36, 28, 0.14) !important;
  background: #ffffff !important;
  box-shadow: 0 14px 38px rgba(6, 36, 28, 0.045) !important;
}

main table caption,
main table.wp-table caption {
  text-align: left !important;
  font-weight: 700 !important;
  margin: 0.45rem 0 0.6rem !important;
  color: var(--wp-soft) !important;
}

main table thead th,
main table.wp-table thead th,
main table.micar thead th {
  color: #ffffff !important;
  background: linear-gradient(180deg, var(--wp-green-800) 0%, var(--wp-green-900) 100%) !important;
  border-color: rgba(255, 255, 255, 0.16) !important;
  font-weight: 850 !important;
}

main table thead tr,
main table.wp-table thead tr,
main table.micar thead tr {
  border-top: 0 !important;
}

main table td,
main table th,
main table.wp-table td,
main table.wp-table th,
main table.micar td,
main table.micar th {
  padding: 0.72rem 0.86rem !important;
  color: var(--wp-text) !important;
  background: #ffffff !important;
  border-right: 1px solid rgba(6, 36, 28, 0.10) !important;
  border-bottom: 1px solid rgba(6, 36, 28, 0.10) !important;
  vertical-align: top !important;
  line-height: 1.48 !important;
  overflow-wrap: anywhere !important;
  word-break: normal !important;
}

main table tr:nth-child(even) td,
main table.wp-table tr:nth-child(even) td,
main table.micar tr:nth-child(even) td {
  background: #f6faf4 !important;
}

main table td:first-child,
main table.wp-table td:first-child,
main table.micar td:first-child {
  color: #315247 !important;
  font-weight: 700 !important;
}

main td[bgcolor],
main th[bgcolor] {
  background: #f3f8f1 !important;
  color: var(--wp-soft) !important;
  font-weight: 750 !important;
}

main td table,
main ix\:nonNumeric table {
  margin: 0.75rem 0 !important;
  box-shadow: none !important;
  border-radius: 12px !important;
}

main table.micar col.col-nr,
main table.wp-table col.col-nr {
  width: 16rem !important;
}

main table.micar col.col-content,
main table.wp-table col.col-content {
  width: auto !important;
}

/* Inline-XBRL neutrality */
main ix\:nonNumeric,
main ix\:nonFraction,
main ix\:exclude {
  font: inherit !important;
  color: inherit !important;
  background: transparent !important;
}

main ix\:header,
main ix\:hidden,
main ix\:references,
main ix\:resources,
main div[style*="display:none"] {
  display: none !important;
}

/* Mobile */
@media (max-width: 760px) {
  main,
  main.container,
  body > .container {
    width: min(100% - 22px, 720px) !important;
    padding-top: 28px !important;
  }

  main.container > .light-section,
  main .light-section {
    padding: 22px !important;
    border-radius: 22px !important;
  }

  main .cover-page,
  main nav.toc,
  main .hero,
  main .hero-box,
  main .databox {
    border-radius: 20px !important;
  }

  main table,
  main table.wp-table,
  main table.micar {
    display: block !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
  }

  main table.micar col.col-nr,
  main table.wp-table col.col-nr {
    width: 11rem !important;
  }
}

/* Print */
@media print {
  @page {
    size: A4;
    margin: 12mm 12mm 14mm 12mm;
  }

  * {
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }

  html,
  body,
  main,
  main.container,
  body > .container,
  main.container > .light-section,
  main .light-section {
    background: #ffffff !important;
    color: #000000 !important;
    box-shadow: none !important;
    border: 0 !important;
    padding-top: 0 !important;
  }

  body::before,
  body::after,
  main.container > .light-section::before,
  main.container > .light-section::after,
  main .light-section::before,
  main .light-section::after {
    display: none !important;
    content: none !important;
  }

  header.xgr-site-header,
  footer.site-footer,
  footer.xgr-footer,
  body > footer {
    display: none !important;
  }

  main .cover-page,
  main nav.toc,
  main .hero,
  main .hero-box,
  main .databox {
    color: #000000 !important;
    background: #ffffff !important;
    border: 1px solid #000000 !important;
    box-shadow: none !important;
    page-break-inside: avoid !important;
  }

  main .cover-page h1,
  main .cover-page h2,
  main .cover-page p,
  main nav.toc h2,
  main nav.toc li,
  main nav.toc a,
  main p,
  main li,
  main td,
  main th {
    color: #000000 !important;
  }

  main h1,
  main h2,
  main h3 {
    break-after: avoid;
    page-break-after: avoid;
  }

  main h2.page-break,
  main .page-break {
    break-before: page;
    page-break-before: always;
  }

  main table,
  main table.wp-table,
  main table.micar {
    display: table !important;
    width: 100% !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    border-collapse: collapse !important;
    break-inside: auto;
    page-break-inside: auto;
  }

  main thead {
    display: table-header-group;
  }

  main tfoot {
    display: table-footer-group;
  }

  main tr,
  main th,
  main td {
    break-inside: avoid;
    page-break-inside: avoid;
  }

  main table thead th,
  main table.wp-table thead th,
  main table.micar thead th {
    color: #000000 !important;
    background: #eeeeee !important;
  }

  main table td,
  main table th,
  main table.wp-table td,
  main table.wp-table th,
  main table.micar td,
  main table.micar th {
    color: #000000 !important;
    background: #ffffff !important;
    border: 1px solid #b8b8b8 !important;
    padding: 4pt 6pt !important;
  }

  main table.micar col.col-nr {
    width: 10.5rem !important;
  }

  main table.micar col.col-field {
    width: 26% !important;
  }

  main table.micar col.col-content {
    width: auto !important;
  }

  main a[href]::after {
    content: "";
  }
}
