/* =============================================================
   Modulo doc-viewer
   Render documento editor_documenti (target web) con indice sticky.
   Stili: nessun override colore — eredita primary/text/bg dal tema pagina.
   ============================================================= */

.doc-viewer {
    max-width: 1600px;
    margin: 0 auto;
    padding: var(--space-3xl)  var(--space-lg);
    color: inherit;
    font-family: var(--font-primary);
}

/* Defensive: niente fade-in / opacity ereditate */
.doc-viewer,
.doc-viewer * {
    opacity: 1 !important;
    animation: none !important;
}
/* eccezioni: chevron e dropdown TOC vanno animati (transform/opacity locali) */
.doc-viewer__toc-chevron,
.doc-viewer__toc-list,
.doc-viewer__chunk-caret,
.doc-viewer__chunk-body {
    animation: revert !important;
}

/* Wrapper layout (toc + content) — di default stack verticale */
.doc-viewer__layout {
    display: block;
}

.doc-viewer--empty,
.doc-viewer--error {
    text-align: center;
    padding: var(--space-2xl) var(--container-padding);
    color: var(--text-muted);
}

/* ---------- Header ---------- */

.doc-viewer__header {
    margin-bottom: var(--space-lg);
}

.doc-viewer__title {
    font-family: var(--font-display);
    font-size: var(--text-h3);
    font-weight: 700;
    line-height: 1.1;
    margin: 0;
    color: inherit;
}

.doc-viewer__title strong,
.doc-viewer__title b {
    color: var(--title-strong-color);
}

/* ---------- Indice (TOC) sticky orizzontale ---------- */

.doc-viewer__toc {
    position: sticky;
    top: calc(var(--menu-height) + var(--space-xs));
    z-index: var(--z-sticky);
    margin: 0 0 var(--space-lg) 0;
}

.doc-viewer__toc-inner {
    position: relative;
    background: var(--bg-glass);
    -webkit-backdrop-filter: saturate(160%) blur(12px);
    backdrop-filter: saturate(160%) blur(12px);
    border: 1px solid var(--search-border);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-md);
    transition: box-shadow var(--transition-normal), border-color var(--transition-normal);
}

.doc-viewer__toc-inner:hover {
    background: var(--bg-glass-hover);
    box-shadow: var(--shadow-lg);
}

.doc-viewer__toc-trigger {
    width: 100%;
    display: flex;
    align-items: center;
    gap: var(--space-sm);
    padding: var(--space-xs) var(--space-sm);
    background: transparent;
    border: 0;
    border-radius: var(--radius-md);
    cursor: pointer;
    text-align: left;
    color: inherit;
    font: inherit;
    outline: none;
    transition: background var(--transition-fast);
}

.doc-viewer__toc-trigger:focus-visible {
    outline: 2px solid var(--primary);
    outline-offset: 2px;
}

.doc-viewer__toc-eyebrow {
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-size: var(--size-label);
    font-weight: 700;
    color: var(--text-muted);
    flex-shrink: 0;
    padding-right: var(--space-sm);
    border-right: 1px solid var(--search-border);
    line-height: 1.4;
}

.doc-viewer__toc-current {
    flex: 1;
    display: flex;
    align-items: baseline;
    gap: var(--space-xs);
    min-width: 0;
    font-size: 1rem;
    font-weight: 600;
}

.doc-viewer__toc-current .doc-viewer__toc-name {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.doc-viewer__toc-num {
    font-variant-numeric: tabular-nums;
    color: var(--primary);
    font-weight: 700;
    flex-shrink: 0;
}

.doc-viewer__toc-chevron {
    width: 18px;
    height: 18px;
    flex-shrink: 0;
    color: var(--text-muted);
    transition: transform var(--transition-normal);
}

.doc-viewer[data-open="true"] .doc-viewer__toc-chevron {
    transform: rotate(180deg);
}

/* Dropdown lista opzioni */
.doc-viewer__toc-list {
    position: absolute;
    top: calc(100% + var(--space-xxs));
    left: 0;
    right: 0;
    margin: 0;
    padding: var(--space-xxs);
    list-style: none;
    background: var(--bg-dark);
    border: 1px solid var(--search-border);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-lg);
    max-height: 60vh;
    overflow-y: auto;
    opacity: 0;
    transform: translateY(-6px);
    pointer-events: none;
    transition: opacity var(--transition-fast), transform var(--transition-fast);
}

.doc-viewer[data-open="true"] .doc-viewer__toc-list {
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
}

