/**
 *  If you want to override some bootstrap variables, you have to change values here.
 *  The list of variables are listed here bower_components/bootstrap-sass-official/assets/stylesheets/bootstrap/_variables.scss
 */
// $navbar-inverse-link-color: #5AADBB;
$icon-font-path: "../../bower_components/bootstrap-sass-official/assets/fonts/bootstrap/";


/**
 *  Do not remove this comments bellow. It's the markers used by wiredep to inject
 *  sass dependencies when defined in the bower.json of your dependencies
 */
// bower:scss
// endbower

// -------------
// Variables
// -------------

$gray: #f1f1f1;
$defaultblue: #5E749D;

// -------------

//   1.4 - dicionarios
$categories: (saude: #3449b7, seguranca-publica: #e34748, educacao: #f39720, reducao-da-pobreza: #3ebb8f, cultura: #a63738);
$categories-descriptions: (saude: "Saúde é direito de todos e dever do Estado. O Sistema Único de Saúde (SUS) é universal, integral e de responsabilidade do Governo Federal, estados e municípios. Atende a todos os brasileiros.", seguranca-publica: "A segurança pública é um direito fundamental dos cidadãos. A proteção da vida, a disseminação da cultura da paz e a integração dos órgãos e instituições municipais, estaduais e federais são os maiores compromissos dessa política pública.", educacao: "Uma pátria educadora se faz com oportunidades para todos. Nos últimos anos, o Brasil criou esse caminho de oportunidades. Ampliamos o acesso à educação em todos os níveis de ensino – da creche à pós-graduação – e para todos os brasileiros, independentemente de sua classe social. E ainda há muito a fazer. O Plano Nacional de Educação (PNE) estabelece novas metas para que o governo federal trabalhe em parceria com a sociedade, com os estados e os municípios na construção de um futuro melhor. Queremos agora um salto na qualidade do ensino.", reducao-da-pobreza: "Com o esforço do Brasil para reduzir a pobreza e a desigualdade, 36 milhões de pessoas superaram a miséria na última década e o país saiu do Mapa da Fome das Nações Unidas.", cultura: "O que nos singulariza no conjunto das nações é, em última instância, nossa cultura. É por ela que nos identificamos como brasileiros de norte a sul deste país. Uma grande nação precisa ter um desenvolvimento cultural à altura de sua grandeza, contemplando as dimensões simbólica, econômica e cidadã da cultura, que são parte central do projeto de um país democrático e plural. A pluralidade é nossa singularidade.");

// Programs
$scale: 1.1;
$time: .2s;
$darken: 15%;

// -------------

body {
    font-family: "Open Sans", sans-serif;
    &.contraste {
        color: #fff;
        background-color: #000;

        a,
        .btn {
            color: #fff;
            background-color: #000;
        }
    }
}

// Form
.input-group-search {
    .icon-circle {
        color: #fff;
        padding: 5px;
        margin-top: -5px;
    }
    button {
        border-left: none;
    }
}

// Header
.header {
    position: relative;

    button {
        position: absolute;
        right: 0;
        top: 2px;
    }
}

// Commons
.button--themed {
    // padding: 20px;
    .btn {
        color: #fff;
        font-weight: bold;
        padding: 15px 0;
        border-left: 0;
        border-right: 0;
        border-top: 0;
        border-radius: 6px;

        -webkit-transition: all $time ease-in-out;
        -moz-transition: all $time ease-in-out;
        -o-transition: all $time ease-in-out;
        transition: all $time ease-in-out;

        @each $category, $color in $categories {
            .#{$category} & {
                background-color: $color;
                border-bottom: 3px solid darken($color, $darken);
            }
        }

        &:hover,
        &:focus {
            @each $category, $color in $categories {
                .#{$category} & {
                    background-color: darken($color, $darken);
                }
            }
        }

        .contraste & {
            color: #262626;
            background-color: #fff;
        }
    }

    .btn-circle {
        width: 64px;
        height: 64px;
        border-radius: 100%;
    }

    // &.vote-buttons {
    //     padding-bottom: 40px;
    // }

    .btn.vote-buttons-up {
        float: right;
        margin-right: 10px;
        background-color: #32dbb5;
        border-bottom: 3px solid #1da485;

        &:hover,
        &:focus {
            background-color: #1da485;
        }
    }

    .btn.vote-buttons-down {
        float: left;
        margin-left: 10px;
        background-color: #db4127;
        border-bottom: 3px solid #9c2d1a;

        &:hover,
        &:focus {
            background-color: #9c2d1a;
        }


        // @media (max-width: $screen-sm) {
        //     margin-left:
        // }
    }

    .vote-buttons-up,
    .vote-buttons-down {
        font-size: 30px;
        margin-bottom: 20px;
    }
}


.social-share {
    min-width: 200px;
    background-color: #eee;
    padding: 5px;
    height: 47px;

    &:after {
        clear: both;
    }

    li {
        float: left;
        padding: 0;
        margin: 0;
        width: 45px;
        text-align: center;

        & > a {
            padding: 0;
        }

        &:first-child {
            // margin-left: 5px;
        }
    }

    .icon {
        transform: scale(0.7);
        position: relative;
        top: -10px;
        left: -10px;
    }
}

.icon {
    display: inline-block;
    vertical-align: middle;
}

.icon-wrapper-rounded {
    padding: 3px;
    border-radius: 100%;
}

.icon-circle {
    display: inline-block;
    vertical-align: middle;
    width: 50px;
    height: 50px;
    font-size: 20px;
    text-align: center;
    // border: 1px solid #eee;
    border-radius: 100%;
    overflow: hidden;

    &.icon-small {
        width: 35px;
        height: 35px;
    }

    .vote_for &,
    .next &,
    .vote_against & {
        padding-top: 12px;
    }

    .vote_for & {
        background-color: #4AC97A;
    }
    .next & {
        background-color: #EEB453;
    }
    .vote_against & {
        background-color: #EC4C68;
    }
}

.icon-circle-social-facebook {background-color: #537ab5; }
.icon-circle-social-twitter {background-color: #77cbef; }
.icon-circle-social-googleplus {background-color: #d23b00; }
.icon-circle-social-whatsapp {background-color: #10ad08; }
.icon-circle-social-youtube {background-color: #c63635; }
.icon-circle-social-flickr {background-color: #eaeaea; }
.icon-circle-mail {background-color: #ecb24e; }

// Theme
@each $category, $color in $categories {
    .#{$category} {
        .color-theme-fg { color: $color; }
        .color-theme-bg { background-color: $color;}
        .color-theme-bg-darker { background-color: darken($color, 10%);}

        .contraste & .color-theme-fg { color: #fff; }
        .contraste & .color-theme-bg { background-color: #000;}
    }
}

$common-color: #5E739E;
.color-theme-common-fg {color: $common-color; }
.color-theme-common-bg {background-color: $common-color; }

// Contraste
.contraste {
    .color-theme-common-fg {color: #fff; }
    .color-theme-common-bg {background-color: #000; }
    .contraste-box {background-color: #000; border: 1px solid #fff;}
}


// Hack to fix "Barra do Brasil"
#barra-brasil .brasil-flag {
  height: 33px !important;
}

@media only screen and (max-width: 959px){
  #barra-brasil ul.list {
    z-index: 9999;
  }
}

/**
 *  Do not remove this comments bellow. It's the markers used by gulp-inject to inject
 *  all your sass files automatically
 */
// injector
// endinjector