:root{
  --tts-accent:#00aca8;
  --tts-blue:#1a3aab;
  --tts-bg:#f5f7fb;
  --tts-border:#dbe3ed;
  --tts-text:#172033;
  --tts-muted:#5c667a;
}
*{box-sizing:border-box}
body.docreader-body{margin:0;background:var(--tts-bg);color:var(--tts-text);font-family:Arial,Helvetica,sans-serif;line-height:1.45}
.skip-link{position:absolute;left:12px;top:-50px;background:#fff;color:var(--tts-blue);padding:10px 14px;border:2px solid var(--tts-blue);border-radius:10px;z-index:100000}
.skip-link:focus{top:12px}
.docreader-topbar{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:14px 22px;background:#fff;border-bottom:1px solid var(--tts-border);position:sticky;top:0;z-index:50;box-shadow:0 2px 16px rgba(18,32,64,.08)}
.docreader-brand{display:flex;flex-direction:column;gap:2px}.docreader-brand strong{color:var(--tts-blue);font-size:20px}.docreader-brand span{font-size:13px;color:var(--tts-muted)}
.docreader-nav{display:flex;gap:10px;flex-wrap:wrap}.docreader-nav a,.docreader-open-link{color:var(--tts-blue);background:#eef7ff;text-decoration:none;padding:9px 12px;border-radius:999px;font-weight:700;border:1px solid #d7e8fb}.docreader-nav a:hover,.docreader-open-link:hover{background:#e2fbfa;color:#007d79}
.docreader-loader{max-width:1180px;margin:18px auto;padding:18px;background:#fff;border:1px solid var(--tts-border);border-radius:18px;box-shadow:0 4px 18px rgba(18,32,64,.06)}
.docreader-loader h1{font-size:22px;margin:0 0 14px;color:var(--tts-blue)}.docreader-loader-grid{display:grid;grid-template-columns:minmax(220px,1.4fr) minmax(200px,1fr) 180px auto;gap:12px;align-items:end}.docreader-field{display:flex;flex-direction:column;gap:6px;font-weight:700;color:var(--tts-blue);font-size:13px}.docreader-field input,.docreader-field select{border:1px solid var(--tts-border);border-radius:12px;padding:10px 12px;font-size:14px;background:#fff;color:var(--tts-text);min-height:42px}.docreader-loader-actions{display:flex;gap:8px;align-items:center}.docreader-primary,.docreader-secondary,.docreader-toolbar button,.docreader-sidebar button{border:none;border-radius:999px;padding:10px 13px;font-weight:700;cursor:pointer;min-height:40px}.docreader-primary{background:var(--tts-accent);color:#fff}.docreader-secondary{background:#edf2f7;color:var(--tts-blue)}.docreader-status{min-height:22px;margin:12px 0 0;color:var(--tts-muted);font-weight:700}.docreader-status.pdf-reader-error{color:#a31919}.docreader-shell{display:grid;grid-template-columns:260px minmax(0,1fr);gap:0;min-height:70vh}.docreader-shell[data-sidebar-open="false"]{grid-template-columns:0 minmax(0,1fr)}.docreader-shell[data-sidebar-open="false"] .docreader-sidebar{overflow:hidden;width:0;padding:0;border:0}
.docreader-sidebar{background:#fff;border-right:1px solid var(--tts-border);padding:14px;position:sticky;top:70px;height:calc(100vh - 70px);overflow:auto;transition:width .2s ease,padding .2s ease}.docreader-sidebar-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px;color:var(--tts-blue)}.docreader-page-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}.docreader-page-list button{width:100%;text-align:left;background:#f1f6fb;color:var(--tts-blue);border:1px solid #d8e4f0}.docreader-page-list button[aria-current="page"]{background:var(--tts-accent);color:white;border-color:var(--tts-accent)}
.docreader-main{min-width:0;padding:16px 18px 60px}.docreader-toolbar{position:sticky;top:66px;z-index:40;display:flex;align-items:center;gap:8px;flex-wrap:wrap;background:rgba(255,255,255,.96);border:1px solid var(--tts-border);border-radius:18px;padding:10px;box-shadow:0 5px 18px rgba(18,32,64,.08);margin-bottom:16px}.docreader-toolbar button{background:#edf7f7;color:var(--tts-blue);border:1px solid #d7eeee}.docreader-toolbar button:hover,.docreader-toolbar button[aria-pressed="true"]{background:var(--tts-accent);color:#fff}.docreader-page-status,.docreader-zoom-value{font-weight:800;color:var(--tts-blue);min-width:70px;text-align:center}.docreader-separator{display:inline-block;width:1px;height:30px;background:var(--tts-border);margin:0 3px}.docreader-pdf-visual{display:flex;flex-direction:column;align-items:center;gap:18px}.docreader-pdf-visual .pdf-visual-toolbar{display:none!important}.docreader-pdf-visual .pdf-visual-page{background:white;border:1px solid var(--tts-border);box-shadow:0 8px 28px rgba(18,32,64,.18);border-radius:4px;overflow:hidden}.docreader-text-content{max-width:920px;margin:0 auto;background:#fff;border:1px solid var(--tts-border);border-radius:18px;padding:24px;box-shadow:0 4px 18px rgba(18,32,64,.08)}.docreader-text-content.pdf-reader-content-visually-hidden{position:absolute!important;left:-10000px!important;width:1px!important;height:1px!important;overflow:hidden!important}.docreader-text-mode .docreader-pdf-visual{display:none!important}.docreader-text-mode .docreader-text-content{position:static!important;left:auto!important;width:auto!important;height:auto!important;overflow:visible!important}.docreader-layout-mode .docreader-text-content{position:absolute!important;left:-10000px!important;width:1px!important;height:1px!important;overflow:hidden!important}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid var(--tts-blue);outline-offset:3px}.docreader-link-wrap{margin:18px 0}.docreader-open-link{display:inline-block}
body.tts-high-contrast, body.tts-global-contrast{background:#000!important;color:#fff!important}body.tts-high-contrast .docreader-topbar,body.tts-high-contrast .docreader-loader,body.tts-high-contrast .docreader-sidebar,body.tts-high-contrast .docreader-toolbar,body.tts-high-contrast .docreader-text-content,body.tts-global-contrast .docreader-topbar,body.tts-global-contrast .docreader-loader,body.tts-global-contrast .docreader-sidebar,body.tts-global-contrast .docreader-toolbar,body.tts-global-contrast .docreader-text-content{background:#000!important;color:#fff!important;border-color:#fff!important}body.tts-high-contrast button,body.tts-global-contrast button{background:#111!important;color:#fff!important;border:2px solid #fff!important}body.tts-high-contrast a,body.tts-global-contrast a{color:#fff!important;border-color:#fff!important;background:#111!important}
@media(max-width:900px){.docreader-loader-grid{grid-template-columns:1fr}.docreader-shell{grid-template-columns:1fr}.docreader-sidebar{position:relative;top:auto;height:auto;border-right:0;border-bottom:1px solid var(--tts-border)}.docreader-toolbar{top:58px}.docreader-topbar{align-items:flex-start;flex-direction:column}}

/* DocReader compact toolbar redesign */
.docreader-topbar,
.docreader-loader,
.docreader-toolbar{display:none!important}
body.docreader-body{background:#f5f7fb}
.docreader-slim-toolbar{
  position:sticky;top:0;z-index:1000;display:flex;align-items:center;gap:0;
  min-height:34px;padding:0 8px;background:#f8fbff;border-bottom:1px solid var(--tts-border);
  box-shadow:0 1px 8px rgba(18,32,64,.08);font-size:13px;color:var(--tts-text);overflow-x:auto;white-space:nowrap
}
.docreader-slim-toolbar > *{flex:0 0 auto}
.docreader-home{display:inline-flex;align-items:center;gap:1px;text-decoration:none;font-weight:800;color:var(--tts-blue);padding:6px 10px;border-right:1px solid var(--tts-border)}
.docreader-home span{color:var(--tts-accent);font-size:18px;line-height:1}
.docreader-slim-toolbar button,
.docreader-file-label,
.docreader-slim-toolbar select,
.docreader-url-input{
  min-height:30px;border:0;border-right:1px solid var(--tts-border);border-radius:0;background:transparent;color:var(--tts-text);
  padding:5px 10px;font-weight:700;font-size:13px;line-height:1.2
}
.docreader-slim-toolbar button:hover,
.docreader-slim-toolbar button:focus-visible,
.docreader-file-label:hover,
.docreader-slim-toolbar button[aria-pressed="true"]{
  background:#e6fbfa;color:var(--tts-blue);outline:none
}
.docreader-slim-toolbar button[aria-pressed="true"]{box-shadow:inset 0 -3px 0 var(--tts-accent)}
.docreader-icon-btn{min-width:34px;text-align:center;font-size:15px;color:var(--tts-blue)!important}
.docreader-listen-btn{color:var(--tts-blue)!important;font-weight:800!important}
.docreader-primary.small{background:var(--tts-accent)!important;color:#fff!important;border-radius:7px;margin-left:4px;margin-right:4px;min-height:26px;padding:4px 10px!important;border-right:0!important}
.docreader-secondary.small{background:#edf2f7!important;color:var(--tts-blue)!important;border-radius:7px;margin-right:5px;min-height:26px;padding:4px 10px!important;border-right:0!important}
.docreader-url-input{width:260px;background:#fff;border:1px solid var(--tts-border);border-radius:7px;margin-left:6px;margin-right:2px;font-weight:500}
.docreader-file-input{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;opacity:0!important}
.docreader-file-label{cursor:pointer;color:var(--tts-blue);border-left:1px solid var(--tts-border)}
.docreader-separator{width:1px;height:30px;background:var(--tts-border);margin:0 4px;display:inline-block}
.docreader-page-label{padding-left:8px;padding-right:4px;color:var(--tts-muted);font-weight:700}
.docreader-page-select{width:54px;text-align:center;border:1px solid var(--tts-border)!important;border-radius:7px!important;background:#fff!important;margin:0 5px;padding:3px 6px!important}
.docreader-page-status,.docreader-zoom-value{min-width:auto;padding:0 8px;color:var(--tts-blue);font-weight:800;text-align:center}
.docreader-status{margin-left:auto;min-width:120px;padding:0 8px;font-size:12px;color:var(--tts-muted);font-weight:700;overflow:hidden;text-overflow:ellipsis}
.docreader-shell{min-height:calc(100vh - 34px);grid-template-columns:130px minmax(0,1fr)}
.docreader-sidebar{top:34px;height:calc(100vh - 34px);padding:8px;background:#fff}
.docreader-sidebar-head{font-size:12px;margin-bottom:8px}.docreader-sidebar-head button{min-height:26px;padding:3px 8px;border-radius:8px;background:#edf2f7;color:var(--tts-blue)}
.docreader-page-list{gap:8px}.docreader-page-list button{padding:5px;border-radius:5px;font-size:12px;text-align:center;background:#f8fbff;color:var(--tts-blue)}
.docreader-main{padding:8px 10px 50px;background:#eef2f7}
.docreader-pdf-visual{gap:10px}.docreader-pdf-visual .pdf-visual-page{border-radius:0;box-shadow:0 2px 10px rgba(18,32,64,.20);border:1px solid #bcc8d7}
.docreader-visually-hidden{position:absolute!important;left:-10000px!important;width:1px!important;height:1px!important;overflow:hidden!important}
body.tts-high-contrast .docreader-slim-toolbar,body.tts-global-contrast .docreader-slim-toolbar{background:#000!important;color:#fff!important;border-color:#fff!important}
body.tts-high-contrast .docreader-slim-toolbar button,body.tts-high-contrast .docreader-file-label,body.tts-high-contrast .docreader-url-input,body.tts-high-contrast .docreader-page-select,
body.tts-global-contrast .docreader-slim-toolbar button,body.tts-global-contrast .docreader-file-label,body.tts-global-contrast .docreader-url-input,body.tts-global-contrast .docreader-page-select{background:#111!important;color:#fff!important;border-color:#fff!important}
@media(max-width:900px){.docreader-slim-toolbar{position:sticky;align-items:center}.docreader-url-input{width:180px}.docreader-shell{grid-template-columns:1fr}.docreader-sidebar{position:relative;top:0;height:auto}.docreader-shell[data-sidebar-open="false"] .docreader-sidebar{display:none}.docreader-status{display:none}}



/* TTS bar integrated directly below the document toolbar.
   This removes the unused blank area above the document and keeps the normal
   reading bar as the only playback control for the document. */
#host.docreader-tts-host {
  display: block !important;
  position: sticky !important;
  top: 34px !important;
  z-index: 999 !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  background: #f8fbff !important;
  border-bottom: 1px solid var(--tts-border) !important;
  box-shadow: 0 1px 6px rgba(18,32,64,.06) !important;
}

#host.docreader-tts-host:empty {
  display: none !important;
}

.docreader-body #host.docreader-tts-host + .docreader-shell {
  margin-top: 0 !important;
}

.docreader-body .docreader-sidebar {
  top: 78px !important;
  height: calc(100vh - 78px) !important;
}

body.tts-high-contrast #host.docreader-tts-host,
body.tts-global-contrast #host.docreader-tts-host {
  background: #000 !important;
  border-color: #fff !important;
}

@media(max-width:900px){
  #host.docreader-tts-host {
    top: 34px !important;
  }
  .docreader-body .docreader-sidebar {
    top: 0 !important;
    height: auto !important;
  }
}

/* Fix: non-PDF documents must remain visible in the document reader.
   The hidden text container is only used when a real PDF visual layer is active. */
body[data-docreader-kind="text"] #pdf-reader-content,
#docreader-main[data-document-kind="text"] #pdf-reader-content,
#pdf-reader-content.docreader-content-visible {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  position: static !important;
  left: auto !important;
  top: auto !important;
  width: auto !important;
  min-height: 240px !important;
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
  clip: auto !important;
  clip-path: none !important;
  white-space: normal !important;
  transform: none !important;
  margin: 0 auto 4rem auto !important;
  padding: 24px !important;
}

body[data-docreader-kind="text"] #pdf-visual-reader {
  display: none !important;
}

#pdf-reader-content.docreader-content-visible .pdf-reader-page,
#pdf-reader-content.docreader-content-visible .document-reader-page {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  margin-bottom: 2rem;
}

#pdf-reader-content.docreader-content-visible p,
#pdf-reader-content.docreader-content-visible li,
#pdf-reader-content.docreader-content-visible blockquote,
#pdf-reader-content.docreader-content-visible h2,
#pdf-reader-content.docreader-content-visible h3 {
  color: inherit;
  visibility: visible !important;
  opacity: 1 !important;
}

/* Formatted document layout mode for Office/OpenDocument/EPUB/HTML.
   The visual layer preserves much more of the original document structure,
   while #pdf-reader-content remains as the clean hidden reading layer used by
   the normal TTS bar. */
.document-layout-content {
  max-width: 1020px;
  margin: 0 auto 4rem auto;
  background: #fff;
  color: var(--tts-text);
  border: 1px solid var(--tts-border);
  border-radius: 14px;
  padding: 28px;
  box-shadow: 0 4px 18px rgba(18,32,64,.08);
  overflow-x: auto;
  line-height: 1.55;
}
.document-layout-content .document-layout-inner {
  min-height: 240px;
}
.document-layout-content table {
  border-collapse: collapse;
  max-width: 100%;
  margin: 1rem 0;
}
.document-layout-content th,
.document-layout-content td {
  border: 1px solid #d8e4f0;
  padding: 6px 8px;
  vertical-align: top;
}
.document-layout-content img {
  max-width: 100%;
  height: auto;
}
.document-layout-content h1,
.document-layout-content h2,
.document-layout-content h3 {
  color: var(--tts-blue);
}
.docreader-layout-mode .document-layout-content:not([hidden]) {
  display: block !important;
}
.docreader-text-mode .document-layout-content {
  display: none !important;
}
body.tts-high-contrast .document-layout-content,
body.tts-global-contrast .document-layout-content {
  background:#000!important;
  color:#fff!important;
  border-color:#fff!important;
}
body.tts-high-contrast .document-layout-content *,
body.tts-global-contrast .document-layout-content * {
  background:#000!important;
  color:#fff!important;
  border-color:#fff!important;
}


/* Clear source selection in the document reader: upload and URL modes are
   mutually exclusive, so users do not see both controls at the same time. */
.docreader-source-switch{
  display:inline-flex;
  align-items:center;
  gap:2px;
  margin-left:6px;
  margin-right:4px;
  padding:2px;
  border:1px solid var(--tts-border);
  border-radius:999px;
  background:#fff;
}
.docreader-source-switch .docreader-source-btn{
  min-height:24px!important;
  padding:3px 9px!important;
  border:0!important;
  border-radius:999px!important;
  background:transparent!important;
  color:var(--tts-blue)!important;
  font-size:12px!important;
  font-weight:800!important;
}
.docreader-source-switch .docreader-source-btn[aria-pressed="true"]{
  background:var(--tts-accent)!important;
  color:#fff!important;
  box-shadow:none!important;
}
.docreader-source-panel{
  display:inline-flex;
  align-items:center;
  gap:4px;
  min-height:30px;
}
.docreader-source-panel[hidden]{
  display:none!important;
}
.docreader-slim-toolbar .docreader-source-panel .docreader-file-label{
  border-left:0!important;
  border-right:1px solid var(--tts-border)!important;
}
body.tts-high-contrast .docreader-source-switch,
body.tts-global-contrast .docreader-source-switch{
  background:#000!important;
  border-color:#fff!important;
}
body.tts-high-contrast .docreader-source-switch .docreader-source-btn[aria-pressed="true"],
body.tts-global-contrast .docreader-source-switch .docreader-source-btn[aria-pressed="true"]{
  background:#fff!important;
  color:#000!important;
}
@media(max-width:900px){
  .docreader-source-switch .docreader-source-btn{font-size:11px!important;padding-left:7px!important;padding-right:7px!important;}
}


/* Segmentos de lectura: el texto se mantiene visualmente igual, pero cada frase queda como unidad TTS. */
.tts-doc-segment {
  display: inline;
}
.tts-doc-segment.entzuten,
.tts-doc-segment:focus {
  outline: 2px solid var(--tts-primary, #00aca8);
  outline-offset: 2px;
  border-radius: 3px;
}


/* Highlight mirrored in formatted Layout mode: the hidden TTS reading layer can
   be segmented sentence by sentence while the user still sees the formatted
   document. The active segment is mirrored here in the visual HTML layout. */
.document-layout-content mark.docreader-layout-reading-highlight,
.document-layout-content .docreader-layout-block-reading {
  background: rgba(0, 172, 168, .24) !important;
  color: inherit !important;
  outline: 2px solid var(--tts-primary, #00aca8) !important;
  outline-offset: 2px;
  border-radius: 4px;
  padding: 0 .08em;
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
}
body.tts-high-contrast .document-layout-content mark.docreader-layout-reading-highlight,
body.tts-global-contrast .document-layout-content mark.docreader-layout-reading-highlight,
body.tts-high-contrast .document-layout-content .docreader-layout-block-reading,
body.tts-global-contrast .document-layout-content .docreader-layout-block-reading {
  background: #ffff00 !important;
  color: #000 !important;
  outline: 3px solid #fff !important;
}

/* DocReader layout adjustment: the normal TTS bar sits in the empty area
   below the top grey toolbar, to the right of the page thumbnails/sidebar. */
.docreader-shell{
  grid-template-columns:130px minmax(0,1fr) !important;
  grid-template-rows:auto minmax(0,1fr) !important;
  align-items:start !important;
}
.docreader-sidebar{
  grid-column:1 !important;
  grid-row:1 / span 2 !important;
  top:34px !important;
  height:calc(100vh - 34px) !important;
}
#host.docreader-tts-host{
  grid-column:2 !important;
  grid-row:1 !important;
  display:block !important;
  position:sticky !important;
  top:34px !important;
  z-index:999 !important;
  width:100% !important;
  margin:0 !important;
  padding:0 !important;
  background:#f8fbff !important;
  border-bottom:1px solid var(--tts-border) !important;
  box-shadow:0 1px 6px rgba(18,32,64,.06) !important;
}
.docreader-main{
  grid-column:2 !important;
  grid-row:2 !important;
}
.docreader-shell[data-sidebar-open="false"]{
  grid-template-columns:0 minmax(0,1fr) !important;
}
.docreader-shell[data-sidebar-open="false"] #host.docreader-tts-host,
.docreader-shell[data-sidebar-open="false"] .docreader-main{
  grid-column:2 !important;
}
body.tts-high-contrast #host.docreader-tts-host,
body.tts-global-contrast #host.docreader-tts-host{
  background:#000 !important;
  border-color:#fff !important;
}
@media(max-width:900px){
  .docreader-shell{
    grid-template-columns:1fr !important;
    grid-template-rows:auto auto auto !important;
  }
  .docreader-sidebar{
    grid-column:1 !important;
    grid-row:1 !important;
    position:relative !important;
    top:0 !important;
    height:auto !important;
  }
  #host.docreader-tts-host{
    grid-column:1 !important;
    grid-row:2 !important;
    top:34px !important;
  }
  .docreader-main{
    grid-column:1 !important;
    grid-row:3 !important;
  }
}