/* ==========================================================================
   FileLu document viewer (PDF, Word, Excel / CSV, PowerPoint). Used by the My Files preview window and by the Download page.
   Loaded together with assets/js/docview.js. Dark frame like the My Files preview, white paper.
   Every class starts with fdv- so nothing here can touch the rest of the page.
   ========================================================================== */
.fdv {
  --bg: #0e0e10; --bar: #17171a; --line: #26262b; --text: #ecece8; --muted: #9a9aa2; --field: #0b0b0d;
  --accent: var(--bs-primary, #2f7df6); --accent-ink: #fff; --accent-text: #8bb8ff; --accent-soft: rgba(47, 125, 246, .2);
  --hit: rgba(255, 213, 79, .55); --hit-cur: rgba(255, 140, 0, .85); --desk: #1b1c20;
  --font: var(--bs-body-font-family, "Plus Jakarta Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif);
  --mono: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;
  position: relative; display: grid; grid-template-rows: auto auto minmax(0, 1fr); width: 100%; height: 100%; min-height: 0;
  background: var(--bg); color: var(--text); font: 14px/1.45 var(--font); overflow: hidden; border-radius: inherit;
  -webkit-tap-highlight-color: transparent;
}
.fdv, .fdv * { box-sizing: border-box; }
.fdv [hidden] { display: none !important; }
:where(.fdv) button { background: none; border: 0; padding: 0; margin: 0; font: inherit; color: inherit; cursor: pointer; }
.fdv a, .fdv a:hover, .fdv a:focus { color: inherit; text-decoration: none; }
.fdv-i { width: 1.25em; height: 1.25em; stroke: currentColor; fill: none; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; flex: none; vertical-align: -.25em; }

/* ---- tool bar ---- */
.fdv-bar { grid-row: 1; display: flex; align-items: center; gap: 4px; padding: 7px 10px; background: var(--bar); border-bottom: 1px solid var(--line); min-width: 0; position: relative; z-index: 6; }
.fdv-sp { flex: 1; min-width: 4px; }
.fdv-b { min-width: 34px; height: 34px; padding: 0 8px; border-radius: 9px; display: inline-flex; align-items: center; justify-content: center; gap: 6px; color: #d7d7dc; transition: background .15s; flex: none; }
.fdv-b:hover { background: rgba(255, 255, 255, .09); }
.fdv-b.on { background: var(--accent); color: var(--accent-ink); }
.fdv-b:disabled { opacity: .35; cursor: default; }
.fdv-b:focus-visible, .fdv-view:focus-visible, .fdv-pgin:focus-visible, .fdv-find input:focus-visible { outline: 2px solid var(--accent-text); outline-offset: 1px; }
.fdv-pgnav { display: inline-flex; align-items: center; gap: 6px; color: var(--muted); font: 600 13px var(--mono); white-space: nowrap; }
.fdv-pgin { width: 46px; height: 30px; text-align: center; background: var(--field); border: 1px solid var(--line); border-radius: 8px; color: var(--text); font: 600 13px var(--mono); padding: 0 4px; }
.fdv-zoom { display: inline-flex; align-items: center; gap: 2px; position: relative; }
.fdv-zl { min-width: 62px; font: 600 13px var(--mono); }
.fdv-zmenu { position: absolute; top: 100%; inset-inline-end: 0; margin-top: 6px; min-width: 150px; padding: 5px; background: #1c1d21; border: 1px solid #2f3036; border-radius: 12px; box-shadow: 0 18px 50px rgba(0, 0, 0, .6); z-index: 12; display: grid; }
.fdv-zmenu button { text-align: start; padding: 8px 12px; border-radius: 8px; font-size: 13.5px; color: #e4e4e8; display: flex; justify-content: space-between; gap: 18px; }
.fdv-zmenu button:hover { background: rgba(255, 255, 255, .09); }
.fdv-zmenu button.cur { color: var(--accent-text); }
.fdv-zmenu hr { border: 0; border-top: 1px solid #2f3036; margin: 4px 2px; }
.fdv-extra { display: inline-flex; gap: 4px; align-items: center; }

/* ---- find ---- */
.fdv-find { grid-row: 2; display: flex; align-items: center; gap: 4px; padding: 7px 10px; background: #131316; border-bottom: 1px solid var(--line); }
.fdv-find input { flex: 1; min-width: 0; max-width: 360px; height: 32px; background: var(--field); border: 1px solid var(--line); border-radius: 9px; padding: 0 12px; color: var(--text); font: 14px var(--font); }
.fdv-cnt { color: var(--muted); font: 600 12.5px var(--mono); white-space: nowrap; padding: 0 6px; min-width: 72px; }

/* ---- main ---- */
.fdv-main { grid-row: 3; display: grid; grid-template-columns: auto minmax(0, 1fr); grid-template-rows: minmax(0, 1fr); min-height: 0; position: relative; }
.fdv-side { width: 0; overflow: hidden; background: #131316; border-inline-end: 1px solid var(--line); transition: width .18s; }
.fdv.side .fdv-side { width: 156px; overflow-y: auto; overscroll-behavior: contain; }
.fdv-th { display: grid; gap: 5px; justify-items: center; padding: 12px 10px 4px; cursor: pointer; color: var(--muted); font: 600 11.5px var(--mono); }
.fdv-th .box { width: 116px; background: #fff; border-radius: 3px; outline: 2px solid transparent; outline-offset: 2px; overflow: hidden; display: block; box-shadow: 0 2px 8px rgba(0, 0, 0, .5); }
.fdv-th canvas { display: block; width: 100%; height: 100%; }
.fdv-th:hover .box { outline-color: rgba(255, 255, 255, .25); }
.fdv-th.cur .box { outline-color: var(--accent); }
.fdv-th.cur { color: var(--accent-text); }
.fdv-view { position: relative; overflow: auto; background: var(--desk); min-width: 0; min-height: 0; outline: 0; overscroll-behavior: contain; }

/* ---- PDF pages ---- */
.fdv-pages { width: max-content; min-width: 100%; padding: 16px 16px 4px; }
.fdv-pg { position: relative; margin: 0 auto 12px; background: #fff; box-shadow: 0 4px 24px rgba(0, 0, 0, .55); overflow: hidden; }
.fdv-pg > canvas { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.fdv-pg::after { content: attr(data-n); position: absolute; inset: 0; display: grid; place-items: center; color: #d5d6dc; font: 700 48px var(--font); pointer-events: none; z-index: 0; }
.fdv-pg.ok::after { display: none; }
/* the invisible, selectable text over the page: these rules follow how pdf.js sizes and places its text pieces */
.fdv-tl { position: absolute; text-align: initial; inset: 0; overflow: clip; opacity: 1; line-height: 1; letter-spacing: normal; word-spacing: normal; text-size-adjust: none; forced-color-adjust: none; transform-origin: 0 0; z-index: 1; color-scheme: only light;
  --min-font-size: 1; --text-scale-factor: calc(var(--total-scale-factor) * var(--min-font-size)); --min-font-size-inv: calc(1 / var(--min-font-size)); }
.fdv-tl :is(span, br) { color: transparent; position: absolute; white-space: pre; cursor: text; transform-origin: 0 0; user-select: text; }
.fdv-tl > :not(.markedContent), .fdv-tl .markedContent span:not(.markedContent) { z-index: 1; --font-height: 0; font-size: calc(var(--text-scale-factor) * var(--font-height)); --scale-x: 1; --rotate: 0deg; transform: rotate(var(--rotate)) scaleX(var(--scale-x)) scale(var(--min-font-size-inv)); }
.fdv-tl .markedContent { display: contents; }
.fdv-tl span[role="img"] { user-select: none; cursor: default; }
.fdv-tl ::selection { background: rgba(47, 125, 246, .35); color: transparent; }
.fdv-tl .fdv-hit { background: var(--hit); color: transparent; border-radius: 2px; }
.fdv-tl .fdv-hit.cur { background: var(--hit-cur); }
.fdv-lk { position: absolute; inset: 0; z-index: 2; pointer-events: none; }
.fdv-lk a { position: absolute; display: block; pointer-events: auto; cursor: pointer; border-radius: 2px; }
.fdv-lk a:hover { background: rgba(47, 125, 246, .18); outline: 1px solid rgba(47, 125, 246, .5); }

/* ---- Word ---- */
.fdv-frame { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; background: var(--desk); display: block; }

/* ---- Excel / CSV ---- */
.fdv-xl { position: absolute; inset: 0; display: grid; grid-template-rows: auto minmax(0, 1fr) auto; background: #fff; color: #1f2328; }
.fdv-fx { display: flex; align-items: center; gap: 0; border-bottom: 1px solid #d8dbe0; background: #f6f7f9; font: 13px var(--font); min-height: 34px; }
.fdv-fx .nm { width: 78px; flex: none; text-align: center; font: 600 12.5px var(--mono); color: #4a5058; border-inline-end: 1px solid #d8dbe0; padding: 8px 4px; }
.fdv-fx .fv { flex: 1; min-width: 0; padding: 8px 12px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font: 13px var(--mono); color: #1f2328; }
.fdv-grid-wrap { overflow: auto; position: relative; min-height: 0; background: #fff; overscroll-behavior: contain; outline: 0; }
.fdv-grid { border-collapse: separate; border-spacing: 0; table-layout: fixed; font: 13px/1.2 var(--font); color: #1f2328; }
.fdv-grid th, .fdv-grid td { border-inline-end: 1px solid #e3e5e9; border-bottom: 1px solid #e3e5e9; padding: 0 8px; height: 26px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; background: #fff; }
.fdv-grid thead th { position: sticky; top: 0; z-index: 3; background: #f1f3f5; color: #5a616a; font: 600 12px var(--mono); text-align: center; height: 26px; }
.fdv-grid tbody th { position: sticky; inset-inline-start: 0; z-index: 2; background: #f1f3f5; color: #5a616a; font: 600 11.5px var(--mono); text-align: center; padding: 0 4px; }
.fdv-grid thead th:first-child { inset-inline-start: 0; z-index: 4; }
.fdv-grid td.n { text-align: end; font-variant-numeric: tabular-nums; }
.fdv-grid td.b { text-align: center; }
.fdv-grid td.sel { outline: 2px solid var(--accent); outline-offset: -2px; z-index: 1; position: relative; }
.fdv-grid td.hit { background: #fff1b8; }
.fdv-grid td.hit.cur { background: #ffc766; }
.fdv-grid tr.more td { text-align: center; color: #6b727b; background: #fafbfc; height: 38px; }
.fdv-tabs { display: flex; gap: 2px; padding: 5px 8px; background: #f1f3f5; border-top: 1px solid #d8dbe0; overflow-x: auto; scrollbar-width: thin; }
.fdv-tabs button { padding: 6px 14px; border-radius: 8px; font: 600 12.5px var(--font); color: #4a5058; white-space: nowrap; }
.fdv-tabs button:hover { background: #e4e7eb; }
.fdv-tabs button.cur { background: #fff; color: #1a56db; box-shadow: 0 1px 3px rgba(0, 0, 0, .18); }
.fdv-xz { transform-origin: 0 0; }

/* ---- text and code ---- */
.fdv-txt { position: absolute; inset: 0; overflow: auto; background: #0e0e10; display: grid; grid-template-columns: auto minmax(0, 1fr); grid-auto-rows: max-content; align-content: start; font: 13px/1.65 var(--mono); color: #d7d7db; outline: 0; }
.fdv-txt .gut { padding: 16px 12px 16px 16px; text-align: end; color: #5d5d66; user-select: none; border-inline-end: 1px solid #1e1e22; background: #0b0b0d; white-space: pre; position: sticky; inset-inline-start: 0; }
.fdv-txt pre { margin: 0; padding: 16px 20px; white-space: pre; font: inherit; color: inherit; background: none; border: 0; overflow: visible; }
.fdv-txt .cut { grid-column: 1 / -1; padding: 14px 20px; color: #9a9aa2; font: 13px var(--font); border-top: 1px solid #1e1e22; }
.fdv-txt mark.fdv-hit { background: var(--hit); color: #111; border-radius: 2px; }
.fdv-txt mark.fdv-hit.cur { background: var(--hit-cur); }

/* ---- PowerPoint slides (drawn by docview-pptx.js, in the slide's own pixel size and scaled to fit) ---- */
.fdv-slw { position: relative; margin: 0 auto 12px; background: #fff; box-shadow: 0 4px 24px rgba(0, 0, 0, .55); overflow: hidden; flex: none; }
.fdv-slw::after { content: attr(data-n); position: absolute; inset: 0; display: grid; place-items: center; color: #d5d6dc; font: 700 48px var(--font); pointer-events: none; }
.fdv-slw.ok::after { display: none; }
.fdv-sl { position: absolute; left: 0; top: 0; transform-origin: 0 0; overflow: hidden; font-family: "Segoe UI", Arial, sans-serif; line-height: 1.2; color: #000; }
.fdv-sl .lay { position: absolute; inset: 0; }
.fdv-sl .sh, .fdv-sl .pic, .fdv-sl .grp, .fdv-sl .tblw, .fdv-sl .miss { box-sizing: border-box; }
.fdv-sl .sh > svg.g { position: absolute; left: 0; top: 0; overflow: visible; }
.fdv-sl .tx { position: absolute; inset: 0; display: flex; flex-direction: column; box-sizing: border-box; white-space: pre-wrap; overflow-wrap: break-word; }
.fdv-sl .p { margin: 0; min-height: 1em; }
.fdv-sl .p[data-b]::before { content: attr(data-b); display: inline-block; min-width: var(--bw); text-indent: 0; color: var(--bc); font-size: var(--bs); }
.fdv-sl a { color: inherit; }
.fdv-sl .pic { overflow: hidden; }
.fdv-sl .miss { background: #eceef2; color: #6b7280; display: grid; place-items: center; font: 600 14px "Segoe UI", Arial, sans-serif; text-align: center; padding: 8px; }
.fdv-sl .tblw table { border-collapse: collapse; table-layout: fixed; }
.fdv-sl .tblw td { overflow: hidden; }
.fdv-sl .tblw .tx { position: static; }
.fdv-sl .tblw .bold span { font-weight: 700; }
.fdv-sl mark.fdv-hit { background: var(--hit); color: inherit; border-radius: 2px; }
.fdv-sl mark.fdv-hit.cur { background: var(--hit-cur); }
.fdv-th .box .fdv-sl { pointer-events: none; }

/* ---- night reading (inverts the paper, not the frame) ---- */
.fdv.night .fdv-pg > canvas, .fdv.night .fdv-frame, .fdv.night .fdv-xl, .fdv.night .fdv-sl { filter: invert(.9) hue-rotate(180deg); }

/* ---- loading, errors, password ---- */
.fdv-cover { position: absolute; inset: 0; z-index: 10; display: grid; place-items: center; align-content: center; gap: 14px; padding: 30px; background: var(--bg); text-align: center; color: #b4b4ba; transition: opacity .25s; }
.fdv-cover.gone { opacity: 0; pointer-events: none; }
.fdv-skel { width: min(80vw, 520px); display: grid; gap: 11px; }
.fdv-skel i { height: 12px; border-radius: 7px; background: linear-gradient(90deg, #1b1c20, #26272c, #1b1c20); background-size: 200% 100%; animation: fdv-sk 1.2s infinite; }
.fdv-skel i:nth-child(3n) { width: 70%; } .fdv-skel i:nth-child(4n) { width: 88%; }
@keyframes fdv-sk { to { background-position: -200% 0; } }
.fdv-prog { width: min(60vw, 280px); height: 4px; border-radius: 4px; background: #26272c; overflow: hidden; }
.fdv-prog i { display: block; height: 100%; width: 0; background: var(--accent); transition: width .15s; }
.fdv-prog.ind i { width: 40%; animation: fdv-ind 1.1s infinite ease-in-out; }
@keyframes fdv-ind { 0% { margin-inline-start: -40%; } 100% { margin-inline-start: 100%; } }
.fdv-msg { width: min(100%, 440px); display: grid; gap: 12px; justify-items: center; padding: 30px 26px; border: 1px solid rgba(255, 255, 255, .1); background: rgba(18, 18, 20, .85); border-radius: 20px; }
.fdv-msg .ic { width: 72px; height: 72px; border-radius: 20px; background: #1e1f24; display: grid; place-items: center; color: #cfcfd6; }
.fdv-msg .ic .fdv-i { width: 34px; height: 34px; }
.fdv-msg h3 { margin: 0; font-size: 19px; font-weight: 700; color: #fff; letter-spacing: -.01em; }
.fdv-msg p { margin: 0; color: #a9a9b0; font-size: 14px; word-break: break-word; }
.fdv-msg small { opacity: .8; font-size: 12.5px; }
.fdv-msg .a { display: flex; gap: 8px; flex-wrap: wrap; justify-content: center; margin-top: 4px; }
.fdv-msg input { width: 100%; height: 40px; background: var(--field); border: 1px solid var(--line); border-radius: 10px; padding: 0 14px; color: var(--text); font: 15px var(--font); }
.fdv-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 40px; padding: 0 18px; border-radius: 11px; background: rgba(255, 255, 255, .09); border: 1px solid rgba(255, 255, 255, .1); color: #f1f1f4; font-weight: 600; font-size: 14px; }
.fdv-btn:hover { background: rgba(255, 255, 255, .16); }
.fdv-btn.pri { background: var(--accent); color: var(--accent-ink); border-color: transparent; }
.fdv-btn.pri:hover { filter: brightness(1.1); }

/* ---- full-screen window (used by the Download page) ---- */
.fdv-ov { position: fixed; inset: 0; z-index: 2000; display: grid; grid-template-rows: auto minmax(0, 1fr); background: #050506; animation: fdv-in .2s ease-out; font: 14px/1.45 var(--bs-body-font-family, "Plus Jakarta Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif); color: #ecece8; }
.fdv-ov, .fdv-ov * { box-sizing: border-box; }
@keyframes fdv-in { from { opacity: 0; transform: scale(.985); } to { opacity: 1; transform: none; } }
.fdv-ov-top { display: flex; align-items: center; gap: 10px; padding: 10px 14px; }
.fdv-ov-top b { flex: 1; min-width: 0; font-size: 15px; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fdv-ov-top .fdv-b { background: rgba(255, 255, 255, .07); border: 1px solid rgba(255, 255, 255, .09); height: 38px; min-width: 38px; border-radius: 12px; color: #ecece8; }
.fdv-ov-top .fdv-b:hover { background: rgba(255, 255, 255, .14); }
.fdv-ov-body { padding: 0 14px 14px; min-height: 0; }
.fdv-ov .fdv { border-radius: 14px; box-shadow: 0 30px 80px rgba(0, 0, 0, .65), 0 0 0 1px rgba(255, 255, 255, .08); }
html.fdv-lock { overflow: hidden; }

/* ---- phones ---- */
@media (max-width: 700px) {
  .fdv-bar { gap: 2px; padding: 6px 6px; }
  .fdv-b { min-width: 36px; height: 36px; }
  .fdv-zl { min-width: 50px; }
  /* in a page the window is narrower than the screen: keep what a thumb needs (zoom menu, search, night, full screen) */
  .fdv.inline [data-a="zout"], .fdv.inline [data-a="zin"], .fdv.inline [data-a="side"] { display: none; }
  .fdv-pages { padding: 8px 4px 2px; }
  .fdv-pg { margin-bottom: 8px; }
  .fdv.side .fdv-side { position: absolute; inset-block: 0; inset-inline-start: 0; z-index: 5; width: 150px; box-shadow: 8px 0 30px rgba(0, 0, 0, .5); }
  .fdv-find { flex-wrap: wrap; }
  .fdv-find input { max-width: none; }
  .fdv-ov-top { padding: 8px 8px; }
  .fdv-ov-body { padding: 0 6px 8px; }
  .fdv-ov .fdv { border-radius: 10px; }
}
@media (prefers-reduced-motion: reduce) { .fdv *, .fdv-ov { animation: none !important; transition: none !important; } }