/* Estilos para o upload de arquivos */

/* Estilo para o container de input de arquivo */
.input-group-file {
    position: relative;
    display: flex;
    align-items: center;
    height: 48px;
    /* Ajustado para corresponder à variável --form-control-height */
    border: 2px solid var(--current-border);
    /* Ajustado para 2px conforme solicitado */
    border-radius: 8px;
    /* Mantendo o border-radius consistente */
    background-color: rgba(255, 255, 255, 0.03);
    overflow: hidden;
}

/* Estilo para o campo de input de arquivo - mantendo contorno mas ocultando botão */
.input-group-file input[type="file"] {
    cursor: pointer;
    opacity: 0;
    /* Torna o input totalmente invisível */
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 2;
    /* Garante que esteja acima do fundo mas abaixo do ícone */
}

/* Garantir que o ícone do clipe seja exibido */
.input-group-file i.fas.fa-paperclip {
    position: absolute;
    left: 10px;
    top: 50%;
    transform: translateY(-50%);
    z-index: 3;
    /* Maior que o z-index do input para garantir visibilidade */
    color: var(--current-text-muted, #666);
    pointer-events: none;
    /* Permite que os cliques passem através do ícone */
    font-size: 1rem;
}

/* Adiciona um texto placeholder para mostrar que é um campo de arquivo */
.input-group-file::after {
    content: "Clique para anexar um arquivo";
    position: absolute;
    left: 35px;
    /* Posiciona após o ícone */
    top: 50%;
    transform: translateY(-50%);
    color: var(--current-text-muted, #999);
    pointer-events: none;
    z-index: 1;
    font-size: 0.9rem;
}

/* Remove o botão "Escolher arquivo" em todos os navegadores */
.input-group-file input[type="file"]::-webkit-file-upload-button {
    display: none;
    /* Oculta o botão nos navegadores WebKit */
}

/* Para Firefox e outros navegadores */
.input-group-file input[type="file"]::file-selector-button {
    display: none;
}

/* Quando um arquivo está selecionado, modificamos o texto do placeholder */
.input-group-file.file-selected::after {
    content: "Arquivo selecionado";
    color: var(--badge-success, #4CAF50);
}

/* Estilo para o container do input quando tem arquivo selecionado - sem transições */
.input-group-file.file-selected {
    background-color: rgba(255, 255, 255, 0.03);
    border: 2px solid var(--current-border);
    /* Usando variável de tema para a borda com espessura de 2px */
}

/* Estilo para exibição do nome do arquivo */
.file-name-display {
    position: absolute;
    bottom: -22px;
    left: 0;
    font-size: 0.85rem;
    color: var(--current-text-muted, #666);
    max-width: calc(100% - 30px);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding: 2px 5px;
    background-color: var(--current-surface, rgba(255, 255, 255, 0.7));
    border-radius: 3px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
}

/* Botão para limpar a seleção do arquivo */
.clear-file {
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    color: var(--current-text-muted, #999);
    cursor: pointer;
    font-size: 1rem;
    padding: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 3;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    /* Removida a transição */
}

.clear-file:hover {
    color: var(--orange-2, #ff5722);
    background-color: var(--orange-6, rgba(255, 87, 34, 0.1));
    transform: translateY(-50%);
    /* Removido o efeito de escala */
}

/* Adiciona um pequeno espaço abaixo do grupo de input para acomodar o nome do arquivo */
.input-group:has(input[type="file"]) {
    margin-bottom: 25px;
}

/* Estilo para o ícone do arquivo quando selecionado - sem mudança de cor */
.input-group.has-file i.fas.fa-paperclip,
.input-group-file.file-selected i.fas.fa-paperclip {
    color: var(--current-text-muted, #666);
    /* Mantendo a mesma cor */
}

/* Indicador visual quando um arquivo é adicionado */
.input-group.has-file::after {
    content: "✓";
    position: absolute;
    right: 40px;
    top: 50%;
    transform: translateY(-50%);
    color: var(--badge-success, #4CAF50);
    font-weight: bold;
    font-size: 14px;
}

/* Melhoria visual para o input de arquivo quando tem arquivo selecionado */
.input-group.has-file {
    background-color: var(--orange-6, rgba(255, 152, 0, 0.1));
    border: 2px solid var(--current-border);
}

/* Ajuste específico para tema escuro quando tem arquivo selecionado */
body.theme-dark .input-group.has-file {
    background-color: rgba(255, 152, 0, 0.15);
    border-color: rgba(255, 152, 0, 0.5);
}

/* Removidas animações para seleção de arquivo */