.doc-viewer__toc-item {
    display: flex;
    align-items: baseline;
    gap: var(--space-xs);
    padding: 6px 2px;
    border-radius: var(--radius-sm);
    cursor: pointer;
    transition: background var(--transition-fast), color var(--transition-fast);
    line-height: normal;
    color: var(--text-secondary);
}

.doc-viewer__toc-item:hover,
.doc-viewer__toc-item:focus-visible {
    background: var(--bg-glass-hover);
    color: var(--text-primary);
    outline: none;
}

.doc-viewer__toc-item[aria-current="true"] {
    background: rgba(var(--primary-rgb), 0.15);
    color: var(--primary);
}

.doc-viewer__toc-item[data-level="2"] {padding-left: 17px;font-size: rem;}
.doc-viewer__toc-item[data-level="3"] { padding-left: calc(var(--space-sm) + var(--space-xl)); font-size: 0.9rem; }
.doc-viewer__toc-item[data-level="4"] { padding-left: calc(var(--space-sm) + var(--space-2xl)); font-size: 0.88rem; }

.doc-viewer__toc-item .doc-viewer__toc-name {
    flex: 1;
}

/* ---------- Contenuto ---------- */

.doc-viewer__content {
    line-height: 1.65;
}

.doc-viewer__chunk {
    scroll-margin-top: calc(var(--menu-height) + var(--space-2xl));
    padding: var(--space-xs) 0 var(--space-md) 0;
}

/* Separatore: ogni capitolo di primo livello (tranne il primo) ha la linea sopra,
   anche se preceduto da un sottoparagrafo */
.doc-viewer__chunk[data-level="1"] {
    border-top: 1px solid var(--search-border);
    margin-top: var(--space-md);
    padding-top: var(--space-md);
}

.doc-viewer__chunk[data-level="1"]:first-child {
    border-top: 0;
    margin-top: 0;
    padding-top: var(--space-xs);
}

/* Sottoparagrafi: rientro progressivo + spazi simmetrici e compatti */
.doc-viewer__chunk[data-level="2"],
.doc-viewer__chunk[data-level="3"],
.doc-viewer__chunk[data-level="4"] {
    padding-top: var(--space-sm);
    padding-bottom: var(--space-xs);
    border-top: 0;
    margin-top: 0;
}

.doc-viewer__chunk[data-level="2"] { padding-left: var(--space-md); }
.doc-viewer__chunk[data-level="3"] { padding-left: var(--space-lg); }
.doc-viewer__chunk[data-level="4"] { padding-left: var(--space-xl); }

/* Titoli dei sottoparagrafi: gap minore tra titolo e body */
.doc-viewer__chunk[data-level="2"] .doc-viewer__chunk-title,
.doc-viewer__chunk[data-level="3"] .doc-viewer__chunk-title,
.doc-viewer__chunk[data-level="4"] .doc-viewer__chunk-title {
    margin-bottom: var(--space-xs);
}

.doc-viewer__chunk-title {
    font-family: var(--font-display);
    font-weight: 700;
    line-height: 1.2;
    margin: 0 0 var(--space-sm) 0;
    color: inherit;
    display: flex;
    align-items: baseline;
    gap: var(--space-xs);
    flex-wrap: wrap;
}

.doc-viewer__chunk-name {
    flex: 1;
    min-width: 0;
}

.doc-viewer__chunk-caret {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
    color: var(--text-muted);
    transition: transform var(--transition-normal);
    display: none; /* visibile solo in modalità accordion */
}

.doc-viewer__chunk[data-level="1"] .doc-viewer__chunk-title { font-size: var(--text-h4); }
.doc-viewer__chunk[data-level="2"] .doc-viewer__chunk-title { font-size: var(--text-h5); }
.doc-viewer__chunk[data-level="3"] .doc-viewer__chunk-title { font-size: 1.25rem; }
.doc-viewer__chunk[data-level="4"] .doc-viewer__chunk-title { font-size: 1.1rem; }

.doc-viewer__chunk-num {
    color: var(--primary);
    font-variant-numeric: tabular-nums;
    font-weight: 800;
}

.doc-viewer__chunk-body p { margin: 0 0 var(--space-sm); }
.doc-viewer__chunk-body p:last-child { margin-bottom: 0; }

.doc-viewer__chunk-body ul,
.doc-viewer__chunk-body ol {
    margin: 0 0 var(--space-sm) var(--space-md);
    padding: 0;
    list-style-position: outside;
}

