/* Word, Excel and PowerPoint files in Drive's viewer (pages/drive-office.js).
   The phone draws the same: components/drive/OfficeView.tsx. The stage is the
   viewer's dark one (.dv-stage); the paper, the table and the slides are
   white whatever the theme — a document looks like itself. */

/* ---- doc: a page that scrolls */
.dvo-doc { overflow-y: auto; padding: 16px 12px 28px; display: flex; flex-direction: column; align-items: center; }
.dvo-paper {
  width: min(100%, 820px); background: #fff; color: #1C1C1E; border-radius: 10px; padding: 26px 30px 30px;
  font: 15px/1.5 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; overflow-wrap: anywhere;
  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.2);
}
@media (max-width: 480px) { .dvo-paper { padding: 18px 16px 22px; } }
.dvo-paper .b { font-weight: 700; }
.dvo-paper .i { font-style: italic; }
.dvo-paper .u { text-decoration: underline; }
.dvo-paper .x { text-decoration: line-through; }
.dvo-paper .u.x { text-decoration: underline line-through; }
.dvo-link { color: #2F6FEB; text-decoration: underline; }
.dvo-h { margin: 18px 0 6px; font-weight: 700; line-height: 1.28; color: #1C1C1E; }
.dvo-h:first-child { margin-top: 0; }
.dvo-h0 { font-size: 26px; font-weight: 800; }
.dvo-h1 { font-size: 22px; font-weight: 800; }
.dvo-h2 { font-size: 19px; }
.dvo-h3 { font-size: 17px; }
.dvo-h4, .dvo-h5, .dvo-h6 { font-size: 15.5px; }
.dvo-p { margin: 0 0 8px; white-space: pre-wrap; }
.dvo-p.a-c { text-align: center; }
.dvo-p.a-r { text-align: right; }
.dvo-p.a-j { text-align: justify; }
.dvo-gap { height: 8px; }
.dvo-li { display: flex; gap: 6px; padding-left: calc(var(--l, 0) * 18px); margin-bottom: 2px; white-space: pre-wrap; }
.dvo-mark { flex: none; min-width: 22px; text-align: right; }
.dvo-li-text { flex: 1; min-width: 0; }
.dvo-dtable-wrap { overflow-x: auto; margin: 8px 0 12px; border: 1px solid #C9C9CF; border-radius: 6px; }
.dvo-dtable { border-collapse: collapse; font-size: 13.5px; min-width: 100%; }
.dvo-dtable td, .dvo-dtable th { border: 1px solid #D6D6DA; padding: 7px 9px; text-align: left; vertical-align: top; white-space: pre-wrap; min-width: 64px; max-width: 260px; }
.dvo-dtable tr:first-child > * { border-top: 0; }
.dvo-dtable tr > *:first-child { border-left: 0; }
.dvo-dtable tr > *:last-child { border-right: 0; }
.dvo-dtable tr:last-child > * { border-bottom: 0; }
.dvo-dtable th { background: #F1F1F4; font-weight: 700; }
.dvo-img { display: block; width: 100%; height: auto; margin: 8px 0; border-radius: 6px; background: #F4F4F6; object-fit: contain; }
.dvo-img.broken { visibility: hidden; height: 0; margin: 0; }
.dvo-break { border: 0; border-top: 1px dashed #C9C9CF; margin: 18px 0; }
.dvo-empty-paper { color: #8A8A90; text-align: center; padding: 30px 0; }
.dvo-more { font-size: 12.5px; color: rgba(242, 242, 242, 0.6); margin-top: 12px; text-align: center; }
.dvo-center { display: flex; align-items: center; justify-content: center; flex: 1; padding: 24px; color: rgba(242, 242, 242, 0.6); font-size: 14px; text-align: center; }

/* ---- sheet: tabs, then the table */
.dvo-book { display: flex; flex-direction: column; min-height: 0; padding: 10px 12px 12px; }
.dvo-tabs { display: flex; gap: 8px; overflow-x: auto; scrollbar-width: none; flex: none; padding: 2px 0 10px; }
.dvo-tabs::-webkit-scrollbar { display: none; }
.dvo-tab {
  flex: none; height: 40px; max-width: 220px; padding: 0 16px; border-radius: 14px; cursor: pointer;
  border: 1px solid rgba(255, 255, 255, 0.16); background: #1F1F23; color: #F2F2F2;
  font-size: 14px; font-weight: 700; white-space: normal; overflow-wrap: break-word;
}
.dvo-tab:hover { background: #2A2A30; }
.dvo-tab.on { background: #F2F2F2; border-color: #F2F2F2; color: #111; }
.dvo-tab:focus-visible { outline: 2px solid #3BA7FF; outline-offset: 2px; }
.dvo-sheet { flex: 1; min-height: 0; display: flex; flex-direction: column; }
.dvo-sheetwrap { flex: 0 1 auto; min-height: 0; overflow: auto; border-radius: 8px; background: #fff; align-self: flex-start; max-width: 100%; }
.dvo-stable { border-collapse: separate; border-spacing: 0; color: #1C1C1E; font-size: 13px; width: max-content; }
.dvo-stable td, .dvo-stable th { border-right: 1px solid #E3E3E7; border-bottom: 1px solid #E3E3E7; padding: 7px 8px; text-align: left; vertical-align: top; background: #fff; }
.dvo-stable td { min-width: 48px; }
.dvo-stable td.num { text-align: right; font-variant-numeric: tabular-nums; }
.dvo-cell { max-width: 240px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; white-space: pre-wrap; overflow-wrap: anywhere; /* preview: a long free-text preview a tap opens in full — the one sanctioned cut */ }
.dvo-stable thead th { position: sticky; top: 0; z-index: 2; background: #F1F1F4; color: #6B6B72; font-size: 12px; font-weight: 700; text-align: center; padding: 6px 8px; }
.dvo-stable th.dvo-rownum { position: sticky; left: 0; z-index: 1; background: #F7F7F9; color: #8A8A90; font-size: 12px; font-weight: 400; text-align: center; min-width: 36px; }
.dvo-stable thead th.dvo-corner { left: 0; z-index: 3; background: #E8E8EC; }

/* ---- slides: cards as wide as the stage allows */
.dvo-deck { overflow-y: auto; padding: 16px 12px 28px; display: flex; flex-direction: column; align-items: center; gap: 10px; }
.dvo-slidefig { margin: 0; width: min(100%, 960px); /* a whole slide fits the stage's height on a wide screen */ max-width: max(280px, calc((100dvh - 190px) / var(--r))); }
.dvo-slidefig figcaption { text-align: center; font-size: 12.5px; color: rgba(242, 242, 242, 0.6); margin-top: 6px; }
.dvo-slide {
  position: relative; width: 100%; aspect-ratio: calc(1 / var(--r)); background: #fff; border-radius: 6px; overflow: hidden;
  container-type: inline-size; color: #1C1C1E; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}
.dvo-sitem { position: absolute; box-sizing: border-box; }
.dvo-simg { object-fit: cover; }
.dvo-simg.broken { visibility: hidden; }
.dvo-stext { display: flex; flex-direction: column; justify-content: flex-start; padding: 0.67% 0.75%; overflow: visible; }
.dvo-stext.v-c { justify-content: center; }
.dvo-stext.v-b { justify-content: flex-end; }
.dvo-spara { display: flex; line-height: 1.18; padding-left: calc(var(--l, 0) * 3cqw); white-space: pre-wrap; overflow-wrap: anywhere; }
.dvo-spara.a-c { justify-content: center; text-align: center; }
.dvo-spara.a-r { justify-content: flex-end; text-align: right; }
.dvo-sbullet { flex: none; min-width: 0.9em; margin-right: 0.25em; }
.dvo-spara-text { min-width: 0; }
.dvo-spara .b { font-weight: 700; }
.dvo-spara .i { font-style: italic; }
.dvo-spara .u { text-decoration: underline; }
.dvo-stab { display: flex; flex-direction: column; border: 1px solid #B9B9C0; background: #fff; }
.dvo-stab-row { flex: 1; display: flex; border-bottom: 1px solid #D6D6DA; }
.dvo-stab-row.head { background: #F1F1F4; font-weight: 700; }
.dvo-stab-cell { flex: 1; min-width: 0; padding: 0.3% 0.5%; border-left: 1px solid #E3E3E7; overflow: hidden; }
.dvo-stab-cell:first-child { border-left: 0; }