/*
    CSS style for captcha module
    @author: Krystian MAGDZIARZ
 */
/* --- Form style --- */

#id_captcha_image {
    border: 1px solid #D0D0D0 !important;
    border-radius: 4px !important;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
    -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
    -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
}

audio {
    vertical-align: middle;
    margin-top: 1rem;
}

label[for=id_solution] {
    display: block;
}

#id_captcha_solution {
    max-width: 120px;
    display: inline-block;
}

/* --- Icons --- */

#audio_icon,
#refresh_icon,
#mute_icon {
    margin-left: 2px;
    height: 18px;
    width: auto;
    line-height: 8px;
    display: inline-block;
}

#audio_icon {
    content: url("/m/captcha/css/volume-up-solid.svg");
}

#refresh_icon {
    content: url("/m/captcha/css/sync-alt-solid.svg");
}

#mute_icon {
    content: url("/m/captcha/css/volume-mute-solid.svg");
}

.rotate_icon {
    -webkit-animation: spin 12s linear infinite;
    -moz-animation: spin 12s linear infinite;
    animation: spin 12s linear infinite;
}

@-moz-keyframes spin {
    100% {
        -moz-transform: rotate(360deg);
    }
}

@-webkit-keyframes spin {
    100% {
        -webkit-transform: rotate(360deg);
    }
}

@keyframes spin {
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

/* --- Alerts --- */

.alert-info,
.alert-success,
.alert-error,
.alert-danger {
    padding: 8px;
    border-radius: 4px;
    font-size: 14px;
}

.alert-info {
    background-color: #d9edf7;
    color: #31708f;
}

.alert-success {
    background-color: #dff0d8;
    color: #3c763d;
}

.alert-error,
.alert-danger {
    background-color: #f2dede;
    color: #a94442;
}