.doc-viewer__chunk-body li { margin: var(--space-xxs) 0; }

/* Marker (●, numeri) colorati col primary del tema, testo invariato */
.doc-viewer__chunk-body li::marker {
    color: var(--primary);
    font-weight: 700;
}

.doc-viewer__chunk-body blockquote {
    margin: var(--space-sm) 0;
    padding: var(--space-xs) var(--space-md);
    border-left: 4px solid var(--primary);
    background: var(--bg-glass);
    border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
    font-style: italic;
    color: var(--text-secondary);
}

.doc-viewer__chunk-body a {
    color: var(--primary);
    text-decoration: underline;
    text-underline-offset: 2px;
}

.doc-viewer__chunk-body a:hover {
    color: var(--secondary);
}

.doc-viewer__chunk-body strong,
.doc-viewer__chunk-body b {
    color: var(--title-bold-color);
}

.doc-viewer__chunk-body table {
    width: 100%;
    border-collapse: collapse;
    margin: var(--space-sm) 0;
    font-size: 0.95rem;
}

.doc-viewer__chunk-body th,
.doc-viewer__chunk-body td {
    padding: var(--space-xs) var(--space-sm);
    border: 1px solid var(--search-border);
    text-align: left;
}

.doc-viewer__chunk-body th {
    background: var(--bg-glass);
    font-weight: 700;
}

.doc-viewer__chunk-body img {
    max-width: 100%;
    height: auto;
    border-radius: var(--radius-sm);
}

.doc-viewer__chunk-body code {
    background: var(--bg-glass);
    padding: 0.1em 0.35em;
    border-radius: var(--radius-sm);
    font-family: ui-monospace, "SF Mono", Menlo, monospace;
    font-size: 0.92em;
}

/* Difensivo: span con visibilità non-web sopravvissuti (non dovrebbero, RenderService li toglie) */
.doc-viewer__chunk-body span[data-visibility="pdf_only"],
.doc-viewer__chunk-body span[data-visibility="ai_only"],
.doc-viewer__chunk-body span[data-visibility="ai_pdf"] {
    display: none !important;
}


article.doc-viewer__content ul, 
article.doc-viewer__content ol {
     list-style: disc; 
}


