/**
 * Tooltip.
 *
 * @package fwdsc
 * @since fwdsc 1.0
 */

 /* Tooltip. */
.fwdsc-tooltip{
    position: absolute !important;
    pointer-events: none !important;
    white-space: nowrap !important;
    font-family: Roboto !important;
    font-size: 14px !important;
    font-style: normal !important;
    font-weight: 400 !important;
    line-height: 24px !important;
    box-sizing: border-box !important;
    border-radius: 12px !important;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2) !important;
    padding: 10px !important;
    background: #FFF !important;
    color: #000 !important;
}

.fwdsc-tooltip:after {
    content: "" !important;
    position: absolute !important;
    width: 0 !important;
    height: 0 !important;
    margin-left: 10px !important;
    bottom: -12px !important;
    left: 2px !important;
    box-sizing: border-box !important;
    border: 6px solid black !important;
    border-color: transparent transparent #fff #fff !important;
    transform-origin: 0 0 !important;
    transform: rotate(-45deg) !important;
    box-shadow: -3px 3px 3px 0 rgba(0, 0, 0, 0.1) !important;
}


/* Error. */
.fwdsc-error{
    animation: fwdscColorChange .14s ease-in 4 forwards;
}

@keyframes fwdscColorChange{
    0% {
        border-color: white;
    }
    100% {
        border-color: rgba(255, 0, 0, .5); 
    }
}