/* ==========================================
   ASEM ORAR VIEWER - STILURI COMPLETE
   Adaptate fidel după filetree.css original
   ========================================== */

/* === RESET LISTE ARBORE === */
#directoryStructure ul {
    list-style: none !important;
    margin: 0;
    padding-left: 0;
}

#directoryStructure ul.level-1 {
    padding-left: 0 !important;
}

#directoryStructure ul:not(.level-1) {
    padding-left: 15px !important;
    border-left: 1px solid #D9DADB;
}

/* === ELEMENTE ARBORE === */
.filetree li {
    list-style: none !important;
    position: relative;
    padding: 2px 0 2px 10px;
    margin: 0;
    white-space: nowrap;
    line-height: 26px;
    font-family: Verdana, sans-serif;
    font-size: 14px;
}

/* Linii de conectare orizontale */
.filetree li::before {
    content: "\2014";
    position: absolute;
    left: -8px;
    color: #D9DADB;
    font-size: 12px;
    line-height: 26px;
}

.filetree ul.level-1>li::before {
    content: "" !important;
}

/* === FOLDERE === */
.filetree .folder>b {
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 0 4px;
    border-radius: 3px;
    transition: background 0.15s;
    color: #333;
    font-weight: 600;
}

.filetree .folder>b:hover {
    background: #BDF;
}

/* Iconițe folder (FontAwesome) */
.filetree .folder.collapsed>b::before {
    font-family: "Font Awesome 6 Free", "FontAwesome";
    content: "\f07b";
    display: inline-block;
    width: 16px;
    font-weight: 900;
    color: #1e73be;
    font-size: 14px;
}

.filetree .folder.expanded>b::before {
    font-family: "Font Awesome 6 Free", "FontAwesome";
    content: "\f07c";
    display: inline-block;
    width: 16px;
    font-weight: 900;
    color: #006D77;
    font-size: 14px;
}

/* Foldere ascunse */
.filetree .folder.collapsed>ul {
    display: none;
}

