/*
 * Stylesheet for custom template with reCAPTCHA
 * Stealed (template + scss) on https://github.com/chrisvanpatten/responsive-recaptcha
 */
//@import "compass/reset";
@import "compass/css3";

// Settings
$recaptcha-base-color: #F1F1F1 !default;
$recaptcha-border-radius: 4px !default;
$recaptcha-border-radius-inner: 2px !default;
$recaptcha-input-background: #F9F9F9 !default;
$recaptcha-icons-color: #000000 !default;
$recaptcha-icons-shadow: 0 1px 1px black !default;

// reCAPTCHA container
.recaptcha_widget {
    @include box-sizing('border-box');
    max-width: 300px;
    border: 4px solid $recaptcha-base-color;
    @include border-radius( $recaptcha-border-radius );
    background: $recaptcha-base-color;
    margin: 0 0 10px;
}

// Showing an image...
#recaptcha_image {
    width: 100% !important;
    height: auto !important;

    img {
        @include box-sizing('border-box');
        width: 100%;
        height: auto;
        @include border-radius( $recaptcha-border-radius-inner );
        border: 3px solid #FFF;
    }
}

// Showing audio...
.recaptcha_is_showing_audio {
    embed {
        height: 0;
        width: 0;
        overflow: hidden;
    }

    #recaptcha_image {
        @include box-sizing('border-box');
        width: 100%;
        height: 60px;
        background: #FFF;
        @include border-radius( $recaptcha-border-radius-inner );
        border: 3px solid #FFF;

        br {
            display: none;
        }

        #recaptcha_audio_download {
            display: block;
        }
    }
}

// Input area container
.recaptcha_input {
    background: $recaptcha-input-background;
    color: #000;
    font: 13px/1.5 'HelveticaNeue', 'Helvetica Neue', Helvetica, Arial, 'Liberation Sans', FreeSans, sans-serif;
    margin: 4px 0 0;
    padding: 0 4px 4px;
    border: 4px solid $recaptcha-input-background;
    @include border-radius( $recaptcha-border-radius-inner );

    label {
        margin: 0 0 6px;
        @include box-sizing('border-box');
    }

    input {
        width: 100%;
    }
}

// Icon options
.recaptcha_options {
    list-style: none;
    margin: 4px 4px 10px;
    height: 18px;

    li {
        float: left;
        margin: 0 6px 0 0;

        a {
            text-decoration: none;
            @include text-shadow( $recaptcha-icons-shadow );
            font-size: 16px;
            color: $recaptcha-icons-color;
            display: block;
            width: 20px;
            height: 18px;

            &:active {
                position: relative;
                top: 1px;
                @include text-shadow(none);
            }
        }
    }
}

// Hide icon labels
.captcha_hide {
    display: none;
}
