/* Estilos propios del NCT Data Room.
   Vive en pages/ y se sirve desde la ruta /dataroom.css porque static/assets/
   se regenera con scripts/sync-assets.sh: cualquier cosa nuestra ahí se pierde
   en el siguiente sync. */

/* ---- Sidenav: el template deja el logo pegado a la izquierda ---- */
.sidenav-menu .logo {
    text-align: center;
}

/* ---- Árbol de documentos ---- */
.dr-tree { list-style: none; padding-left: 0; margin: 0; }
.dr-tree ul { list-style: none; padding-left: 1.25rem; }
.dr-tree .dr-row { display: flex; align-items: center; gap: .5rem; padding: .3rem .5rem; border-radius: .375rem; cursor: pointer; }
.dr-tree .dr-row:hover { background: var(--bs-tertiary-bg); }
.dr-tree .dr-row.active { background: var(--bs-primary-bg-subtle); }

/* ---- Árbol de documentos: columna en escritorio, cajón en móvil ---- */
.dr-tree-body { max-height: calc(100vh - 300px); overflow: auto; }

/* ---- Visor ---- */
#viewer-md { max-height: calc(100vh - 260px); overflow: auto; }

@media (max-width: 991.98px) {
    .dr-tree-panel { width: min(86vw, 21rem); }
    .dr-tree-panel .card { border-radius: 0; height: 100%; box-shadow: none; }
    .dr-tree-body { max-height: calc(100vh - 68px); }
    /* El visor se queda con la pantalla completa: el árbol ya no le come mitad */
    #viewer-md { max-height: calc(100vh - 178px); }
    .dr-page { max-width: 100%; }
    .dr-md { padding-left: .85rem; padding-right: .85rem; }
    .dr-props { padding-left: .9rem; padding-right: .9rem; grid-template-columns: minmax(5.5rem, max-content) 1fr; }
    .dr-fullscreen #viewer-md { max-height: calc(100vh - 60px); }
    /* Menos aire arriba: en una pantalla de 844px cada píxel cuenta */
    .page-content .page-title-head { margin-bottom: .35rem; }
    #deal-title { font-size: 1rem; }
    .dr-viewer-wrap .card-body, #viewer-card .card-body { padding: .5rem; }
    #viewer-card .card-header { padding-top: .6rem; padding-bottom: .6rem; }
    /* El logo de la marca de agua, proporcional a la pantalla */
    .dr-watermark::after { background-size: 150px auto; }
}

/* Páginas renderizadas en el server (PDF, imágenes, Office) */
.dr-pages { display: flex; flex-direction: column; align-items: center; gap: 1.25rem; padding: .5rem 0 1.5rem; }
.dr-page { margin: 0; width: 100%; max-width: 60rem; }
.dr-page img { display: block; width: 100%; height: auto; border-radius: .35rem; background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,.12), 0 6px 18px rgba(0,0,0,.08); }
.dr-page figcaption { text-align: center; font-size: .75rem; color: var(--bs-secondary-color); padding-top: .35rem; }

/* La cabecera del visor: el nombre del archivo se trunca en vez de desbordarse.
   Bootstrap 5.3 no trae `min-w-0`, y sin min-width:0 un hijo de flex no encoge
   por debajo de su contenido, así que `text-truncate` no hacía nada. */
.min-w-0 { min-width: 0; }
#viewer-card .card-header { overflow: hidden; }

/* Pantalla completa del visor */
.dr-fullscreen { position: fixed; inset: 0; z-index: 1080; margin: 0; border-radius: 0; max-width: none; }

/* Maximizado es modo lectura: fuera todo botón menos el de salir. Para cambiar
   de documento se sale primero. */