/* Link-uri externe din folder_map */
.filetree .folder-link {
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.filetree .folder-link a {
    color: #1e73be;
    text-decoration: none;
    font-weight: 600;
}

.filetree .folder-link a:hover {
    background: #BDF;
    text-decoration: underline;
    border-radius: 3px;
}

/* === FIȘIERE — ICONIȚĂ + TEXT PE ACELAȘI RÂND === */
.filetree .file {
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 2px 4px;
    border-radius: 3px;
    transition: background 0.15s;
    color: #333;
    /* ★ Suprascriem ::before de la li generic */
}

/* Eliminăm linia orizontală pentru fișiere (o păstrăm doar structural) */
.filetree .file::before {
    content: "\2014";
    position: absolute;
    left: -8px;
    color: #D9DADB;
    font-size: 12px;
    line-height: 26px;
    width: auto;
    height: auto;
    background: none;
}

.filetree .file:hover {
    background: #BDF;
}

.filetree .file:active {
    background: #a8d4ff;
}

/* === ICONIȚE FIȘIERE (imagini din assets/css/images/) === */
.filetree .ext-pdf::after {
    content: "";
    display: inline-block;
    width: 16px;
    height: 18px;
    min-width: 16px;
    background: url(images/pdf.png) no-repeat left top;
    background-size: contain;
    order: -1;
    /* ★ Iconița ÎNAINTEA textului */
}

.filetree .ext-doc::after,
.filetree .ext-docx::after {
    content: "";
    display: inline-block;
    width: 16px;
    height: 18px;
    min-width: 16px;
    background: url(images/docx.png) no-repeat left top;
    background-size: contain;
    order: -1;
}

.filetree .ext-xls::after,
.filetree .ext-xlsx::after {
    content: "";
    display: inline-block;
    width: 16px;
    height: 18px;
    min-width: 16px;
    background: url(images/xlsx.png) no-repeat left top;
    background-size: contain;
    order: -1;
}

.filetree .ext-jpg::after,
.filetree .ext-jpeg::after,
.filetree .ext-png::after {
    content: "";
    display: inline-block;
    width: 16px;
    height: 18px;
    min-width: 16px;
    background: url(images/picture.png) no-repeat left top;
    background-size: contain;
    order: -1;
}

/* ==========================================
   ICONIȚĂ PENTRU LINK-UL "DESCARCĂ"
   Reutilizează aceleași imagini ca în arbore
   ========================================== */
.aov-file-icon {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-weight: 600;
    vertical-align: middle;
}

.aov-file-icon.ext-pdf::before,
.aov-file-icon.ext-doc::before,
.aov-file-icon.ext-docx::before,
.aov-file-icon.ext-xls::before,
.aov-file-icon.ext-xlsx::before,
.aov-file-icon.ext-jpg::before,
.aov-file-icon.ext-jpeg::before,
.aov-file-icon.ext-png::before {
    content: "";
    display: inline-block;
    width: 16px;
    height: 18px;
    min-width: 16px;
    background-repeat: no-repeat;
    background-position: left top;
    background-size: contain;
}

.aov-file-icon.ext-pdf::before {
    background-image: url(images/pdf.png);
}

.aov-file-icon.ext-doc::before,
.aov-file-icon.ext-docx::before {
    background-image: url(images/docx.png);
}

.aov-file-icon.ext-xls::before,
.aov-file-icon.ext-xlsx::before {
    background-image: url(images/xlsx.png);
}

.aov-file-icon.ext-jpg::before,
.aov-file-icon.ext-jpeg::before,
.aov-file-icon.ext-png::before {
    background-image: url(images/picture.png);
}

/* === CULORI PER NIVEL (ca în original) === */
.filetree ul.level-1>li>b,
.filetree ul.level-1>li>.folder-link a {
    color: #c0392b;
}

.filetree ul.level-2>li>b,
.filetree ul.level-2>li>.folder-link a {
    color: #1e73be;
}

.filetree ul.level-3>li>b,
.filetree ul.level-3>li>.folder-link a {
    color: #1e8449;
}

.filetree ul.level-4>li>b,
.filetree ul.level-4>li>.folder-link a {
    color: #7d3c98;
}

.filetree ul.level-5>li>b,
.filetree ul.level-5>li>.folder-link a {
    color: #d35400;
}

.filetree ul.level-6>li>b,
.filetree ul.level-6>li>.folder-link a {
    color: #2c3e50;
}

/* === WRAPPER GENERAL === */
.aov-wrapper {
    min-height: 750px;
}

#fileViewer {
    background: #fff;
    border: 1px solid #ccc;
    padding: 10px;
    border-radius: 4px;
    overflow: hidden;
}

/* === TOOLBAR PDF.JS === */
#pdfToolbar {
    background: #f8f9fa;
    border-bottom: 1px solid #dee2e6;
    padding: 8px 12px;
    border-radius: 4px 4px 0 0;
}

#pdfToolbar button {
    font-size: 14px;
    padding: 2px 10px;
}

#pdfCanvas {
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    margin: 10px auto;
}

/* === BUTON TOGGLE MOBIL === */
.aov-tree-toggle {
    display: none;
    width: 100%;
    padding: 12px 16px;
    background: #0d6efd;
    color: #fff;
    border: none;
    border-radius: 6px;
    font-size: 16px;
    font-weight: 500;
    margin-bottom: 10px;
    cursor: pointer;
    text-align: left;
    transition: background 0.2s;
}

.aov-tree-toggle:hover {
    background: #0b5ed7;
}

.aov-tree-toggle::after {
    content: ' ▼';
    float: right;
}

.aov-tree-toggle.active::after {
    content: ' ▲';
}

/* ==========================================
   MOBILE OPTIMIZATIONS (< 992px)
   ========================================== */
@media (max-width: 991.98px) {
    .aov-wrapper .container {
        padding-left: 0;
        padding-right: 0;
    }

    .aov-wrapper .row.mb-3 .col-12,
    #directoryStructureWrapper {
        padding-left: 15px;
        padding-right: 15px;
    }

    .aov-tree-toggle {
        display: block;
    }

    #directoryStructure.collapsed-mobile {
        display: none;
    }

    #fileViewer {
        width: 100vw !important;
        max-width: 100vw !important;
        height: 80vh !important;
        margin-left: calc(-50vw + 50%) !important;
        border: none !important;
        border-radius: 0 !important;
        position: sticky;
        top: 0;
        z-index: 100;
        background: #fff;
    }

    #pdfToolbar {
        position: sticky;
        top: 0;
        z-index: 101;
        border-radius: 0;
        margin-left: calc(-50vw + 50%);
        width: 100vw;
        max-width: 100vw;
    }

    #fileDownloadLink {
        text-align: center;
        padding: 10px 15px;
    }

    #fileViewer .spinner-border {
        width: 3rem;
        height: 3rem;
    }

    .aov-wrapper .row {
        flex-direction: column;
    }

    #directoryStructureWrapper {
        margin-bottom: 10px;
    }
}

