/*  BASE TEMPLATE CUSTOM STYLES 
    Author: Ivo Junior
    Desc: Arquivo para customização de itens do template 
    Licence: http://www.gnu.org/licenses/gpl.html GNU/GPL
    Copyright Envolute + Balbooa
*/

/*UTILITIES CLASSES FROM BASE*/

@import url("base.min.css");

/*CUSTOM VARIABLES*/

:root {
    
    /*Template*/
    --content-space: 50px 0;
    
    /*Container style default for forms, etc...*/
    --component-border: var(--border);
    --component-bg: #fff;
    
    /*Forms*/
    --input-placeholder: #aaa;
    
    /*user access elements*/
    --login-width: 350px;
    --reset-width: 400px;
    --regst-width: 450px;
    
    /*Blog List Layout*/
    --blog-list-image-margin: 15px;
  
}

/*GRIDBOX*/

/*=> LAYOUT*/

/*==> Ajusta o padding fixo (100px) da área de conteúdo do template*/
body:not(.com_gridbox) .body { margin: var(--content-space); }

/*==> Remove a altura mínima default (50px) da linha/coluna*/
.ba-section, .ba-row, .ba-grid-column, .ba-item { min-height: unset!important; }

/*=> FORM*/

textarea:not([class*="span"]),
input[type="text"],
input[type="password"],
input[type="datetime"],
input[type="datetime-local"],
input[type="date"],
input[type="month"],
input[type="time"],
input[type="week"],
input[type="number"],
input[type="email"],
input[type="url"],
input[type="search"],
input[type="tel"],
input[type="color"],
select {
  padding: var(--input-padding);
  border-color: var(--component-border);
}
input.invalid {
  border-color: var(--danger);
}
.control-group {
    margin-bottom: 1em;
}
/*==> Placeholder*/
::-webkit-input-placeholder { opacity: .5; /* Edge */ }
:-ms-input-placeholder { opacity: .5; /* Internet Explorer 10-11 */ }
::placeholder { opacity: .5; }

/*=> BUTTON*/

.btn {
  padding: var(--btn-padding);
  border-radius: var(--rounded);
}
.btn:not([class*="btn-"]) {
  background-color: var(--bg-secondary);
}

/*=> TYPOGRAPHY*/

/*==> Badges*/
.badge {
  padding: 0 .4em;
  line-height: 1.4;
  background-color: var(--bg-secondary);
}

/*==> Blockquotes*/
blockquote {
  padding: 1em;
  line-height: 1.3;
  background-color: var(--bg-secondary);
}
/*===> Blockquote integration*/
blockquote.text-center {
  border-width: 4px 0 0 0;
  border-style: solid;
}
blockquote.text-right {
  border-width: 0 4px 0 0;
  border-style: solid;
}
blockquote .source {
  display: block;
  margin-top: .5em;
  font-size: var(--text-xs)!important;
  color: var(--subtitle);
}
blockquote .source cite {
    font-size: inherit!important;
    font-weight: 500;
}
blockquote .source::before { content: "\2014\00A0"; }

/*==> HR*/
hr { border-color: var(--border)!important; }

/*==> Pre*/
/*==> A classe "language-" serve para remover a customização a fim de evitar conflito com a biblioteca do "prism" */
pre > code:not([class*="language-"]) {
  display: block;
  padding: 1em;
  font-size: 1em;
  line-height: 1.5;
  background-color: var(--bg-secondary);
  border: 1px solid var(--border);
}

/*==> Inline elements*/
code:not([class*="language-"]) {
  padding: .15em .4em;
  font-size: 87.5%;
  color: var(--accent);
  word-wrap: break-word;
  background-color: var(--bg-secondary);
  border-radius: .2rem;
}
kbd {
  padding: .15em .4em;
  font-size: 80%;
  color: var(--text-inverse);
  background-color: var(--bg-dark);
  border-radius: .2rem;
}

/*=> ALERTS*/

#system-message-container .alert {
  background-color: var(--color-1);
  border: none;
  color: var(--text-inverse);
}
#system-message-container .alert.alert-success { background-color: var(--color-3); }
#system-message-container .alert.alert-danger { background-color: var(--color-5); }
#system-message-container .alert.alert-warning { background-color: var(--color-7); }
#system-message > div .alert-message,
#system-message .alert-heading {
  font-size: 16px;
  opacity: 1;
}

/*=> MENU*/
.nav.menu span.nav-header { cursor: default; }

/*=> BLOG APP*/

/*===> CATEGORY LAYOUT*/

/*====> LIST LAYOUT - (ba-classic-layout)*/

/*====> Remove a margem fixa entre os itens*/
.ba-classic-layout .ba-blog-post { margin: 0px; }

