/* SGV-Dokumente – vollständig gekapselt gegen WWB/Bootstrap/GardenPortal */
html { scroll-behavior: smooth; }

.sgv-document,
.sgv-document * { box-sizing: border-box; }

.sgv-document {
  display: block !important;
  width: 100% !important;
  max-width: 1400px !important;
  margin: 0 auto !important;
  padding: 24px 28px 54px !important;
  background: transparent !important;
  color: #000 !important;
  font-family: Arial, Helvetica, sans-serif !important;
  font-size: 16px !important;
  line-height: 1.55 !important;
  text-align: left !important;
}

.sgv-document .sgv-document-header {
  display: block !important;
  width: 100% !important;
  margin: 0 0 24px !important;
  padding: 0 !important;
  text-align: center !important;
  font-size: 18px !important;
  line-height: 1.25 !important;
  font-weight: 700 !important;
  background: transparent !important;
}

.sgv-document .sgv-document-header img {
  display: block !important;
  width: auto !important;
  height: auto !important;
  max-width: 210px !important;
  max-height: 120px !important;
  margin: 0 auto 8px !important;
  padding: 0 !important;
  object-fit: contain !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

.sgv-document .sgv-document-main {
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

.sgv-document .sgv-document-title {
  display: block !important;
  width: 100% !important;
  margin: 22px 0 16px !important;
  padding: 0 !important;
  color: #000 !important;
  font: 700 18px/1.3 Arial, Helvetica, sans-serif !important;
  text-align: center !important;
  text-transform: none !important;
  letter-spacing: normal !important;
}

.sgv-document .sgv-heading-1 {
  display: block !important;
  width: 100% !important;
  margin: 22px 0 10px !important;
  padding: 0 !important;
  color: #000 !important;
  background: transparent !important;
  border: 0 !important;
  font: 700 16px/1.35 Arial, Helvetica, sans-serif !important;
  text-align: left !important;
  text-transform: none !important;
  letter-spacing: normal !important;
}

.sgv-document .sgv-heading-2 {
  display: block !important;
  width: 100% !important;
  margin: 18px 0 8px !important;
  padding: 0 !important;
  color: #000 !important;
  background: transparent !important;
  border: 0 !important;
  font: 700 14px/1.35 Arial, Helvetica, sans-serif !important;
  text-align: left !important;
}

.sgv-document .sgv-paragraph {
  display: block !important;
  width: 100% !important;
  margin: 0 0 12px !important;
  padding: 0 !important;
  color: #000 !important;
  font: 400 16px/1.55 Arial, Helvetica, sans-serif !important;
  text-align: left !important;
  text-indent: 0 !important;
}

.sgv-document .sgv-word-list {
  display: block !important;
  width: 100% !important;
  margin: 0 0 16px !important;
  padding: 0 !important;
  list-style: none !important;
  counter-reset: sgv-item !important;
}

.sgv-document .sgv-word-list > li {
  display: grid !important;
  grid-template-columns: 2.25em minmax(0, 1fr) !important;
  column-gap: .35em !important;
  width: 100% !important;
  margin: 7px 0 !important;
  padding: 0 !important;
  color: #000 !important;
  font: 400 16px/1.55 Arial, Helvetica, sans-serif !important;
  text-align: left !important;
  list-style: none !important;
  counter-increment: sgv-item !important;
}

.sgv-document .sgv-word-list > li::before {
  content: counter(sgv-item) "." !important;
  display: block !important;
  grid-column: 1 !important;
  text-align: right !important;
  font: inherit !important;
}

.sgv-document .sgv-word-list > li > .sgv-list-text {
  display: block !important;
  grid-column: 2 !important;
  min-width: 0 !important;
}

.sgv-document .sgv-table-wrap {
  display: block !important;
  width: 100% !important;
  overflow-x: auto !important;
  clear: both !important;
  margin: 20px 0 !important;
}

.sgv-document .sgv-table {
  width: 100% !important;
  margin: 0 !important;
  border-collapse: collapse !important;
  border-spacing: 0 !important;
  table-layout: auto !important;
  background: #fff !important;
  box-shadow: 5px 4px 10px rgba(0,0,0,.20) !important;
}

.sgv-document .sgv-table th,
.sgv-document .sgv-table td {
  height: auto !important;
  padding: 8px 10px !important;
  border: 2px solid #777 !important;
  color: #000 !important;
  font: 400 16px/1.45 Arial, Helvetica, sans-serif !important;
  text-align: left !important;
  vertical-align: top !important;
}

.sgv-document .sgv-table th {
  background: #e6e6e6 !important;
  font-weight: 700 !important;
}

.sgv-document .sgv-table tbody tr:nth-child(odd) td { background: #c8e1b5 !important; }
.sgv-document .sgv-table tbody tr:nth-child(even) td { background: #fff !important; }

.sgv-document .sgv-doc-image { display: block !important; margin: 18px 0 !important; }
.sgv-document .sgv-doc-image img {
  display: block !important;
  max-width: 100% !important;
  height: auto !important;
  border: 0 !important;
  filter: drop-shadow(5px 5px 8px rgba(0,0,0,.22)) !important;
}
.sgv-document .sgv-doc-image-links { float: left !important; max-width: 42% !important; margin: 8px 24px 16px 0 !important; }
.sgv-document .sgv-doc-image-rechts { float: right !important; max-width: 42% !important; margin: 8px 0 16px 24px !important; }
.sgv-document .sgv-doc-image-zentriert { clear: both !important; text-align: center !important; }
.sgv-document .sgv-doc-image-zentriert img { margin: 0 auto !important; }
.sgv-document .sgv-missing { padding: 12px !important; border: 2px dashed #b44 !important; background: #fff4f4 !important; color: #800 !important; }

.sgv-document .sgv-back-to-top {
  display: inline-block !important;
  clear: both !important;
  margin: 32px 0 0 !important;
  padding: 11px 18px !important;
  border: 0 !important;
  border-radius: 15px !important;
  color: #fff !important;
  background: linear-gradient(#4e8f3b,#315c3c) !important;
  box-shadow: 5px 4px 14px #d5d9d0 !important;
  font: 400 16px/1.2 Arial, Helvetica, sans-serif !important;
  text-decoration: none !important;
}

/* Button auch außerhalb der Konverter-Dokumente verwendbar */
.gp-back-to-top {
    display: inline-block !important;
    clear: both !important;
    margin: 32px 0 0 !important;
    padding: 11px 18px !important;
    border: 0 !important;
    border-radius: 15px !important;
    color: #fff !important;
    background: linear-gradient(#4e8f3b, #315c3c) !important;
    box-shadow: 5px 4px 14px #d5d9d0 !important;
    font: 400 16px/1.2 Arial, Helvetica, sans-serif !important;
    text-decoration: none !important;
}

@media (max-width:700px) {
  .sgv-document { padding: 18px 14px 42px !important; }
  .sgv-document .sgv-doc-image-links,
  .sgv-document .sgv-doc-image-rechts { float: none !important; max-width: 100% !important; margin: 18px 0 !important; }
  .sgv-document .sgv-document-header img { max-width: 170px !important; }
}

/* Word-Formatvorlagen: Einzüge aus SGV_Dokumente_Web.dotx
   340 Twips = 22,67 px bei 96 dpi. */
.sgv-document .sgv-paragraph.sgv-style-text-e1-1,
.sgv-document .sgv-paragraph.sgv-style-text-e2-1 {
  margin-left: 22.67px !important;
  width: calc(100% - 22.67px) !important;
}

.sgv-document .sgv-paragraph.sgv-style-text-e1-2,
.sgv-document .sgv-paragraph.sgv-style-text-e2-2,
.sgv-document .sgv-paragraph.sgv-style-text-e3-1 {
  margin-left: 45.33px !important;
  width: calc(100% - 45.33px) !important;
}

.sgv-document .sgv-paragraph.sgv-style-text-e1-3,
.sgv-document .sgv-paragraph.sgv-style-text-e3-2,
.sgv-document .sgv-paragraph.sgv-style-text-e4-1 {
  margin-left: 68.07px !important;
  width: calc(100% - 68.07px) !important;
}

/* Ziffer-E2: Word-Nummerierung links 700 Twips, hängend 360 Twips.
   Die Ziffer beginnt bei 340 Twips, der Text bei 700 Twips. */
.sgv-document .sgv-word-list.sgv-style-ziffer-e2 {
  margin-left: 22.67px !important;
  width: calc(100% - 22.67px) !important;
}

.sgv-document .sgv-word-list.sgv-style-ziffer-e2 > li {
  grid-template-columns: 24px minmax(0, 1fr) !important;
  column-gap: 0 !important;
}

/* Ziffer-E1 besitzt nahezu dieselbe erste Textebene. */
.sgv-document .sgv-word-list.sgv-style-ziffer-e1 {
  margin-left: 22.67px !important;
  width: calc(100% - 22.67px) !important;
}

.sgv-document .sgv-word-list.sgv-style-ziffer-e1 > li {
  grid-template-columns: 23.8px minmax(0, 1fr) !important;
  column-gap: 0 !important;
}

/* =========================================================
   SGV BILD-LIGHTBOX
   Wird dynamisch durch gp_document.js erzeugt
   ========================================================= */

.sgv-image-lightbox {
    position: fixed !important;
    inset: 0 !important;
    z-index: 2147483647 !important;

    display: flex;
    align-items: center;
    justify-content: center;

    width: 100vw !important;
    height: 100vh !important;

    padding: 24px;
    box-sizing: border-box;

    background: rgba(0, 0, 0, 0.88);
    cursor: zoom-out;
}

.sgv-image-lightbox[hidden] {
    display: none !important;
}

.sgv-image-lightbox > img {
    display: block;
    width: auto;
    height: auto;

    max-width: calc(100vw - 48px);
    max-height: calc(100vh - 48px);

    object-fit: contain;

    user-select: none;
    -webkit-user-select: none;
    -webkit-user-drag: none;

    transform-origin: center center;
}

