/* Shared sample-document viewer (partials/doc-viewer.blade.php, js/doc-viewer.js). Self-contained: every rule starts with .dv.
   The A4 sheets (.rp-sheet > .rp-frame > .rp-scale) are sized by --s, set on .dv by the script (fit to the column width).
   The pages scroll with the window; the contents card and the right column are sticky below the header (and the IMC bar). */
.dv-wrap { max-width: 1520px; margin: 0 auto; padding: 0 16px; }
@media (min-width: 1024px) { .dv-wrap { padding: 0 24px; } }
.dv { --dv-top: calc(var(--ec-header-h, 76px) + 16px); --s: .8; position: relative; display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; align-items: start; padding: 16px; border: 1px solid #D5EADF; border-radius: 24px; background: #EAF6EF; color: #101814; font-size: 14px; line-height: 1.4; }
html.imc-bar-on .dv { --dv-top: calc(var(--ec-header-h, 76px) + var(--imc-bar-h, 0px) + 16px); }
.dv *, .dv *::before, .dv *::after { box-sizing: border-box; }
.dv [hidden] { display: none !important; }
:where(.dv) :where(ol, ul, dl, p, h3, h4, dd, figure) { margin: 0; padding: 0; }
:where(.dv) :where(ol, ul) { list-style: none; }
:where(.dv) a { text-decoration: none; }
:where(.dv) button { font: inherit; cursor: pointer; }
.dv-sr { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.dv a:focus-visible, .dv button:focus-visible { outline: 2px solid #00744A; outline-offset: 2px; }

/* icons: masks, so they take the text colour */
.dv-i { display: inline-block; flex: none; width: 20px; height: 20px; background: currentColor; -webkit-mask: var(--ic) center / contain no-repeat; mask: var(--ic) center / contain no-repeat; }
.dv-i--download { --ic: url("../img/doc-viewer/ui-download.svg"); }
.dv-i--chev-up { --ic: url("../img/doc-viewer/ui-chev-up.svg"); }
.dv-i--chev-down { --ic: url("../img/doc-viewer/ui-chev-down.svg"); }
.dv-i--chev-right { --ic: url("../img/doc-viewer/ui-chev-right.svg"); }

/* contents card */
.dv-toc { display: flex; flex-direction: column; min-height: 0; border: 1px solid #DCE9E2; border-radius: 16px; background: #fff; box-shadow: 0 1px 2px rgba(16,24,20,.04), 0 14px 32px -18px rgba(16,24,20,.22); }
.dv-toc__h { display: flex; align-items: center; gap: 10px; padding: 18px 18px 12px; }
.dv-toc__t { font-size: 12.5px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: #3A4541; }
.dv-pill { margin-left: auto; padding: 4px 10px; border-radius: 999px; background: #EEF1EF; color: #4A5550; font-size: 12px; font-weight: 500; white-space: nowrap; }
.dv-toc__list { min-height: 0; overflow: auto; padding: 4px 12px 14px; overscroll-behavior: contain; scrollbar-width: thin; }
.dv-toc__list li { position: relative; }
.dv-toc__list li + li { margin-top: 4px; }
.dv-toc__list li:not(:last-child)::before { content: ""; position: absolute; left: 25px; top: 50%; width: 1.5px; height: calc(100% + 4px); margin-left: -.75px; background: #D5DED9; }
.dv-toc__list a { display: flex; align-items: center; gap: 12px; min-height: 56px; padding: 6px 12px 6px 10px; border: 1px solid transparent; border-radius: 14px; color: #1C2522; font-size: 14px; font-weight: 500; transition: background-color .15s ease, border-color .15s ease; }
.dv-toc__list a:hover { background: #F3F8F5; }
.dv-num { position: relative; z-index: 1; flex: none; display: grid; place-items: center; width: 28px; height: 28px; border: 1.5px solid #B9C4BF; border-radius: 50%; background: #fff; color: #4A5550; font-size: 13px; font-weight: 600; font-variant-numeric: tabular-nums; }
.dv-ico { flex: none; display: grid; place-items: center; width: 36px; height: 36px; border-radius: 50%; background: #EAF6EF; }
.dv-ico img { display: block; width: 20px; height: 20px; }
.dv-ttl { flex: 1; min-width: 0; line-height: 1.3; }
.dv-chev { width: 16px; height: 16px; color: #8A9690; }
.dv-toc__list a.is-on { border-color: #BFEBD5; background: #E9F8F0; }
.dv-toc__list a.is-on .dv-num { border-color: #00744A; background: #00744A; color: #fff; }
.dv-toc__list a.is-on .dv-ttl { color: #00744A; font-weight: 700; }
.dv-toc__list a.is-on .dv-chev { color: #00744A; }
.dv-toc__dl { display: none; }

/* the pages: normal flow, centred on the calm mint surface */
.dv-doc { min-width: 0; }
.dv-pages { display: grid; gap: 24px; justify-content: center; align-content: start; }
.dv .rp-sheet { width: calc(794px * var(--s)); max-width: none; margin: 0; scroll-margin-top: var(--dv-top); }
.dv .rp-frame { width: 100%; aspect-ratio: auto; overflow: hidden; border-radius: 4px; background: #fff; box-shadow: 0 0 0 1px rgba(16,24,20,.07), 0 10px 30px -10px rgba(16,24,20,.28); }
.dv .rp-scale { width: 794px; height: auto; transform: none; zoom: var(--s); }
.dv .rp-pages .sr-cols { grid-template-columns: 1fr 1fr; }
/* numbered annotations that some pages carry under the sheet */
.dv .rp-notes { margin-top: 10px; padding: 16px 18px; border-radius: 8px; background: #17201C; color: #C9D6CF; font-size: 13px; line-height: 1.45; }
.dv .rp-notes > p { margin-bottom: 10px; color: #6FE7B5; font-size: 12px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; }
.dv .rp-notes ol { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 16px; }
.dv .rp-notes li { display: grid; grid-template-columns: 24px 1fr; gap: 10px; }
.dv .rp-notes li > span { display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: #00B26B; color: #04150D; font-size: 12px; font-weight: 700; }
.dv .rp-notes b { display: block; color: #fff; font-size: 13.5px; }

/* right column */
.dv-side { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.dv-toc, .dv-side { scrollbar-width: thin; }
.dv-side > * { flex: none; }
.dv-card1, .dv-inside, .dv-now, .dv-get { border: 1px solid #DCE9E2; background: #fff; box-shadow: 0 1px 2px rgba(16,24,20,.04), 0 14px 32px -18px rgba(16,24,20,.22); }
.dv-card1 { border-radius: 16px; overflow: hidden; }
.dv-card1 .dv-now, .dv-card1 .dv-get { border: 0; border-radius: 0; box-shadow: none; }
.dv-now, .dv-get { padding: 20px; }
.dv-get { padding-top: 0; }
.dv-now__row { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.dv-now__n { font-size: 40px; line-height: 1.1; font-weight: 400; color: #5E6B65; font-variant-numeric: tabular-nums; letter-spacing: -.02em; }
.dv-now__n b { font-weight: 700; color: #101814; }
.dv-nav { display: flex; gap: 8px; }
.dv-round { display: grid; place-items: center; width: 40px; height: 40px; padding: 0; border: 1px solid #D4DED9; border-radius: 50%; background: #fff; color: #101814; transition: background-color .15s ease, border-color .15s ease; }
.dv-round:hover:not([aria-disabled="true"]) { background: #E9F8F0; border-color: #00744A; }
.dv-round[aria-disabled="true"] { opacity: .35; cursor: default; }
.dv-now__t { margin-top: 6px; min-height: 1.4em; font-size: 16px; font-weight: 600; color: #101814; }
.dv-prog { height: 4px; margin-top: 14px; overflow: hidden; border-radius: 4px; background: #E4ECE8; }
.dv-prog i { display: block; width: calc(var(--n, 0) * 100%); height: 100%; border-radius: 4px; background: #00B26B; transition: width .3s ease; }
.dv-pdf { display: flex; align-items: center; justify-content: center; gap: 10px; width: 100%; min-height: 52px; padding: 0 14px; border-radius: 14px; background: #0B0F0D; color: #fff; font-size: 15px; font-weight: 600; transition: background-color .15s ease; }
.dv-pdf:hover { background: #1C2823; }
.dv-pdf__ic { display: grid; place-items: center; flex: none; width: 28px; height: 28px; border-radius: 50%; background: #00B26B; color: #04150D; }
.dv-pdf__ic .dv-i { width: 16px; height: 16px; }
.dv-note { margin-top: 8px; color: #55615B; font-size: 13px; text-align: center; }
.dv-req { display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; min-height: 52px; margin-top: 12px; padding: 0 14px; border-radius: 14px; background: #00B26B; color: #04150D; font-size: 15px; font-weight: 600; transition: background-color .15s ease; }
.dv-req:hover { background: #00C978; }
.dv-inside { padding: 20px; border-radius: 16px; }
.dv-inside__h { display: flex; align-items: center; gap: 10px; font-size: 16px; font-weight: 600; line-height: 1.3; color: #101814; }
.dv-inside__h img { flex: none; width: 20px; height: 20px; }
.dv-check { display: grid; gap: 12px; margin-top: 16px; padding-bottom: 18px; border-bottom: 1px solid #E4ECE8; }
.dv-check li { position: relative; padding-left: 32px; color: #2B3531; font-size: 14px; line-height: 1.45; }
.dv-check li::before { content: ""; position: absolute; left: 0; top: -1px; width: 22px; height: 22px; border-radius: 50%; background: #DDF4E8; }
.dv-check li::after { content: ""; position: absolute; left: 5px; top: 4px; width: 12px; height: 12px; background: #00744A; -webkit-mask: url("../img/doc-viewer/ui-check.svg") center / contain no-repeat; mask: url("../img/doc-viewer/ui-check.svg") center / contain no-repeat; }
.dv-det__h { margin-top: 16px; font-size: 14px; font-weight: 600; color: #101814; }
.dv-det { margin-top: 10px; display: grid; gap: 8px; }
.dv-det div { display: flex; justify-content: space-between; gap: 12px; font-size: 14px; }
.dv-det dt { color: #55615B; }
.dv-det dd { font-weight: 600; color: #101814; }

/* >= 1024: contents | pages | side; both side columns are sticky and capped to the viewport */
@media (min-width: 1024px) {
  .dv { grid-template-columns: 240px minmax(0, 1fr) 240px; gap: 16px; }
  .dv-toc, .dv-side { align-self: start; position: sticky; top: var(--dv-top); max-height: calc(100vh - var(--dv-top) - 16px); }
  .dv-side { overflow: auto; padding: 4px; margin: -4px; }
  .dv-toc__h { padding: 14px 14px 8px; flex-wrap: wrap; }
  .dv-pill { margin-left: 0; }
  .dv-ico, .dv-chev { display: none; }
  .dv-toc__list a { min-height: 48px; }
}
@media (min-width: 1280px) {
  .dv { grid-template-columns: 300px minmax(0, 1fr) 260px; gap: 20px; padding: 16px; }
  .dv-toc__h { flex-wrap: nowrap; padding: 18px 18px 12px; }
  .dv-pill { margin-left: auto; }
  .dv-ico, .dv-chev { display: grid; }
  .dv-toc__list a { min-height: 56px; }
}
@media (min-width: 1440px) {
  .dv { grid-template-columns: 320px minmax(0, 1fr) 280px; }
}
/* < 1024: counter card, sticky chip row, pages, then the actions and details */
@media (max-width: 1023.98px) {
  .dv { --dv-top: var(--ec-header-h, 64px); --dv-chip-h: 60px; display: flex; flex-direction: column; align-items: stretch; padding: 12px; border-radius: 20px; }
  html.imc-bar-on .dv { --dv-top: calc(var(--ec-header-h, 64px) + var(--imc-bar-h, 0px)); }
  .dv > *, .dv-side > *, .dv-card1 > * { min-width: 0; }
  .dv-side, .dv-card1 { display: contents; }
  .dv-now, .dv-get, .dv-inside { border-radius: 16px; }
  .dv-now { order: 1; }
  .dv-toc { order: 2; position: sticky; top: var(--dv-top); z-index: 6; height: var(--dv-chip-h); justify-content: center; margin: 0 -12px; padding: 0 12px; border: 0; border-radius: 0; background: #EAF6EF; box-shadow: none; }
  .dv-doc { order: 3; }
  .dv-get { order: 4; padding-top: 20px; }
  .dv-inside { order: 5; }
  .dv .rp-sheet { scroll-margin-top: calc(var(--dv-top) + var(--dv-chip-h) + 8px); }
  .dv-toc__h, .dv-ico, .dv-chev { display: none; }
  .dv-toc__list { display: flex; gap: 8px; padding: 0; }
  .dv-toc__list li { flex: none; }
  .dv-toc__list li + li { margin-top: 0; }
  .dv-toc__list li:not(:last-child)::before { display: none; }
  .dv-toc__list a { min-height: 44px; gap: 8px; padding: 0 14px 0 8px; border-color: #D4DED9; border-radius: 999px; background: #fff; white-space: nowrap; }
  .dv-toc__list a.is-on { border-color: #00744A; background: #E9F8F0; }
  .dv-toc__dl { display: block; }
  .dv-toc__dl a { padding: 0 14px; border-color: #0B0F0D; background: #0B0F0D; color: #fff; }
  .dv-toc__dl a:hover { background: #1C2823; }
  .dv-now__n { font-size: 32px; }
}

@media (prefers-reduced-motion: reduce) {
  .dv *, .dv *::before, .dv *::after { transition: none !important; }
}

/* print: the pages one per sheet, none of the viewer chrome */
@media print {
  .dv-wrap { max-width: none; padding: 0; }
  .dv { --s: 1 !important; display: block; padding: 0; border: 0; border-radius: 0; background: none; }
  .dv-toc, .dv-side, .dv-sr { display: none !important; }
  .dv-pages { display: block; }
  .dv .rp-sheet { width: 794px; }
  .dv .rp-frame { border-radius: 0; box-shadow: none; }
}

/* Contents gets the room (section names on one or two lines); the download label stays on one line */
@media (min-width: 1024px) { .dv-chev { display: none !important; } .dv-pdf { white-space: nowrap; } }
@media (min-width: 1024px) { .dv-req { white-space: nowrap; font-size: 15px; padding: 0 10px; } }

/* Right column: compact enough to fit one screen height, never scrolls on its own (>= 1024px) */
@media (min-width: 1024px) {
  .dv-side { max-height: none; overflow: visible; gap: 12px; }
  .dv-now, .dv-get { padding: 16px; }
  .dv-get { padding-top: 0; }
  .dv-now__n { font-size: 32px; }
  .dv-round { width: 34px; height: 34px; }
  .dv-now__t { margin-top: 4px; font-size: 15px; line-height: 1.35; }
  .dv-prog { margin-top: 10px; }
  .dv-pdf, .dv-req { min-height: 44px; border-radius: 12px; }
  .dv-req { margin-top: 10px; }
  .dv-note { margin-top: 6px; font-size: 12.5px; }
  .dv-inside { padding: 16px; }
  .dv-inside__h { font-size: 15px; }
  .dv-check { gap: 7px; margin-top: 12px; padding-bottom: 12px; }
  .dv-check li { padding-left: 28px; font-size: 13.5px; line-height: 1.4; }
  .dv-check li::before { top: 0; width: 20px; height: 20px; }
  .dv-check li::after { left: 4px; top: 4px; }
  .dv-det__h { margin-top: 12px; font-size: 13.5px; }
  .dv-det { margin-top: 6px; gap: 4px; }
  .dv-det div { font-size: 13.5px; }
}
/* Shorter screens: drop the document details so the rest still fits without scrolling */
@media (min-width: 1024px) and (max-height: 820px) {
  .dv-det__h, .dv-det { display: none; }
  .dv-check { padding-bottom: 0; border-bottom: 0; }
}
@media (min-width: 1024px) and (max-height: 700px) {
  .dv-now { padding-bottom: 12px; }
  .dv-now__n { font-size: 28px; }
  .dv-note { display: none; }
  .dv-req { margin-top: 8px; }
  .dv-check { gap: 5px; margin-top: 10px; }
  .dv-check li { font-size: 13px; line-height: 1.35; }
}

/* "ILLUSTRATIVE SAMPLE" watermark behind the content of every page (generated content: no alt text, not selectable, no clicks) */
.dv .sr-page { isolation: isolate; }
.dv .sr-page::before { content: "ILLUSTRATIVE SAMPLE" / ""; position: absolute; z-index: -1; left: 50%; top: 50%; transform: translate(-50%, -50%) rotate(-30deg); white-space: nowrap; font-size: 62px; font-weight: 700; letter-spacing: .04em; line-height: 1; color: #7A5200; opacity: .08; pointer-events: none; user-select: none; -webkit-user-select: none; }
.dv .sr-cover::before { color: #fff; opacity: .06; }

/* Contents: never scrolls on its own; rows tighten on shorter screens so all sections fit one screen height */
@media (min-width: 1024px) {
  .dv-toc, .dv-toc__list { max-height: none; overflow: visible; }
  .dv-toc__list { flex: none; }
}
@media (min-width: 1024px) and (max-height: 900px) {
  .dv-toc__h { padding: 12px 16px 8px; }
  .dv-toc__list { padding-bottom: 10px; }
  .dv-toc__list li + li { margin-top: 2px; }
  .dv-toc__list a { min-height: 44px; padding-block: 4px; }
  .dv-ico { display: none !important; }
}
@media (min-width: 1024px) and (max-height: 720px) {
  .dv-toc__list a { min-height: 38px; padding-block: 3px; font-size: 13.5px; line-height: 1.3; }
  .dv-num { width: 26px; height: 26px; font-size: 12px; }
  .dv-toc__list li:not(:last-child)::before { left: 23px; }
}
/* the last section row has no connector line (the hidden phone-only download row comes after it) */
@media (min-width: 1024px) { .dv-toc__list li:has(+ .dv-toc__dl)::before { display: none; } }

/* "Download sample PDF": the arrow in the green circle is white */
.dv-pdf__ic { color: #fff; }