/* === TABLET === */
@media (min-width: 992px) and (max-width: 1199.98px) {
    #fileViewer {
        height: 600px;
    }
}

/* === DESKTOP === */
@media (min-width: 1200px) {
    #fileViewer {
        height: 700px;
    }
}

/* === SMOOTH SCROLL === */
html {
    scroll-behavior: smooth;
}

/* === GOODLAYERS COMPAT === */
.gdlr-core-pbf-column {
    padding: 0 !important;
}

/* ★ ELIMINĂ LINIA ORIZONTALĂ PENTRU NIVELUL 1 */
.filetree ul.level-1>li::before {
    content: "" !important;
}

/* Elimină linia orizontală pentru nivelul 1 */
.filetree li.no-line::before {
    content: none !important;
}


/* ==========================================
   TRUNCHIERE NUME LUNGI + TOOLTIP LA HOVER
   ========================================== */

/* Containerul nu lasă textul să iasă */
.filetree .file {
    max-width: 100%;
    overflow: visible;
    /* tooltip-ul trebuie să poată ieși */
}

/* Numele fișierului: ellipsis când nu încape */
.filetree .file .file-name {
    display: block;
    flex: 1;
    min-width: 0;
    /* Critic pentru flexbox ellipsis */
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Tooltip stilizat la hover */
.filetree .file::after {
    /* Păstrează iconița existentă - nu o modifica */
}

.filetree .file .file-tooltip {
    display: none;
    position: absolute;
    left: 24px;
    top: calc(100% + 2px);
    z-index: 1000;
    background: #2c3e50;
    color: #fff;
    padding: 6px 10px;
    border-radius: 5px;
    font-size: 12px;
    line-height: 1.4;
    white-space: normal;
    /* ★ permite wrap pe mai multe rânduri */
    max-width: 320px;
    min-width: 150px;
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.3);
    pointer-events: none;
    /* nu blochează click-urile */
}

/* Săgeată tooltip */
.filetree .file .file-tooltip::before {
    content: "";
    position: absolute;
    top: -5px;
    left: 12px;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-bottom: 5px solid #2c3e50;
}

.filetree .file:hover .file-tooltip {
    display: block;
}


/* ==========================================
   BUTON "ÎNAPOI LA NAVIGARE" (MOBIL)
   Fixed față de viewport, apare doar la scroll
   ========================================== */
.aov-back-to-nav {
    display: none;
    position: fixed;
    left: 16px;
    bottom: 16px;
    bottom: calc(100vh - 100vh + 16px);
    bottom: calc(100dvh - 100dvh + 16px);
    z-index: 9999;
    background: #0d6efd;
    color: #fff;
    border: none;
    border-radius: 10px;
    padding: 10px 22px;
    font-size: 15px;
    font-weight: 600;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.35);
    cursor: pointer;
    opacity: 0;
    visibility: hidden;
    transform: translateY(20px);
    transition: opacity 0.3s ease, transform 0.3s ease, visibility 0.3s;
    white-space: nowrap;
    pointer-events: none;
}

.aov-back-to-nav.visible {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    pointer-events: auto;
}

.aov-back-to-nav:hover {
    background: #0b5ed7;
}

/* Vizibil DOAR pe mobil */
@media (max-width: 991.98px) {
    .aov-back-to-nav {
        display: block;
    }
}

/* ==========================================
   INDICATOR FIȘIER ACTIV
   ========================================== */
.filetree .file.active {
    background: #0d6efd !important;
    color: #fff !important;
    border-radius: 4px;
}

.filetree .file.active .file-name {
    color: #fff !important;
}

/* Asigură că iconița rămâne vizibilă pe fundal albastru */
.filetree .file.active::after {
    filter: brightness(0) invert(1);
    /* Face iconița albă */
}