/** 
 * El archivo de estilos de la aplicación

 * @author Francisco Cano
 * @date 2019-05-29 15:49:06
 */

html{ font-size: 16px!important; }

html,
body {
  font-size: 100%;
  overflow-x: hidden;
  background: #f9f9f9;
}
body a {
  transition: 0.5s all;
  -webkit-transition: 0.5s all;
  -moz-transition: 0.5s all;
  -o-transition: 0.5s all;
  -ms-transition: 0.5s all;
  text-decoration: none;
}
a:focus,
a:active,
a:hover {
  -webkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  transition: all 0.3s;
  color: #353f4f;
  text-decoration: none;
}

h1,
h2,
h3,
h4,
h5,
.h1,
.h2,
.h3,
.h4,
.h5,
.font-cabin {
  font-family: "Cabin", sans-serif;
}

.skin-black .sidebar-menu > li > a {
  border: none !important;
}

.table-bordered > thead > tr > th {
  border: none;
}

/** Ocultar molesto y totalmente inusable visualización de links de Bootstrap 3
 en hoja de estilos para impresión */
@media print {
  a[href]:after {
    content: "";
  }
}


/** Solucionar especificidad en estilos de AdminLTE que intentan (falladamente) sobreescribir
estilos de select2 (librería JS).
Esto causaba que el texto se muestre blanco sobre gris claro.
 */
.select2-container--default .select2-selection--multiple .select2-selection__choice {
  padding: 1px 10px!important;
  color: #333!important;
}
.select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
  margin-right: 5px!important;
  color: #333!important;
}

/** Solucionar visualización horrible del selector simple de selec2,
 esto parece ser un problema de la propia librería y no relacionado con AdminLTE*/
.select2-container--default .select2-selection--single .select2-selection__rendered {
  line-height: inherit !important;
}

/** No mostrar el menú lateral como "abierto" porque interfiere con la función que hace que se muestre
 flotando, a la derecha */
.sidebar-menu .active>.treeview-menu {
  display: none;
}

/** Solucionar estilos de foco inexistentes, que afectan la accesibilidad */
a:focus {
  box-shadow: 0 0 2px 1px #3c8dbc8c, inset 0 0 2px 1px #3c8dbc8c;
}
.sidebar-toggle:focus, .navbar-custom-menu a:focus {
  box-shadow: 0 0 2px 1px #fff, inset 0 0 2px 1px #fff;
}
.nav>li>a:focus, .sidebar-menu>li>a:focus {
  border-left-color: #3c8dbc;
}

/** Botón "saltar al contenido principal" para mejorar navegación por teclado */
.skip-to-main-content, .sr-only {
  position: absolute;
  left: -9999px;
  transition: none!important;
}
.skip-to-main-content:focus {
  left: 0;
  background-color: white;
  border-color: black;
  padding: 1rem;
  z-index: 999;
}

/**
 * Estlos personalizados para checkboxes y radio buttons.
 * Demo:
 * @link https://codepen.io/frankno/pen/ewpjJR
 */

.icheck {
  --icon-size: 1.375em;
  display: inline-block;
  min-height: var(--icon-size);
  line-height: var(--icon-size);
  position: relative;
  vertical-align: top;
  font-weight: 400;
  cursor: pointer;
}

.icheck input[type="checkbox"],
.icheck input[type="radio"] {
  /* Hide it but keep it focusable */
  opacity: 0;
  position: absolute;
}

.icheck input[type="checkbox"]:disabled ~ i,
.icheck input[type="radio"]:disabled ~ i {
  opacity: 0.5;
  background-color: #ecf0f1;
  cursor: not-allowed;
  box-shadow: none !important;
}

.icheck i {
  content: '';
  display: inline-block;
  width: var(--icon-size);
  height: var(--icon-size);
  line-height: var(--icon-size);
  color: white;
  background-color: white;
  text-align: center;
  --border-color: #D3CFC8;
  border: 1px solid var(--border-color);
  font-size: 0.875em;
}

.icheck input[type="radio"] ~ i {
  border-radius: 100%;
}

.icheck input[type="checkbox"]:checked ~ i,
.icheck input[type="radio"]:checked ~ i {
  background-color: #3c8dbc;
  --border-color: #2e6da4;
}
.icheck:hover input[type="checkbox"] ~ i,
.icheck input[type="checkbox"]:active ~ i,
.icheck input[type="checkbox"]:focus ~ i,
.icheck:hover input[type="radio"] ~ i,
.icheck input[type="radio"]:active ~ i,
.icheck input[type="radio"]:focus ~ i
{
  box-shadow: 0 0 0 2px var(--border-color);
}

.icheck.icheck-default input[type="checkbox"]:checked ~ i,
.icheck.icheck-default input[type="radio"]:checked ~ i {
  background-color: #e6e6e6;
  --border-color: #adadad;
  color: #333;
}

.icheck.icheck-info input[type="checkbox"]:checked ~ i,
.icheck.icheck-info input[type="radio"]:checked ~ i {
  background-color: #00c0ef;
  --border-color: #00acd6;
}

.icheck.icheck-warning input[type="checkbox"]:checked ~ i,
.icheck.icheck-warning input[type="radio"]:checked ~ i {
  background-color: #f39c12;
  --border-color: #e08e0b;
}

.icheck.icheck-danger input[type="checkbox"]:checked ~ i,
.icheck.icheck-danger input[type="radio"]:checked ~ i{
  background-color: #dd4b39;
  --border-color: #d73925;
}

/** Desactivar items del menú sin link */
.sidebar-menu a[href="#"] {
  opacity: .5;
}

/* fix logo con fondo negro en @media (max-width: 767px) */
@media (max-width: 767px) {
  .skin-black .main-header .logo {
    background-color: #fff;
    position: absolute;
    z-index: 9999;
    left: auto;
    right: auto;
    top: 0;
    bottom: 0;
    width: auto;
    margin-left: 3rem;
  }
  .skin-black .main-header .logo:hover {
    background-color: #fff;
  }

  .main-sidebar {
    padding-top: 50px;
  }

}

@media (min-width: 768px) {
  /* Se deshabilitó el JS que hace que el sub-menú se expanda hacia abajo, por ende se utiliza este CSS para mostrarlo siempre al costado */
  body.sidebar-mini:not(.sidebar-collapse) .sidebar-menu>li:hover>.treeview-menu,
  body.sidebar-mini:not(.sidebar-collapse) .sidebar-menu>li:focus>.treeview-menu {
      display: block !important;
      position: absolute;
      width: 180px;
      left: 230px;
      top: 0;
      z-index: 40;
  }
  /* mejora estética */
  .treeview-menu>li>a {
    padding: 12px 5px 12px 15px;
    color: #b8c7ce!important;
  }
  .treeview-menu>li>a:hover {
    color: #f7f7f7 !important;
  }
  /* mejora estética */
  .skin-black .sidebar-menu>li>.treeview-menu {
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
  }

  /**
   mejora estética*/
  .sidebar-menu>li>.treeview-menu {
    margin-left: 0!important;
    padding-left: 0;
  }

}