/* 1. TEMA BASE */
@import url("https://theme-park.dev/css/base/filebrowser/dark.css");

/* 2. IDENTIDADE VISUAL (LOGO E TÍTULO ALINHADOS EM PAUTA) */

/* Esconder originais */
#login h1, #login img, header .logo img {
    display: none !important;
}

/* Container de Login - Ajustado para a altura da sua marcação vermelha */
#login {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    padding-top: 30vh; 
}

/* Criar um invólucro para a marca (Logo + Texto) ficarem na mesma pauta */
#login::before {
    content: "Arquivos Suporte"; 
    display: flex !important;
    align-items: center !important; 
    color: #ffffff;
    font-size: 2rem;
    font-weight: bold;
    margin-bottom: 25px !important; 
}

/* Inserir a imagem ANTES do texto dentro do flex */
#login::before {
    background-image: url('img/logo.png');
    background-repeat: no-repeat;
    background-position: left center;
    background-size: 45px 45px; 
    padding-left: 60px; 
    height: 45px; 
    line-height: 45px;
}

/* Remover o ::after antigo para não duplicar o nome */
#login::after {
    content: none !important;
}

/* Garantir que o formulário de login apareça corretamente abaixo */
#login form {
    margin-top: 0 !important;
    width: 100%;
    max-width: 300px;
}

/* Header (Dashboard) - Consistência visual */
header .logo {
    background: url('img/logo.png') no-repeat center !important;
    background-size: contain !important;
    width: 35px !important;
    height: 35px !important;
    margin-right: 10px !important;
    display: inline-block !important;
    vertical-align: middle !important;
}

#name {
    font-weight: 600 !important;
    font-size: 1.2rem !important;
}

/* 3. CONFIGURAÇÕES DE LISTAGEM E PASTAS */
#listing.list .item { padding: 0.7em; }

/* RESTAURAR E COLORIR PASTAS (AMARELO) */
#listing .item[data-dir=true] .material-icons,
#listing .item[data-dir=true] i {
    visibility: visible !important;
    color: #ffc84b !important;
    display: inline-block !important;
}

/* 4. CORES E ÍCONES POR EXTENSÃO (O TEU CÓDIGO COMPLETO) */

/* Compactados (Archive) - Roxo */
#listing .item[aria-label$=".7z"] i, #listing .item[aria-label$=".zip"] i,
#listing .item[aria-label$=".rar"] i, #listing .item[aria-label$=".tar"] i,
#listing .item[aria-label$=".gz"] i { 
    color: #a268a1 !important; 
    visibility: visible !important;
}

/* PDF - Amarelo Sumatra */
#listing .item[aria-label$=".pdf"] i, #listing .item[aria-label$=".pdf"] .material-icons { 
    color: #FFEE00 !important; 
    visibility: visible !important;
}

/* Documentos (Word) - Azul */
#listing .item[aria-label$=".doc"] i, #listing .item[aria-label$=".docx"] i,
#listing .item[aria-label$=".odt"] i, #listing .item[aria-label$=".wri"] i {
    color: #185ABD !important;
    visibility: visible !important;
}

/* Planilhas (Excel) - Verde */
#listing .item[aria-label$=".xls"] i, #listing .item[aria-label$=".xlsx"] i,
#listing .item[aria-label$=".ods"] i { 
    color: #107C41 !important; 
    visibility: visible !important;
}

/* Multimédia (Som/Vídeo) - Laranja */
#listing .item[data-type=audio] i, #listing .item[data-type=video] i { 
    color: #F47900 !important; 
    visibility: visible !important;
}

/* Garantir que a fonte de ícones do sistema carregue */
.material-icons {
    font-family: 'Material Icons' !important;
    visibility: visible !important;
}