// (C) 2007-2021 GoodData Corporation
.gd-dropzone {
    position: relative;

    &::before,
    &::after {
        content: "";
        position: absolute;
        display: block;
    }

    &-message {
        text-align: center;
    }
}

.gd-dropzone-delete {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: $gd-color-white;

    &::before {
        top: 10px;
        right: 10px;
        bottom: 10px;
        left: 10px;
        border: 3px dashed $gd-color-highlight;
        border-radius: 15px;
        background-color: $gd-color-highlight-dimmed;
    }

    &::after {
        top: 23px;
        right: 23px;
        bottom: 23px;
        left: 23px;
        border-radius: 7px;
    }

    .gd-dropzone-message {
        z-index: 1;
        flex: 1 1 auto;
        margin: 0 23px;
        color: $gd-color-text;
        font-size: 14px;

        &::before {
            content: "\E61A";
            display: block;
            line-height: 80px;
            color: $gd-color-highlight;
            font-family: Indigo, sans-serif;
            font-size: 50px;
        }
    }

    &.gd-dropzone-over {
        &::after {
            background-color: $gd-color-highlight;
        }

        .gd-dropzone-message {
            &,
            &::before {
                color: $gd-color-text-light;
            }
        }
    }
}