.dr-fullscreen .card-header .btn:not(#btn-fullscreen) { display: none !important; }

/* Si algún cajón llegara a abrirse sobre el visor maximizado (z-index 1080),
   Bootstrap lo pondría en 1045 y el backdrop en 1040, o sea por debajo. */
body.dr-noscroll #tree-panel { z-index: 1090; }
body.dr-noscroll .offcanvas-backdrop { z-index: 1085; }
.dr-fullscreen #viewer-md { max-height: calc(100vh - 66px); }
.dr-fullscreen .dr-page { max-width: 78rem; }
body.dr-noscroll { overflow: hidden; }

/* Marca de agua sobre el documento. Es un overlay de pantalla: no modifica el
   archivo, solo lo marca mientras se ve. `pointer-events: none` deja pasar el
   scroll y los clics al iframe de abajo. */
.dr-viewer-wrap { position: relative; }
.dr-watermark { position: absolute; inset: 0; pointer-events: none; z-index: 5; overflow: hidden; border-radius: .5rem; }
.dr-watermark::before {
    content: "";
    position: absolute;
    inset: -10%;
    opacity: .05;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='300' height='190'><text x='150' y='100' font-family='Helvetica,Arial,sans-serif' font-size='19' font-weight='700' letter-spacing='2' fill='%23000' text-anchor='middle' transform='rotate(-30 150 100)'>CONFIDENTIAL</text><text x='150' y='124' font-family='Helvetica,Arial,sans-serif' font-size='12' letter-spacing='5' fill='%23000' text-anchor='middle' transform='rotate(-30 150 100)'>NCT</text></svg>");
}
.dr-watermark::after {
    content: "";
    position: absolute;
    inset: 0;
    opacity: .045;
    background: url("/assets/images/logo-dark.png") center center / 260px auto no-repeat;
}
[data-bs-theme="dark"] .dr-watermark::before {
    opacity: .07;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='300' height='190'><text x='150' y='100' font-family='Helvetica,Arial,sans-serif' font-size='19' font-weight='700' letter-spacing='2' fill='%23fff' text-anchor='middle' transform='rotate(-30 150 100)'>CONFIDENTIAL</text><text x='150' y='124' font-family='Helvetica,Arial,sans-serif' font-size='12' letter-spacing='5' fill='%23fff' text-anchor='middle' transform='rotate(-30 150 100)'>NCT</text></svg>");
}
[data-bs-theme="dark"] .dr-watermark::after {
    opacity: .06;
    background-image: url("/assets/images/logo.png");
}

/* ---- Vista de lectura de markdown (estilo Obsidian) ---- */
.dr-md { max-width: 48rem; margin: 0 auto; padding: .5rem 1.25rem 3rem; line-height: 1.65; font-size: .95rem; color: var(--bs-body-color); }
.dr-md > :first-child { margin-top: 0; }
.dr-md h1, .dr-md h2, .dr-md h3, .dr-md h4 { font-weight: 600; line-height: 1.3; margin: 1.9em 0 .6em; letter-spacing: -.01em; }
.dr-md h1 { font-size: 1.75rem; padding-bottom: .3em; border-bottom: 1px solid var(--bs-border-color); }
.dr-md h2 { font-size: 1.32rem; padding-bottom: .25em; border-bottom: 1px solid var(--bs-border-color-translucent); }
.dr-md h3 { font-size: 1.12rem; }
.dr-md h4 { font-size: 1rem; color: var(--bs-secondary-color); }
.dr-md p { margin: 0 0 1em; }
.dr-md ul, .dr-md ol { margin: 0 0 1em; padding-left: 1.6rem; }
.dr-md li { margin-bottom: .3em; }
.dr-md li > ul, .dr-md li > ol { margin-top: .3em; }
.dr-md strong { font-weight: 600; }
.dr-md a { color: var(--bs-link-color); text-decoration: none; border-bottom: 1px solid transparent; }
.dr-md a:hover { border-bottom-color: currentColor; }
.dr-md hr { margin: 2em 0; border: 0; border-top: 1px solid var(--bs-border-color); }
.dr-md code { font-size: .86em; padding: .12em .38em; border-radius: .3rem; background: var(--bs-tertiary-bg); color: var(--bs-emphasis-color); }
.dr-md pre { padding: .9rem 1rem; border-radius: .5rem; background: var(--bs-tertiary-bg); overflow-x: auto; margin: 0 0 1em; }
.dr-md pre code { background: none; padding: 0; font-size: .85em; }
.dr-md blockquote { margin: 0 0 1em; padding: .1rem 0 .1rem 1rem; border-left: 3px solid var(--bs-border-color); color: var(--bs-secondary-color); }
.dr-md blockquote p:last-child { margin-bottom: 0; }
.dr-md img { max-width: 100%; border-radius: .5rem; }

/* Tablas: scroll propio para que la página nunca se desborde */
.dr-md .dr-table-wrap { overflow-x: auto; margin: 0 0 1.4em; border: 1px solid var(--bs-border-color); border-radius: .5rem; }
.dr-md .dr-table-wrap table { margin: 0; font-size: .9rem; }
.dr-md .dr-table-wrap thead th { background: var(--bs-tertiary-bg); font-weight: 600; white-space: nowrap; border-bottom: 1px solid var(--bs-border-color); }
.dr-md .dr-table-wrap td, .dr-md .dr-table-wrap th { padding: .55rem .8rem; }
.dr-md .dr-table-wrap tbody tr:last-child td { border-bottom: 0; }

/* Propiedades del frontmatter, como el panel de Obsidian */
.dr-props { max-width: 48rem; margin: 0 auto .5rem; padding: .85rem 1.25rem; border-bottom: 1px solid var(--bs-border-color); display: grid; grid-template-columns: minmax(7rem, max-content) 1fr; gap: .35rem 1rem; font-size: .84rem; }
.dr-props dt { color: var(--bs-secondary-color); font-weight: 500; }
.dr-props dd { margin: 0; color: var(--bs-body-color); word-break: break-word; }
.dr-props dd .dr-chip { display: inline-block; background: var(--bs-tertiary-bg); border-radius: .3rem; padding: .05rem .45rem; margin: 0 .25rem .2rem 0; }

/* Callouts de Obsidian */
.dr-md .dr-callout { --cl: var(--bs-primary); margin: 0 0 1.4em; padding: .8rem 1rem; border-radius: .45rem; border-left: 4px solid var(--cl); background: color-mix(in srgb, var(--cl) 9%, transparent); }
.dr-md .dr-callout-title { display: flex; align-items: center; gap: .45rem; font-weight: 600; color: var(--cl); margin-bottom: .35rem; }
.dr-md .dr-callout-title i { font-size: 1.05rem; }
.dr-md .dr-callout-body > :last-child { margin-bottom: 0; }
.dr-md .dr-callout-body p { margin-bottom: .6em; }
.dr-md .dr-callout-note { --cl: #7d8590; }
.dr-md .dr-callout-info { --cl: #2f81f7; }
.dr-md .dr-callout-tip { --cl: #10b981; }
.dr-md .dr-callout-success { --cl: #22c55e; }
.dr-md .dr-callout-question { --cl: #d29922; }
.dr-md .dr-callout-warning { --cl: #f59e0b; }
.dr-md .dr-callout-danger { --cl: #ef4444; }
.dr-md .dr-callout-quote { --cl: #8b949e; }
.dr-md .dr-callout-example { --cl: #a371f7; }