:root{
  --primaryColor : #76bc21;
  --transparentPrimaryColor: rgb(124,182,61,.5);
  --secondaryColor: #409008;
  --splashColor: #7a7a7a;
  --hoverColor: #b3a494;;
  --hoverColor-button: #409008;


  --darkColor: #7a7a7a;
  --lightColor: #eeeeee;
  --secondaryLigthColor: #f8f9fb;
  --thirdLigthColor: #fafafa;
  --boxshadow: 0 1px 0.5px rgba(0, 0, 0, 0.13);

  --iconColor: #DEC79B;

  --headerColor: #F55757;
  --headerFontSize: 14px;

  --alertColor: #e02828;

}

::-webkit-scrollbar {
    width: .5em;
}
 
::-webkit-scrollbar-thumb {
  background-color: #18181E;
}

#recuperar:hover {
  text-decoration: underline;
}

#icon{
  cursor: pointer;
}
#icon:hover{
  font-weight: bold;
}
.iconTitle{
  font-size: 12px;
  color: black;
}
.iconSearch{
  color: lightgray;
}
.iconFilter{
  color: darkgray !important;
  cursor: pointer;
}
.iconPresencial{
  color: #A1FA20;
}
.iconOnline{
  color: #7D8BF5;
}
.iconTaller{
  color: #FF9E66;
}
.iconoMenu{
  color: var(--iconColor);
}
.iconoMenuSalir{
  color: white;
}
div.md-toolbar-tools {
  background-color: var(--headerColor);
}

.dialogTitle{
  font-size: var(--headerFontSize);
}

.md-sidenav-left{
  overflow:hidden; 
  display:flex; 
  max-width:85px; 
  min-width:85px; 
  height: 100vh; 
  background: #18181E;
}

.md-tooltip#tool {
  background-color: var(--iconColor) !important;
  color: black !important;
  border-radius: 5px;
  font-size: 13px !important;
  font-family: monospace;
  text-align: center;
  z-index: 999 !important;
}

.toolIcon {
  background-color: black !important;
  color: white !important;
  border-radius: 5px;
  font-size: 13px !important;
  font-family: monospace;
  text-align: center;
}

.menu-item {
  cursor: pointer;
  margin: 2px;
  padding: 10px;
  width: auto;
  border-radius: 4px;
  user-select: none;
  outline: none;
}

.menu-item {
  fill: var(--thirdLigthColor);
}

.menu-item.active {
  background: var(--hoverColor);
}

.menu-item:hover {
  background: var(--hoverColor);
}

.monospaceTextTitle{
  font-family: monospace;
}

.tableHeader {
  font-weight: bold;
  font-size: 14px;
}

.tableItem {
  border-bottom: 1px solid lightgray;
}

.iconTypeOnline{
  height: 20px !important;
  /*filter: invert(27%) sepia(51%) saturate(2878%) hue-rotate(346deg) brightness(104%) contrast(97%);*/
  fill: red !important;
}

.loadStatus{
  min-height: 100%; 
  position: absolute; 
  left: 50%;
  top: -10%;
}

.inputABM {
   margin-left: 10px;
   margin-right: 10px;
}

.tituloSeccion {
  color: var(--headerColor);
}

.tituloDivisor {
  font-size: 12px;
  color: var(--headerColor);
  padding: 5px;
}

.contentView {
  padding-left: 5px;
}

.md-button {
  border-radius: 5px;
}

.chipInfo {
    font-size: 10px;
    border-radius: 25px; 
    border: 1px solid darkgray; 
    background-color: lightgray;
    height: 25px; width: 25px; 
    text-align: center;
    box-shadow: 2px 2px;
}

.fabButton1 {
   background-color: #744FFF !important;
   color: black !important;
}
.fabButton2 {
   background-color: #A75BEB !important;
   color: black !important;
}
.fabButton3 {
   background-color: #E866FF !important;
   color: black !important;
}
.fabButton4 {
   background-color: #F553C2 !important;
   color: black !important;
}
.fabButton5 {
   background-color: #FF4155 !important;
   color: black !important;
}

md-toast.alert-toast {
  color: red !important;
}

.message {
  font-size: 12px;
  color: black;
}

.listHeader{
  font-size: var(--headerFontSize);
  font-family: Roboto,Helvetica Neue,sans-serif;
  background-color: var(--headerColor);
  color: white;
  padding: 5px;
  min-height: 66px;
  border: 2px #EA5334 solid;
}

.listFooter{
  height: 68vh; 
  width: 93vw; 
  /*overflow-y: auto; */
  overflow: none;
  position: absolute;
}

.tabs-wrapper {
    position: relative;
    height: 100vh;
}
.full-size {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    padding-left: 25px;
}

textarea {
    overflow-y: scroll;
    height: 100vh;
    resize: none; 
}

.ellipsis {
  width: 95%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.resultInfo{
  height: 75vh; 
  margin-right: 20px;
  margin-left: 8px;
}

.md-button.md-warn.md-fab.md-mini#headerButton{
  background: lightgray;
}

.md-button.md-warn.md-fab.md-mini#filterButton{
  background: gray;
}

.optionDefault{
  font-family: Roboto,Helvetica Neue,sans-serif;
  color: #b3b3b3;
}

.turnoCancelado{
  background-color: #D16B32;
}

.turnoRealizado{
  background: #89D154;
}

.turnoReservado{
  background: #DBD951;
}

.clearFilter{
  background-color: #F55757 !important;
}

.copyRight {
  font-size: 12px;
  color: lightgray;
}

.notificacion{
  color: var(--alertColor);
  font-size: 12px;
  text-align: justify;
}

.notificacionValidacion{
  color: #DD2C00;
  font-size: 12px;
  padding: 5px 5px 0px 0px;
}

.iconNotificacion{
  fill: var(--alertColor);
}

/*SCHEDULER*/
/*Para que no tape los modal y los tooltip del menu*/
#scheduler {
  z-index: 1 !important;
}

/* PAGINADOR */
.pager {
  display: inline-block;
  padding-left: 0;
  margin: 20px 0;
  border-radius: 4px;
}
.pager>li {
  display: inline;
}
.pager>li>a {
    position: relative;
    float: left;
    padding: 6px 12px;
    margin-left: -1px;
    line-height: 1.42857143;
    color: #fff;
    text-decoration: none;
    background-color: #969596;
    border: 1px solid #000;
}
.pager>li>a {
  cursor: pointer;
}
.pager>.active>a {
    z-index: 2;
    color: #fff;
    cursor: default;
    background-color: #bb0731;
    border-color: #bb0731;
}
.disabled {
  background-color: #B7B7B7 !important;
}
.disabled>a {
  cursor: default !important;
  color: #B7B7B7 !important;
}

.infoQtty{
  /*font-weight: bold !important;*/
  font-size: 11px;
}

/*CL_PAGING*/
.pagingButton{
  border-radius: 5px !important;
  font-size: 12px;
}

.pagingButton:hover{
  background-color:  #BDAAB3 !important;
}

#generalPaging{
  background-color:  #7D7076 !important;
  font-size: 16px;
}

#generalPaging:hover{
  color: black !important;
}

#generalPagingAux{
  background-color: #C9B5BF !important;
  color: white !important;
  font-size: 16px;
}

#generalPagingAux:hover{
  color: black !important;
}

.pageTarget{
  background-color: #3D373A !important;
  color: white !important;
}

.pageTarget:hover{
  background-color: #3D373A !important;
}