/*=====> Remove o padding esquerdo (fixo), para itens que não tem imagem */
.ba-classic-layout .ba-blog-post > .ba-blog-post-image { margin-right: var(--blog-list-image-margin); }
.ba-classic-layout .ba-blog-post > .ba-blog-post-content { padding: 0!important; }

/*==> SIGLE POST LAYOUT*/

/*===> POST NAVIGATION (plugin)*/

/*====> Alinha os itens do primeiro elemento à esquerda*/
.ba-item-post-navigation .ba-blog-post:first-child .ba-blog-post-content > div {
    justify-content: flex-start!important;
    text-align: left!important;
}

/*=> JOOMLA USER PAGES*/

/*==> LOGIN MODULE*/

.tmpl-login { padding: 0; } /*reset style "well" default do joomla/gridbox*/
.tmpl-login #login-form {
  display: block;
  max-width: var(--login-width);
  margin: auto;
  padding: 30px;
  box-sizing: border-box;
  font-size: 1rem;
  border-radius: var(--rounded-xl);
  border: none;
  background: var(--component-bg);
  box-shadow: var(--box-shadow-xl);
}
.tmpl-login #login-form .controls > label {
  width: auto;
  float: none;
  padding: 0;
  margin-bottom: 0;
  text-align: left;
}
.tmpl-login #login-form .controls > input {
  width: 100%;
}
.tmpl-login #login-form ul.unstyled {
  margin: 1rem 0 0;
  font-size: 1rem;
  line-height: 1.5;
}
.tmpl-login #login-form .control-group.checkbox {
  margin-bottom: 15px;
  padding: 0;
}
.tmpl-login #login-form .control-group.checkbox > input {
  margin: .5rem .5rem 0 0;
  float: left;
}
.tmpl-login #login-form .control-group.checkbox > label {
  float: none;
  width: auto;
  line-height: 1;
}

/*===> OFFLINE PAGE*/

/*====> esconde os links de recuperação de usuário e senha, pois offline não abre outras páginas*/
#item-15289771300 .tmpl-login #login-form ul.unstyled { display: none; }
#item-15289771300 .tmpl-login #form-login-submit { margin-bottom: 0; }
/*====> Envolute logo - offine page*/
#item-15289771300 .tmpl-login .devby-off {
  display: block;
  max-width: var(--login-width);
  margin: auto;
}

/*==> LOGIN/REMIND/RESET/REGISTRATION/PROFILE PAGES*/

.body .login > form,
.body .remind > form,
.body .reset > form,
.body .reset-confirm > form,
.body .reset-complete > form,
.body .registration > form,
.body .profile-edit > form {
  display: block;
  max-width: var(--login-width);
  margin: auto;
  padding: 30px 30px 10px;
  box-sizing: border-box;
  font-size: 1rem;
  border-radius: var(--rounded-xl);
  border: none;
  background: var(--component-bg);
  box-shadow: var(--box-shadow-xl);
}
.body .remind > form,
.body .reset > form {
  max-width: var(--reset-width);
}
.body .registration > form,
.body .profile-edit > form {
  max-width: var(--regst-width);
}
.body .login > form .control-group .control-label,
.body .remind > form .control-group .control-label,
.body .reset > form .control-group .control-label,
.body .reset-confirm > form .control-group .control-label,
.body .reset-complete > form .control-group .control-label,
.body .registration > form .control-group .control-label,
.body .profile-edit > form .control-group .control-label {
  display: inline-block;
  width: auto;
  float: none;
  padding: 0;
  margin-bottom: 0;
  text-align: left;
}
.body .login > form .control-group .control-label label,
.body .remind > form .control-group .control-label label,
.body .reset > form .control-group .control-label label,
.body .reset-confirm > form .control-group .control-label label,
.body .reset-complete > form .control-group .control-label label,
.body .registration > form .control-group .control-label label,
.body .profile-edit > form .control-group .control-label label {
  display: inline;
}
.body .login > form .control-group > .controls,
.body .remind > form .control-group > .controls,
.body .reset > form .control-group > .controls,
.body .reset-confirm > form .control-group > .controls,
.body .reset-complete > form .control-group > .controls,
.body .registration > form .control-group > .controls,
.body .profile-edit > form .control-group > .controls {
  display: inline;
  margin: 0;
}
.body .login > form .control-group .controls > input:not(.inputbox),
.body .remind > form .control-group .controls > input:not(.inputbox),
.body .reset > form .control-group .controls > input:not(.inputbox),
.body .reset-confirm > form .control-group .controls > input:not(.inputbox),
.body .reset-complete > form .control-group .controls > input:not(.inputbox),
.body .registration > form .control-group .controls > input:not(.inputbox),
.body .profile-edit > form .control-group .controls > input:not(.inputbox) {
  width: 100%;
}
/*==> Text Info*/
.body .login > form p,
.body .remind > form p,
.body .reset > form p,
.body .reset-confirm > form p,
.body .reset-complete > form p {
  margin: 0 0 1em;
  line-height: 1.3;
  text-align: justify;
}
/*===> Submit button*/
.body .login > form > fieldset + .control-group,
.body .remind > form > fieldset + .control-group,
.body .reset > form > fieldset + .control-group,
.body .reset-confirm > form > fieldset + .control-group,
.body .reset-complete > form > fieldset + .control-group,
.body .registration > form > fieldset + .control-group,
.body .profile-edit > form > fieldset + .control-group {
  margin: 1em 0;
}
/*===> Links Remind/Reset/Registration*/
.body .login + div {
  max-width: var(--login-width);
}
/*====> Link para o cadastro*/
.body .login + div ul.nav-tabs {
    margin: 20px 0;
    font-size: .9em;
}
.body .login + div ul.nav-tabs li {
  width: 100%;
  margin: 0;
}
.body .login + div ul.nav-tabs li > a {
  padding: 5px 0;
}
.body .login + div ul.nav-tabs li:nth-child(3n) {
  display: block;
  margin: 0;
  font-size: 1.4em;
  font-weight: bold;
}


