/* VARS */
:root {
    --cor-primary: #5043a9;
    --cor-primary-dark: #5043a9;
    --cor-secondary: #a1a1a1;
    --cor-sucess: #357bf3;
    --scroll-color: #333333;
    --nav-color: rgba(0, 0, 0, 0.8);
    /* Altura real do cabeçalho, publicada pelo base.scripts.js e usada pelas
       telas que calculam a própria altura a partir dela. O valor aqui é o do
       cabeçalho expandido, para a página já nascer certa antes do primeiro
       measure. */
    --coffee-navbar-h: 56px;
}

.round-element-1 {
    border-radius: 1rem;
}

.round-element {
    border-radius: 2rem;
}


/*BOTOES*/
#topBtn {
    position: fixed;
    bottom: 50%;
    right: 0px;
    cursor: pointer;
    z-index: 1030 !important;
    background-color: var(--nav-color);
    color:  var(--cor-primary);
    transform: scale(0.7);
}

.btn-tgg-on.active {
    background-color: var(--cor-sucess);
    color: white;
}

.btn-tgg-off.active {
    background-color: var(--cor-primary);
    color: white;
}
  

/* LOGIN PAGE */
html {
    height: 100%;
}

.body-login {
    height: 100%;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    justify-content: center;
    align-items: center;
    background-color: var(--cor-secondary);
}

.center {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

/* BOTÕES */
.btn-group-lg > .btn, .btn-lg {
    border-radius: 2rem;
}

.btn-success {
    border-color: var(--cor-sucess);
}

.btn-danger {
    background-color: var(--cor-primary);
    border-color: var(--cor-primary-dark);
}

.btn-danger:focus, .btn-danger:hover {
    background-color: var(--cor-primary-dark);
}

/* APPS */
.my-bottom-navigation p,
.my-app-list p {
    margin: 0;
    padding: 0;
    font-weight: bold;
}

.my-bottom-navigation a{
    color: white !important;
}

.my-bottom-navigation .my-active {
    color: var(--cor-primary) !important;
}

.my-bottom-navigation .col:hover {
    transform: scale(1.1);
}

.my-bottom-navigation {
    background-color: var(--nav-color);
}

/* PARALAX */
.parallax { 
    background-image: url("/icons/parallax.webp");
    height: 200px; 
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    font-weight: bold;
    color: white;
    text-shadow: 2px 2px rgba(0, 0, 0, 0.7);
}

/* BOOTSTRAP-SELECT */

.bootstrap-select>button {
    color: #495057 !important;
    background-color: #ffffff !important;
    border: 1px solid #ced4da;
}

/*SCROLL BAR*/

::-webkit-scrollbar {
    max-width: 5px;
    max-height: 5px;
}

::-webkit-scrollbar-thumb {
    background: var(--scroll-color);
}

::-webkit-scrollbar-thumb:hover {
    background: var(--cor-primary-dark);
}

/*FONTES*/

@font-face {
    font-family: 'edp';
    src: url('/fonts/edp_preon_regular-webfont.woff2') format('woff2'),
        url('/fonts/edp_preon_regular-webfont.woff') format('woff');
}

@font-face {
    font-family: 'edp';
    src: url('/fonts/edp_preon_medium-webfont.woff2') format('woff2'),
        url('/fonts/edp_preon_medium-webfont.woff') format('woff');
    font-weight: bold;

}

@font-face {
    font-family: 'edp';
    src: url('/fonts/edp_preon_thin-webfont.woff2') format('woff2'),
        url('/fonts/edp_preon_thin-webfont.woff') format('woff');
    font-weight: 100;

}

.thin-text {
    font-weight: 100 !important;
}

.bold-text {
    font-weight: bold !important;
}

.normal-text {
    font-weight: normal !important;
}

/* Cabeçalho que encolhe ao rolar em vez de sair da tela.

   Usado com .sticky-top do Bootstrap, que mantém o nav no fluxo do documento —
   diferente de .fixed-top, não há salto de layout no momento em que ele gruda.
   A classe .is-compact é alternada por base.scripts.js.

   Aplica-se ao cabeçalho do base_app.html. As telas com mapa usam
   partials/navigator_navbar.html, que já é .fixed-top e nunca desaparece. */
.coffee-navbar {
    transition: padding-top .18s ease, padding-bottom .18s ease, box-shadow .18s ease;
}

.coffee-navbar .navbar-brand {
    transition: font-size .18s ease, padding-top .18s ease, padding-bottom .18s ease;
}

.coffee-navbar.is-compact {
    padding-top: .15rem;
    padding-bottom: .15rem;
    /* O AppOlhoNoMapa põe min-height: 50px em .navbar, o que segurava o
       cabeçalho em 50px ao encolher enquanto os outros apps chegavam a 32px.
       Como só atinge quem tem .coffee-navbar, vale para os 5 cabeçalhos de app
       sem mexer em nenhuma outra navbar do sistema. */
    min-height: 0;
    /* A sombra separa o cabeçalho do conteúdo que passa por baixo dele. */
    box-shadow: 0 2px 6px rgba(0, 0, 0, .35);
}

.coffee-navbar.is-compact .navbar-brand {
    font-size: 1rem;
    padding-top: .1rem;
    padding-bottom: .1rem;
}

@media (prefers-reduced-motion: reduce) {
    .coffee-navbar,
    .coffee-navbar .navbar-brand {
        transition: none;
    }
}

body {
   /*-webkit-hyphens: auto;*/
   /*-moz-hyphens: auto;*/
   /*-ms-hyphens: auto;*/
   /*hyphens: auto;*/
}

* {
    font-family: edp, Arial, Helvetica, sans-serif;
}