﻿.files-container {
    padding: 1em;
    /*display: grid;*/
    /*grid-template-columns: repeat(auto-fit, minmax(18rem, 1fr));*/
    /*row-gap: 1rem;*/
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 1rem;
}

    .files-container .document {
        flex: 1;
        display: flex;
        flex-direction: column;
        padding: 1rem;
        border-radius: 1.5rem;
        background: var(--blue-gray);
        box-shadow: var(--soft-continer-outer-shadow);
        transition: 0.3s ease-in-out;
        width: 18rem;
        border: 1px solid transparent;
    }
        .files-container .document:hover {
            transform: translateY(-3%);
            box-shadow: var(--soft-hover-continer-outer-shadow);
        }
        .files-container .document.active {
            border: 1px solid var(--primary-green);
        }
        .files-container .document .file-icon {
            display: flex;
            font-size: 4rem;
        }
        .files-container .document span {
            font-size: var(--font-size-small);
            font-weight: 400;
            color: var(--gray);
        }
        .files-container .document span[save-edit-button] {
            font-size: 1.3rem;
            margin-left: 0.5rem;
            cursor: pointer;
            transition: all 0.2s ease-in-out;
        }
            .files-container .document span[save-edit-button]:hover {
                color: var(--primary-green);
                transform: scale(1.1);
            }
        .files-container .document p, .files-container .document span {
            padding: 0;
            margin: 0;
        }
        .files-container .document p {
            font-size: var(--font-size-normal);
            font-weight: 600;
            margin-bottom: 0.35rem;
            width: 10rem;
            max-height: 2rem;
            text-overflow: ellipsis;
            white-space: nowrap;
            overflow: hidden;
        }

#document-properties-modal{
    width: 50vw; 
    height: 60vh;
    resize: both;
    overflow: auto
}

#documentUploadLoader {
    font-size: 2.2rem;
    --track-width: 0.5rem;
}