/*ADD-ONS*/

/*=> TEMPLATE*/

/*==> SECTION HEADER */
.section-header {
    line-height: 0!important;
}
.section-header::after {
    content:' ';
    display: inline-block;
    margin: .25em auto -1px;
    vertical-align: bottom;
    line-height: 1px;
    height: 1px;
    width: 3em;
    border-bottom: 5px solid var(--accent);
}
.section-header.text-left * { text-align: left!important; }
.section-header.text-center * { text-align: center!important; }
.section-header.text-right * { text-align: right!important; }

/*=> GRIDBOX*/

/*==> PLUGINS */

/*===> BTN BLOCK*/
.ba-item-button.btn-block a {
    width: 100%;
    justify-content: center;
    box-sizing: border-box;
}

/*==> BLOG APP*/

/*===> CATEGORY LAYOUT*/

/*====> Borda entre os itens*/
.list-bordered .ba-blog-post:not(:first-child) { border-top: 1px solid var(--border)!important; }
.list-bordered.dashed .ba-blog-post { border-style: dashed!important; }
.list-bordered.dotted .ba-blog-post { border-style: dotted!important; }

/*====> LIST LAYOUT - (ba-classic-layout)*/

/*=====> Imagem alinhada a direita*/
.image-to-right .ba-classic-layout .ba-blog-post { flex-direction: row-reverse!important; } 
.image-to-right .ba-classic-layout .ba-blog-post > .ba-blog-post-image {
    margin-right: 0!important;
    margin-left: var(--blog-list-image-margin);
}

/*===> SIGLE POST LAYOUT*/

/*====> Esconde a imagem principal da notícia*/
.hide-image-intro .intro-post-image-wrapper { display: none !important; }

/*====> POST NAVIGATION*/

/*=====> Imagem alinhada a direita*/
.ba-item-post-navigation .ba-blog-post:not(:first-child) { width: 50%!important; }
.ba-item-post-navigation .ba-blog-post:not(:first-child) > .ba-blog-post-image { margin: 0 0 0 var(--blog-list-image-margin); }

/*===> LIST PLUGINS (recents, related, navigation)*/

/*====> Esconde o primeiro item listagem de posts*/
.hide-first-item .ba-blog-posts-wrapper .ba-blog-post:nth-child(1) { display: none; }
.hide-first-item .ba-blog-posts-wrapper .ba-blog-post:nth-child(2) { margin-top: 0; }
/*====> Esconde os dois primeiros itens listagem de posts*/
.hide-first-2-item .ba-blog-posts-wrapper .ba-blog-post::nth-child(-n+2) { display: none; }
.hide-first-2-item .ba-blog-posts-wrapper .ba-blog-post:nth-child(3) { margin-top: 0; }
/*====> Esconde os três primeiros itens listagem de posts*/
.hide-first-3-item .ba-blog-posts-wrapper .ba-blog-post::nth-child(-n+3) { display: none; }
.hide-first-3-item .ba-blog-posts-wrapper .ba-blog-post:nth-child(4) { margin-top: 0; }
/*====> Esconde os quatro primeiros itens listagem de posts*/
.hide-first-4-item .ba-blog-posts-wrapper .ba-blog-post::nth-child(-n+4) { display: none; }
.hide-first-4-item .ba-blog-posts-wrapper .ba-blog-post:nth-child(5) { margin-top: 0; }
