.root {
    position: relative;
    min-height: 104px;
    border: 2px dashed var(--uui-file-card-background);
    display: flex;
    align-items: center;
    justify-content: center;
    white-space: pre;

    &.drop-start {
        border: 2px dashed var(--uui-file-card-dropstart-border);
    }

    &.drop-over {
        background-color: var(--uui-file-card-dropstart-background);
    }

    .link {
        color: var(--uui-file-card-dropstart-border);

        &:hover {
            color: var(--uui-file-card-link-hover);
        }
    }

    .drop-area {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
    }

    .icon-blue {
        fill: var(--uui-file-card-dropstart-border);
        margin-right: 6px;
    }
}
