body {
  overflow: visible; 
  background-color:#fafafa ; /*{{getenv('BACKGROUND_COLOR')}}*/
}

nav{
  background-color:var(--primary-color) !important;
  color: var(--font-color-link) ;
}

.btn{
  background-color:var(--accent-color) !important;
  color: var(--accent-text-color) ;
}

.page-footer-shop{
  padding-top: 20px;
  background-color:var(--primary-color) !important;
}

.fab{
  background-color:var(--primary-color) !important;
  color: var(--font-color-link) ;
}
    
.fab-badge{
  background-color: var(--accent-color);
  color: var(--accent-text-color);
  display: block;
  height: 20px;
  width: 20px;
  position: absolute;
  top: 10px;
  right: -6px;
  text-align: center;
  z-index: 2;
  box-shadow: 2px 2px 2px 1px rgba(0, 0, 0, 0.2);
  border-radius: 5px;
 }       

 /* ini: Preloader */

  #preloadergeral {
      position:fixed;
      top:0;
      left:0;
      right:0;
      bottom:0;
      background-color: var(--primary-color); /* cor do background que vai ocupar o body {{getenv('LOADER_COLOR')}};*/
      z-index:999; /* z-index para jogar para frente e sobrepor tudo */
  }
  #preloadergeral .inner {
      position: absolute;
      top: 50%; /* centralizar a parte interna do preload (onde fica a animação)*/
      left: 50%;
      transform: translate(-50%, -50%);
  }
  #preloadergeral .inner h5{
      color: var(--font-color-link); /*{{getenv('LOADER_TEXT_COLOR')}};  */
  }
  .bolas > div {
    display: inline-block;
    background-color: var(--font-color-link); /*{{getenv('LOADER_TEXT_COLOR')}};  */
    width: 25px;
    height: 25px;
    border-radius: 100%;
    margin: 3px;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    animation-name: animarBola;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
     
  }
  .bolas > div:nth-child(1) {
      animation-duration:0.75s ;
      animation-delay: 0;
  }
  .bolas > div:nth-child(2) {
      animation-duration: 0.75s ;
      animation-delay: 0.12s;
  }
  .bolas > div:nth-child(3) {
      animation-duration: 0.75s  ;
      animation-delay: 0.24s;
  }
   
  @keyframes animarBola {
    0% {
      -webkit-transform: scale(1);
      transform: scale(1);
      opacity: 1;
    }
    16% {
      -webkit-transform: scale(0.1);
      transform: scale(0.1);
      opacity: 0.7;
    }
    33% {
      -webkit-transform: scale(1);
      transform: scale(1);
      opacity: 1; 
    } 
  }


  .entrega-gratis{
      padding: 5px;
  /*    animation: taadaa 1s infinite;*/
    }
    .entrega-gratis i{
      float: left;
      margin-left: 15px;
    }

    @keyframes taadaa { 
      0% {
        opacity: 0.9;
      }

      100% {
        opacity: 1;
      }
    }
  /* end: Preloader */

  .header-categoria{
    margin-bottom: 0px !important;
    
  }
  .header-categoria a{
    width: 100%;
  }

  input::-webkit-outer-spin-button,
  input::-webkit-inner-spin-button {
      -webkit-appearance: none;
      margin: 0;
  }
  input[type=number] {
      -moz-appearance: textfield;
  }

  .ilustrativa::before {
    content: "Imagem meramente ilustrativa.";
    font-size: 11px;
    color: #9e9e9e;
  }

  .text-sm{
    font-size: 0.875rem; /* 14px */
    line-height: 1.25rem; /* 20px */
  }
  .text-xs{
    font-size: 0.75rem; /* 12px */
    line-height: 1rem; /* 16px */
  }
  .container-2{
    margin-left: 2rem;
    margin-right: 2rem;
  }
  
  .excel-table{
	  margin:0;        
	  padding:0;  
  }
  
  .table-line{
	  margin:0;        
	  padding:0;       
  }
  
  .table-line td{
	  margin:0 !important;        
	  padding:0 !important;
	  border: solid 0.1rem #ffffff;   
  }
  
  .input-table{
	background-color: rgb(255, 255, 255);
    display:block;     
    width:100%;      
    margin:0;        
    padding:0;       
    border:0 none;   
    line-height:20px;
    height:20px;    
	  overflow: hidden;   
  }
  .switch-disable label input[type=checkbox]:checked+.lever{
	  background-color: #e0e0e0 !important;
  }
  
  .switch-disable label input[type=checkbox]:checked+.lever:after{
	  background-color: #e0e0e0 !important;
  }
  .checkbox-disable label input[type="checkbox"]:checked+span:not(.lever):before{
	  border-right: 2px solid #e0e0e0 !important;
	  border-bottom: 2px solid #e0e0e0 !important;
  }
  .dataTables_length{
	  display: none;
  }
  .paginate_button {
	color: #444;
    display: inline-block;
    font-size: 1.2rem;
    padding: 0 10px;
    line-height: 30px;
	cursor: pointer;
  }
  .current{
	color: #fff;
	background-color: #00897b;
	cursor: pointer;
  }
  .table-panel{
	  margin:0.2rem !important;
  }