article.doc-viewer__content li::marker {
    color: var(--primary, #3b82f6) !important;
    font-weight: 600;
}


/* =============================================================
   MOBILE (< 992px) — barra TOC fixed in alto + accordion sui chunk
   ============================================================= */

@media (max-width: 991.98px) {
            .doc-viewer .doc-viewer__chunk-body-inner{
        font-size: .8em!important;
    }
    .doc-viewer {
        padding: var(--space-3xl)  var(--space-md);
    }

    .doc-viewer__toc-eyebrow {
        display: none;
    }

    .doc-viewer__toc-trigger {
        padding: var(--space-xs);
        gap: var(--space-xs);
    }

    .doc-viewer__toc-current {
        font-size: 0.92rem;
    }

    .doc-viewer__toc-list {
        max-height: 70vh;
    }

    .doc-viewer__chunk[data-level="1"] .doc-viewer__chunk-title { font-size: var(--text-h5); }
    .doc-viewer__chunk[data-level="2"] .doc-viewer__chunk-title {font-size: 1.25rem;}

    /* ---------- Accordion (attivo solo se classe presente) ---------- */

    /* In modalità accordion l'indice sticky è nascosto: la navigazione è via titoli cliccabili */
    .doc-viewer--mobile-accordion .doc-viewer__toc {
        display: none;
    }

    .doc-viewer--mobile-accordion.doc-viewer--js .doc-viewer__chunk-title {
        cursor: pointer;
        user-select: none;
        margin: 0;
        padding: var(--space-xs) 0;
    }

    .doc-viewer--mobile-accordion.doc-viewer--js .doc-viewer__chunk-caret {
        display: inline-block;
    }

    /* Body completamente collassato di default (solo titolo visibile).
       Trick: grid sul body con 1 sola riga 0fr → 1fr; tutto il contenuto è in
       un singolo figlio (__chunk-body-inner) con overflow:hidden. */
    .doc-viewer--mobile-accordion.doc-viewer--js .doc-viewer__chunk-body {
        display: grid;
        grid-template-rows: 0fr;
        margin: 0;
        transition: grid-template-rows var(--transition-normal), margin-top var(--transition-normal);
    }

    .doc-viewer--mobile-accordion.doc-viewer--js .doc-viewer__chunk-body-inner {
        min-height: 0;
        overflow: hidden;
    }

    .doc-viewer--mobile-accordion.doc-viewer--js .doc-viewer__chunk[data-open="true"] .doc-viewer__chunk-body {
        grid-template-rows: 1fr;
        /* margin-top: var(--space-sm); */
        /* background: var(--gradient-hero); */
        /* padding: 6px; */
        /* margin: -6px; */
        /* margin-bottom: 13px; */
        /* border-radius: 12px; */
    }

    .doc-viewer--mobile-accordion.doc-viewer--js .doc-viewer__chunk[data-open="true"] .doc-viewer__chunk-body-inner {
        /* overflow: visible; */
        margin-bottom: var(--space-sm);
    }

    .doc-viewer--mobile-accordion.doc-viewer--js .doc-viewer__chunk[data-open="true"] .doc-viewer__chunk-caret {
        transform: rotate(180deg);
    }

    /* In accordion riduco padding del chunk per allineare i titoli compatti */
    .doc-viewer--mobile-accordion .doc-viewer__chunk {
        padding-bottom: 0;
        margin-top: 0px;
        padding-top: 4px;
        /* padding-left: 2px; */
        margin: 0 0 var(--space-sm) 0;
    }
    .doc-viewer__chunk[data-level="2"]
 {
    padding-left: 9px;
    margin: -3px;
    padding: 0;
    padding-left: 9px;
}
}

/* =============================================================
   DESKTOP (>= 992px) — sidebar TOC fissa a sinistra
   ============================================================= */

@media (min-width: 992px) {
    .doc-viewer--desktop-sidebar .doc-viewer__layout {
        display: grid;
        grid-template-columns: 336px minmax(0, 1fr);
        gap: var(--space-xl);
        align-items: start;
    }

    /* Evita che tabelle/immagini/testo lungo facciano espandere il grid track */
    .doc-viewer--desktop-sidebar .doc-viewer__content {
        min-width: 0;
        max-width: 100%;
        overflow-wrap: anywhere;
    }

    .doc-viewer--desktop-sidebar .doc-viewer__content img,
    .doc-viewer--desktop-sidebar .doc-viewer__content table {
        max-width: 100%;
    }

    .doc-viewer--desktop-sidebar .doc-viewer__content pre,
    .doc-viewer--desktop-sidebar .doc-viewer__content table {
        overflow-x: auto;
    }

    .doc-viewer--desktop-sidebar .doc-viewer__toc {
        margin: 0;
        position: sticky;
        top: var(--doc-viewer-sticky-top);
        height: calc(100vh - var(--doc-viewer-sticky-top) - var(--space-md));
        min-height: 0;
    }

    .doc-viewer--desktop-sidebar .doc-viewer__toc-inner {
        display: flex;
        flex-direction: column;
        height: 100%;
        min-height: 0;
    }

    /* In sidebar mode il trigger collassabile non serve: nasconde il bottone, mostra sempre la lista */
    .doc-viewer--desktop-sidebar .doc-viewer__toc-trigger {
        display: none;
    }

    .doc-viewer--desktop-sidebar .doc-viewer__toc-list {
        position: static;
        opacity: 1;
        transform: none;
        pointer-events: auto;
        background: transparent;
        border: 0;
        box-shadow: none;
        flex: 1 1 auto;
        min-height: 0;
        max-height: none;
        overflow-y: auto;
        overscroll-behavior: contain;
        padding: var(--space-xs);
        /* Scrollbar discreta */
        scrollbar-width: thin;
        scrollbar-color: rgba(var(--primary-rgb), 0.4) transparent;
    }

    .doc-viewer--desktop-sidebar .doc-viewer__toc-list::-webkit-scrollbar {
        width: 6px;
    }
    .doc-viewer--desktop-sidebar .doc-viewer__toc-list::-webkit-scrollbar-track {
        background: transparent;
    }
    .doc-viewer--desktop-sidebar .doc-viewer__toc-list::-webkit-scrollbar-thumb {
        background: rgba(var(--primary-rgb), 0.35);
        border-radius: var(--radius-sm);
    }
    .doc-viewer--desktop-sidebar .doc-viewer__toc-list::-webkit-scrollbar-thumb:hover {
        background: rgba(var(--primary-rgb), 0.6);
    }

    .doc-viewer--desktop-sidebar .doc-viewer__toc-item {
        font-size: 0.89rem;
    }
}