// @import "../core/core";

@mixin dc-toast-container {
    position: fixed;
}

@mixin dc-toast-container--top {
    top: 0;
}

@mixin dc-toast-container--bottom {
    top: auto;
    bottom: 0;
}

@mixin dc-toast {
    padding: 0 $dc-space100 $dc-space75;
    z-index: $dc-z-index100;
}

@mixin dc-toast--top {
    animation: dc-toast-animation--top;
    animation-iteration-count: 1;
    animation-direction: forwards;
}

@mixin dc-toast--bottom {
    padding: $dc-space75 $dc-space100 0;
    animation-name: dc-toast-animation--bottom;
    animation-iteration-count: 1;
    animation-direction: forwards;
}

@mixin dc-toast__content {
    width: 100%;
    padding: $dc-space100 0;
    border-width: $dc-border50;
    border-style: solid;
    border-radius: $dc-radius50;
    font-size: $dc-font50;
    font-weight: $dc-bold-font-weight;
    line-height: 1.2;
    text-align: center;
    text-transform: uppercase;
}

@mixin dc-toast__content--info {
    border-color: $dc-blue60;
    background-color: $dc-blue80;
    color: $dc-blue20;
}

@mixin dc-toast__content--success {
    border-color: $dc-green50;
    background-color: $dc-green80;
    color: $dc-green20;
}

@mixin dc-toast__content--warning {
    border-color: $dc-yellow40;
    background-color: $dc-yellow80;
    color: $dc-yellow20;
}

@mixin dc-toast__content--error {
    border-color: $dc-red70;
    background-color: $dc-red80;
    color: $dc-red20;
}

@mixin dc-toast-animations {
    @keyframes dc-toast-animation--bottom {
        0% {
            transform: translate(0, 100%);
        }

        25% {
            transform: translate(0, 0);
        }

        50% {
            transform: translate(0, 0);
        }

        100% {
            transform: translate(0, 100%);
        }
    }

    @keyframes dc-toast-animation--top {
        0% {
            transform: translate(0, -100%);
        }

        25% {
            transform: translate(0, 0);
        }

        50% {
            transform: translate(0, 0);
        }

        100% {
            transform: translate(0, -100%);
        }
    }
}

@mixin dc-toast-selectors {

    @include dc-toast-animations;

    .dc-toast-container {
        @include dc-toast-container;
    }

    .dc-toast-container--top {
        @include dc-toast-container--top;
    }

    .dc-toast-container--bottom {
        @include dc-toast-container--bottom;
    }

    .dc-toast {
        @include dc-toast;
    }

    .dc-toast--top {
        @include dc-toast--top;
    }

    .dc-toast--bottom {
        @include dc-toast--bottom;
    }

    .dc-toast__content {
        @include dc-toast__content;
    }

    .dc-toast__content--info {
        @include dc-toast__content--info;
    }

    .dc-toast__content--success {
        @include dc-toast__content--success;
    }

    .dc-toast__content--warning {
        @include dc-toast__content--warning;
    }

    .dc-toast__content--error {
        @include dc-toast__content--error;
    }
}
