body {
  font-family: 'muliregular', sans-serif;
  font-size: 1rem;
}


/*
* COLORES
*/
.bg-principal{
  background-color: #dfdfdf !important;
}
.bg-sidebar{
  background-color: #00263a !important;
}

/* Texto */
.text-grisOscuro {
  color: #565656 !important;
}
.text-grisClaro {
  color: #adb5bd !important;
}
.mco-text-blue {
  color: #007bff !important;
}
.mco-text-indigo {
  color: #6610f2 !important;
}
.mco-text-purple {
  color: #6f42c1 !important;
}
.mco-text-pink {
  color: #e83e8c !important;
}
.mco-text-red {
  color: #dc3545 !important;
}
.mco-text-orange {
  color: #fd7e14 !important;
}
.mco-text-yellow {
  color: #ffc107 !important;
}
.mco-text-green {
  color: #28a745 !important;
}
.mco-text-teal {
  color: #20c997 !important;
}
.mco-text-cyan {
  color: #17a2b8 !important;
}
.mco-text-dark {
  color: #343a40 !important;
}

/* Fondo Corporativos MicrOasis */
.bg-celesteMicroasis {
  background-color: #2c9199 !important;
}
.bg-amarilloMicroasis {
  background-color: #ffc629 !important;
}
.bg-naranjaMicroasis {
  background-color: #f4633a !important;
}
.bg-verdeMicroasis {
  background-color: #61a60e !important;
}
.bg-azulMicroasis {
  background-color: #00263a !important;
}
.bg-grisMicroasis {
  background-color: #888b8d !important;
}
/* Texto Corporativos MicrOasis */
.text-celesteMicroasis {
  color: #2c9199 !important;
}
.text-amarilloMicroasis {
  color: #ffc629 !important;
}
.text-naranjaMicroasis {
  color: #f4633a !important;
}
.text-verdeMicroasis {
  color: #61a60e !important;
}
.text-azulMicroasis {
  color: #00263a !important;
}
.text-grisMicroasis {
  color: #888b8d !important;
}
/*--------------------------------------------------------------------------------------------------------*/


/* Fondo colores PRODUCTOS */
.bg-diesel {
  background-color: #101820 !important;
}
.bg-dieselPlus {
  background-color: #c99700 !important;
}
.bg-gasolina {
  background-color: #008655 !important;
}
.bg-gasolinaPlus {
  background-color: #84bd00 !important;
}
.bg-autoGas {
  background-color: #ff6900 !important;
}
.bg-adBlue {
  background-color: #0057b7 !important;
}
/* Texto colores PRODUCTOS */
.text-diesel {
  color: #207A25 !important;
}
.text-dieselPlusBio {
  color: #207A25 !important;
}
.text-dieselMinusBio {
  color: #6C757D !important;
}
.text-dieselCalef {
  color: #101820 !important;
}
.text-dieselPlus {
  color: #c99700 !important;
}
.text-gasolina {
  color: #008655 !important;
}
.text-gasolinaPlus {
  color: #84bd00 !important;
}
.text-autoGas {
  color: #ff6900 !important;
}
.text-adBlue {
  color: #0057b7 !important;
}

/*--------------------------------------------------------------------------------------------------------*/


/* MCO - AÑADIR PARA CURSOR "DEDO", AL ESTAR ENCIMA DE UN ELEMENTO */
.mco-cursor-pointer{
  cursor: pointer !important;
}
/*--------------------------------------------------------------------------------------------------------*/


/* MCO - AÑADIR PARA CURSOR "PROHIBIDO", AL ESTAR ENCIMA DE UN ELEMENTO */
.mco-cursor-not-allowed{
  cursor: not-allowed !important;
  pointer-events: all !important;
}
/*--------------------------------------------------------------------------------------------------------*/


/* MCO - AÑADIR PARA TEXTO "TACHADO" */
.mco-text-line-through {
  text-decoration: line-through;
}
/*--------------------------------------------------------------------------------------------------------*/


/* MCO - AÑADIR CLASE 'mco-list-style-line' A "OL" O "UL" PARA LISTA CON "GUIÓN" (-) */
.mco-list-style-line{
  list-style: none; /* Remove HTML bullets */
  padding: 0;
  margin: 0;
}
.mco-list-style-line li{
  padding-left: 16px;
}
.mco-list-style-line li::before{
  content: "-"; /* Insert content that looks like bullets */
  padding-right: 8px;
}
/*--------------------------------------------------------------------------------------------------------*/


/*
* MCO - ICONOS PERSONALIZADOS
*/
/* Icono AEAT - Para Botones - Añadir clase 'mco-icon-agencia-tributaria' */
.mco-icon-agencia-tributaria {
  text-align: center;
  width: 1.25em;
  content: url(../svg/icon-agencia-tributaria.svg);
}
button:hover:enabled .mco-icon-agencia-tributaria {
  filter: grayscale(100%) opacity(100%) brightness(0%) invert(100%);
}
button:disabled .mco-icon-agencia-tributaria {
  filter: opacity(60%);
}
/* Icono AEAT - Para Botones en un Dropdown */
button:hover:enabled.dropdown-item .mco-icon-agencia-tributaria {
  filter: opacity(70%);
}

/* Icono VERIFACTU - Para Botones - Añadir clase 'mco-icon-verifactu' */
.mco-icon-verifactu {
  text-align: center;
  width: 1.25em;
  content: url(../svg/icono-verifactu-simple.svg);
}
button:hover:enabled .mco-icon-verifactu {
  filter: grayscale(100%) opacity(100%) brightness(0%) invert(100%);
}
button:disabled .mco-icon-verifactu {
  filter: opacity(60%);
}
/* Icono VERIFACTU - Para Botones en un Dropdown */
button:hover:enabled.dropdown-item .mco-icon-verifactu {
  filter: opacity(70%);
}

/* Logo VERIFACTU - Para Botones - Añadir clase 'mco-logo-verifactu' */
.mco-logo-verifactu {
  text-align: center;
  height: 1em;
  content: url(../svg/logo-verifactu-simple.svg);
}
/*--------------------------------------------------------------------------------------------------------*/


/*
* ANIMACIÓN DE PARPADEO: APLICAR LA CLASE '.mco-flash-animated' A CUALQUIER ELEMENTO
*/
.mco-flash-animated {
  -webkit-animation-name: mco-flash;
  animation-name: mco-flash;
  -webkit-animation-duration: 2s;
  animation-duration: 2s;
  -webkit-animation-delay: 0s;
  animation-delay: 0s;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
 }
 @keyframes mco-flash {
  0%, 50%, 100% {
  opacity: 1;
  }
 25%, 75% {
  opacity: 0;
  }
 }
 /*--------------------------------------------------------------------------------------------------------*/


 /*
* ANIMACIÓN INFINITA DE SPINNER: APLICAR LA CLASE '.mco-spin-animated' A CUALQUIER ELEMENTO
*/
 .mco-spin-animated {
  -webkit-animation-name: mco-spinner-infinito;
  animation-name: mco-spinner-infinito;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-delay: 0s;
  animation-delay: 0s;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
}
@keyframes mco-spinner-infinito {
    from {
        transform:rotate(0deg);
    }
    to {
        transform:rotate(360deg);
    }
}
/*--------------------------------------------------------------------------------------------------------*/


 /*
* ANIMACIÓN DE RELOAD: APLICAR LA CLASE '.mco-reload-animated' A CUALQUIER ELEMENTO
*/
 .mco-reload-animated {
  -webkit-animation-name: mco-reload;
  animation-name: mco-reload;
  -webkit-animation-duration: 0.6s;
  animation-duration: 0.6s;
  -webkit-animation-delay: 0s;
  animation-delay: 0s;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
}
@keyframes mco-reload {
    from {
        transform:rotate(0deg);
    }
    to {
        transform:rotate(360deg);
    }
}
/*--------------------------------------------------------------------------------------------------------*/


 /*
* ANIMACIÓN DE FADEIN: APLICAR LA CLASE '.mco-fadeIn-animated' A CUALQUIER ELEMENTO
*/
.mco-fadeIn-animated {
  -webkit-animation-name: mco-fadeIn;
  animation-name: mco-fadeIn;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-delay: 0s;
  animation-delay: 0s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}
@keyframes mco-fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/*--------------------------------------------------------------------------------------------------------*/


/*
 * DESENFOQUE: APLICAR LA CLASE '.mco-blur' A CUALQUIER ELEMENTO.
 */
.mco-blur {
  -webkit-animation-name: mco-blur;
  animation-name: mco-blur;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-delay: 0.1s;
  animation-delay: 0.1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}
@keyframes mco-blur {
  from {
    backdrop-filter: blur(0px);
    -webkit-backdrop-filter: blur(0px);
  }
  to {
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
  }
}
/*--------------------------------------------------------------------------------------------------------*/


 /*
* CLASES UTILES PARA ANIMACIONES: APLICAR CUALQUIERA DE ESTAS CLASES JUNTO CON LAS CLASES DE ANIMACION
*/
.mco-fast-04 {
  -webkit-animation-duration: 0.4s;
  animation-duration: 0.4s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

.mco-delay-03 {
  -webkit-animation-delay: 0.3s;
  animation-delay: 0.3s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

.mco-delay-06 {
  -webkit-animation-delay: 0.6s;
  animation-delay: 0.6s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}
/*--------------------------------------------------------------------------------------------------------*/


/*
* TOOLTIP BOOTSTRAP 4
*/
.tooltip.show {
  opacity: 1;
}
.tooltip-inner {
  font-family: 'mulilight';
  color: #000000;
  background-color:rgba(255, 255, 255, 1);
  box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.25);
}
.tooltip.bs-tooltip-right .arrow:before {
    border-right-color: #ffffff !important;
}
.tooltip.bs-tooltip-left .arrow:before {
    border-left-color: #ffffff !important;
}
.tooltip.bs-tooltip-bottom .arrow:before {
    border-bottom-color: #ffffff !important;
}
.tooltip.bs-tooltip-top .arrow:before {
    border-top-color: #ffffff !important;
}
/*--------------------------------------------------------------------------------------------------------*/


/*
* TOOLTIP PERSONALIZADO: SOLO CSS
*/
/* Tooltip container:
*     - Añadir atributo 'data-toggle="tooltip"'
*     - Añadir atributo 'data-title="aquí el título a mostrar"'
*
*/
[data-toggle="tooltip"][data-title]:hover::after {
  visibility: visible;
  transition: all 0.4s;
  opacity: 1;
}
[data-toggle="tooltip"][data-title]:after {
  visibility: hidden;
  position: absolute;
  content: attr(data-title);
  font-family: 'mulilight' !important;
  text-align: center;
  color: #000000;
  background-color:rgba(255, 255, 255, 1);
  border-radius: 4px;
  box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.25);
  font-size: 0.80rem;
  padding: 5px 8px;
  white-space: nowrap;
  opacity: 0;
  z-index: 99999;
}
[data-toggle="tooltip"][data-title] {
  position: relative;
}


    /* Añadir clase para 'bottom' */
    .tooltip-bottom[data-toggle="tooltip"][data-title]:after {
      top: 102%;
      left: 50%;
      -webkit-transform: translateX(-50%);
      transform: translateX(-50%);
    }
    /* Añadir clase para 'bottom-left' */
    .tooltip-bottom-left[data-toggle="tooltip"][data-title]:after {
      top: 102%;
      right: 0%;
    }
    /* Añadir clase para 'bottom-right' */
    .tooltip-bottom-right[data-toggle="tooltip"][data-title]:after {
      top: 102%;
      left: 0%;
    }
    /* Añadir clase para 'top' */
    .tooltip-top[data-toggle="tooltip"][data-title]:after {
      bottom: 102%;
      left: 50%;
      -webkit-transform: translateX(-50%);
      transform: translateX(-50%);
    }
    /* Añadir clase para 'top-left' */
    .tooltip-top-left[data-toggle="tooltip"][data-title]:after {
      bottom: 102%;
      right: 0%;
    }
    /* Añadir clase para 'top-right' */
    .tooltip-top-right[data-toggle="tooltip"][data-title]:after {
      bottom: 102%;
      left: 0%;
    }
/*--------------------------------------------------------------------------------------------------------*/



/*
* VALIDACIÓN FORMULARIO BOOTSTRAP 4
*/
.form-control.is-valid,
.was-validated .form-control:valid {
  border-color: #4ec544;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='%234ec544' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e");
}
.form-control.is-invalid,
.was-validated .form-control:invalid {
  border-color: #f35956;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23f35956' viewBox='-2 -2 7 7'%3e%3cpath stroke='%23f35956' d='M0 0l3 3m0-3L0 3'/%3e%3ccircle r='.5'/%3e%3ccircle cx='3' r='.5'/%3e%3ccircle cy='3' r='.5'/%3e%3ccircle cx='3' cy='3' r='.5'/%3e%3c/svg%3E");
}

.input-group.is-valid .input-group-text,
.was-validated .input-group:valid .input-group-text {
  border-color: #4ec544;
}
.input-group.is-invalid .input-group-text,
.was-validated .input-group:invalid .input-group-text {
  border-color: #f35956;
}
/*--------------------------------------------------------------------------------------------------------*/



/*
* DROPDOWN BOOTSTRAP 4
*/
.dropdown-menu.show {
  border: none;
  box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.25);
}
.dropdown-header, .dropdown-item p {
  overflow: hidden;
  text-overflow: ellipsis;
}
/*--------------------------------------------------------------------------------------------------------*/


/*
* MODAL BOOTSTRAP 4
*/
.modal-content, .modal-content .modal-header, .modal-content .modal-footer {
  border-radius: 6px;
  border: none;
}
/*--------------------------------------------------------------------------------------------------------*/


/*
* CUSTOM-FILE-TEXT BOOTSTRAP 4
*/
.custom-file-input:lang(es)~.custom-file-label::after {
    content: "Elegir";
}
/*--------------------------------------------------------------------------------------------------------*/


/*
* BUTTON-DISABLED BOOTSTRAP 4
*/
button:disabled {
  cursor: not-allowed;
  pointer-events: all !important;
}
/*--------------------------------------------------------------------------------------------------------*/


/*
* INPUT TYPE="NUMBER"-SIN FLECHAS BOOTSTRAP 4
*/
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
input[type=number] {
  -moz-appearance: textfield;
}
/*--------------------------------------------------------------------------------------------------------*/


/*
* LINK-DISABLED BOOTSTRAP 4 (AÑADIR 'DIV' DE ENVOLTURA A UN ENLACE, CON LA CLASE: 'disabled-wrapper')
*/
.disabled-wrapper {
  cursor: not-allowed;
}
.disabled-wrapper a.disabled {
  pointer-events: none !important;
}
/*--------------------------------------------------------------------------------------------------------*/


/*
* RANGE-INPUT BOOTSTRAP 4
*/
.form-control-range-tooltip {
  background: #0b74e4;
  color: white;
  padding: 0px 6px;
  position: relative;
  border-radius: 4px;
  top: -6px;
  left: 50%;
  transform: translateX(-50%);
  font-size: 0.875em;
}
.form-control-range-tooltip::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: #0b74e4 transparent transparent transparent;
}
.form-control-range-tooltip.disable {
  background: #bbbbbb;
}
.form-control-range-tooltip.disable::after {
  border-color: #bbbbbb transparent transparent transparent;
}
/*--------------------------------------------------------------------------------------------------------*/


/*
* PERSONALIZACIÓN PARA ANGULAR: VALIDACIÓN CAMPOS FORMULARIO BOOTSTRAP 4
*/
/* form *.ng-touched.ng-dirty.ng-invalid {
    border: 1px solid #dc3545;
}
form *.ng-touched.ng-dirty.ng-invalid~.invalid-feedback {
    display: block;
}
form *.ng-touched.ng-dirty.ng-invalid~.input-group-append .input-group-text,
form *.ng-untouched.ng-dirty.ng-invalid~.input-group-append .input-group-text {
    border: 1px solid #dc3545;
} */

.ng-touched.ng-dirty.ng-invalid~.invalid-feedback {
    display: block;
}
.ng-touched.ng-dirty.ng-invalid~.input-group-append .input-group-text,
.ng-untouched.ng-dirty.ng-invalid~.input-group-append .input-group-text,
.ng-touched.ng-dirty.is-invalid~.input-group-append .input-group-text,
.ng-untouched.ng-dirty.is-invalid~.input-group-append .input-group-text {
    border: 1px solid #dc3545;
}

.input-group>.input-group-append:last-child>.btn:not(:last-child):not(.dropdown-toggle),
.input-group>.input-group-append:last-child>.input-group-text:not(:last-child),
.input-group>.input-group-append:not(:last-child)>.btn,
.input-group>.input-group-append:not(:last-child)>.input-group-text,
.input-group>.input-group-prepend>.btn,
.input-group>.input-group-prepend>.input-group-text {
    border-top-right-radius: .25rem;
    border-bottom-right-radius: .25rem;
}
/*--------------------------------------------------------------------------------------------------------*/


/*
* PERSONALIZACIÓN DATETIMEPICKER NATIVO DEL NAVEGADOR
*/
input[type="date"],
input[type="time"] {
  position: relative;
}
input[type="date"]::-webkit-calendar-picker-indicator,
input[type="time"]::-webkit-calendar-picker-indicator {
  color: transparent;
  background: none;
  z-index: 1;
  cursor: pointer;
}

input[type="date"]:before {
  color: transparent;
  background: none;
  display: block;
  font-family: 'Font Awesome 5 Free';
  content: '\f133';
  font-weight: 400; /* Usar valor '900' para iconos sólidos */
  text-align: center;
  width: 1.25em;
  position: absolute;
  right: 11px;
  color: #888b8d;
}

input[type="time"]:before {
  color: transparent;
  background: none;
  display: block;
  font-family: 'Font Awesome 5 Free';
  content: '\f017';
  font-weight: 400; /* Usar valor '900' para iconos sólidos */
  text-align: center;
  width: 1.25em;
  position: absolute;
  right: 11px;
  color: #888b8d;
}
/*--------------------------------------------------------------------------------------------------------*/


/** MCO- Input Drag & Drop **/
.MCO-inputDragAndDrop {
  position: relative;
  display: flex;
  align-items: center;
  width: 450px;
  max-width: 100%;
  padding: 25px;
  border: 1px dashed rgba(0, 0, 0, 0.4);
  border-radius: 3px;
  transition: 0.2s
}

.MCO-inputDragAndDrop .form-control-file {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  height: 100%;
  width: 100%;
  cursor: pointer;
  opacity: 0;
  z-index: 1;
}

.MCO-inputDragAndDrop .MCO-inputDragAndDropFloatBtnDelete {
  position: absolute;
  top: 0px;
  right: 5px;
  z-index: 1;
}

.MCO-inputDragAndDrop .MCO-inputDragAndDropContent {
  width: 100%;
}

.MCO-inputDragAndDropContent .MCO-inputDragAndDropText {
  font-size: 0.85em;
  text-align: center;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: normal;
  color: #aaaaaa;
}

.MCO-inputDragAndDropContent .MCO-inputDragAndDropText.text-danger.icon-format-not-valid::before {
  content: '\f12a';
  display: block;
  font-family: 'Font Awesome 5 Free';
  font-weight: 900;
  font-size: 1rem;
}
/*--------------------------------------------------------------------------------------------------------*/


/* MCO - Thumbnail */
.MCO-thumbnail {
  position: relative;
}

.MCO-thumbnail .btn-close {
  position: absolute;
  top: 0px;
  right: 0px;
  z-index: 1;
  padding: 0px 8px;
  outline: none;
}
/*--------------------------------------------------------------------------------------------------------*/


/* MCO - QR VeriFactu */
.MCO-qr-verifactu .small {
  line-height: 1rem;
}
/*--------------------------------------------------------------------------------------------------------*/


/* MCO - Form Búsqueda Dropdown */
.form-busqueda {
  position: absolute;
  top: 40px;
  z-index: 1000;
  left: 5px;
  right: 5px;
  max-width: 400px;
  max-height: 242px;
  border: 1px solid rgba(0,0,0,.125);
  box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.25);
}
.form-busqueda .list-group-scroll {
  overflow-y: auto;
  border-radius: .25rem;
}
.form-busqueda .list-group-item {
  border: none;
}
.form-busqueda .list-group-item > * {
  overflow: hidden;
  white-space: nowrap;
  display: block;
  text-overflow: ellipsis;
}
/*--------------------------------------------------------------------------------------------------------*/


/* MCO - KeyBoard Overlay: */
.mco_web_accesskey_overlay {
  display: none;
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0px;
  right: 0px;
  z-index: 100;
  background-color:rgba(0, 0, 0, 0.6);
  color: #ffffff;
  align-items: center;
  justify-content: center;
}
/*--------------------------------------------------------------------------------------------------------*/


/* MCO - AÑADIR AL 'DIV' QUE CONTENGA LA TABLA BOOTSTRAP 4, PARA SCROLL VERTICAL */
.mco-table-scroll {
  max-height:200px;
  overflow-y:auto;
}
.mco-table-scroll thead {
  position: sticky;
  top: 0;
  z-index: 2;
  background-color: white;
}
/*--------------------------------------------------------------------------------------------------------*/


/*
 * OPACIDAD AL MOSTRAR SIDEBAR EN SMARTPHONE
 */
 .overlay {
  display: none;
  position: fixed;
  /* full screen */
  width: 100vw;
  height: 100vh;
  /* transparent black */
  background: rgba(0, 0, 0, 0.2);
  /* middle layer, i.e. appears below the sidebar */
  z-index: 998;
  opacity: 0;
  /* animate the transition */
  transition: all 0.5s ease-in-out;
}
/*--------------------------------------------------------------------------------------------------------*/






/*
* CONTENIDO
*/
#content {
  width: calc(100% - 318px);
  padding-top: 56px;
  min-height: 100vh;
  transition: all 0.3s;
  position: absolute;
  top: 0;
  right: 0;
}
#content.active {
  width: 100%;
}

/* Se agranda contenido al ocultar el SideBar en smartphone */
@media (max-width: 1024px) {
   #content {
    width: 100%;
  }
  /*#content.active {
      width: calc(100% - 318px);
  }*/
}
/*--------------------------------------------------------------------------------------------------------*/







/*
 * CARD
 */
.card {
   margin-bottom: 30px;
   border-radius: 6px;
 }
 .card .card-header {
  font-weight: bold;
  background-color: #ffffff;
  border-bottom: none;
}
.card .card-header {
  border-top-left-radius: 6px;
  border-top-right-radius: 6px;
}
.card .card-body {
  border-bottom-left-radius: 6px;
  border-bottom-right-radius: 6px;
}
.card .card-footer {
  border-bottom-left-radius: 6px;
  border-bottom-right-radius: 6px;
}
.card .card-footer {
  background-color: #ffffff;
  border: none;
}
.card .card-text {
  min-height: 42px;
}

/*Añadir esta clase al 'div' padre de la 'Card', para que tengan el mismo alto*/
.mco-stretch-card {
  display: -webkit-flex;
  display: flex;
  -webkit-align-items: stretch;
  align-items: stretch;
  -webkit-justify-content: stretch;
  justify-content: stretch;
}
.mco-stretch-card > .card {
    width: 100%;
    min-width: 100%;
}
/*--------------------------------------------------------------------------------------------------------*/







/*
 * CSS RESPONSIVE PARA MAPA IFRAME - MAPA GOOGLE
 */
.map-responsive{
  position:relative;
  height:0;
  overflow:hidden;
  padding-bottom:56.25%;
  background-color: #fff;
  background-clip: padding-box;
  border: 1px solid #ced4da;
  border-radius: .25rem;
}
.map-responsive iframe{
  margin: 1%;
  position:absolute;
  left:0;
  top:0;
  height:96%;
  width:98%;
}
/*--------------------------------------------------------------------------------------------------------*/







/*
 * DATATABLE: DEJAR AQUÍ PARA QUE SURTA EFECTO
 */
table.dataTable {
    border-collapse: collapse !important;
}
table th a,
table td a {
  cursor: pointer;
  color: #a2a2a2;
}
table th a i,
table td a i {
  color: #a2a2a2;
  padding-left: 8px;
  padding-right: 8px;
}
table th a:hover i,
table td a:hover i {
  color: #005dc0;
}
table td a.icon-pdf {
  color: #AF231C;
}
table td a.icon-pdf:hover {
  color: #0090d4;
}
table th a.icon-plus,
table td a.icon-plus,
table th a.icon-plus i,
table td a.icon-plus i {
  color: #007bff;
}
table th a.icon-plus:hover,
table td a.icon-plus:hover,
table th a.icon-plus:hover i,
table td a.icon-plus:hover i {
  color: #005dc0;
}
table td a i.fa-trash-alt:hover,
table td a i.fa-minus:hover,
table td a i.fa-file-pdf:hover {
  color: #AF231C;
}
table td a i.fa-power-off:hover {
  color: #AF231C;
}
table td a i.fa-eye:hover {
  color: #576ed4;
}
table td a i.fa-print:hover {
  color: #576ed4;
}
table td a i.fa-paper-plane:hover {
  color: #576ed4;
}

/* Paginación */
.page-item.active .page-link {
    background-color: #f4633a;
    border-color: #f4633a;
}
.page-link, .page-link:hover {
  color: #2c9199;
}
.page-item.disabled .page-link {
  color: #888b8d;
  background-color: #eeeeee;
}

/* Customización botón 'dtr-control' */
table.dataTable.dtr-inline.collapsed>tbody>tr[class*="odd"]>td.dtr-control::before,
table.dataTable.dtr-inline.collapsed>tbody>tr[class*="odd"]>th.dtr-control::before,
table.dataTable.dtr-inline.collapsed>tbody>tr[class*="even"]>td.dtr-control::before,
table.dataTable.dtr-inline.collapsed>tbody>tr[class*="even"]>th.dtr-control::before {
  top: 50%;
  box-shadow: 0px 4px 18px rgba(0, 0, 0, 0.1);
  background-color: #32cb89;
  left: 4px;
  height: 14px;
  width: 14px;
  line-height: 14px;
  border: 2px solid white;
  border-radius: 14px;
}
table.dataTable.dtr-inline.collapsed>tbody>tr.parent[class*="odd"]>td.dtr-control:before,
table.dataTable.dtr-inline.collapsed>tbody>tr.parent[class*="odd"]>th.dtr-control:before,
table.dataTable.dtr-inline.collapsed>tbody>tr.parent[class*="even"]>td.dtr-control:before,
table.dataTable.dtr-inline.collapsed>tbody>tr.parent[class*="even"]>th.dtr-control:before {
  background-color: #f35956;
}

/* Personalización 'Detail Row' */
table.dataTable td.details-control {
  position: relative;
  width: 8px;
  padding-left: 0.6em;
  padding-right: 0.6em;
  cursor: pointer;
}
table.dataTable td.details-control::before {
  top: 50%;
  left: 5px;
  height: 1em;
  width: 1em;
  margin-top: -9px;
  display: block;
  position: absolute;
  color: white;
  border: .15em solid white;
  border-radius: 1em;
  box-shadow: 0 0 0.2em #444;
  box-sizing: content-box;
  text-align: center;
  text-indent: 0 !important;
  font-family: "Courier New",Courier,monospace;
  line-height: 1em;
  content: "+";
  background-color: #0275d8;
}
table.dataTable td.details-control::before {
  top: 50%;
  box-shadow: 0px 4px 18px rgba(0, 0, 0, 0.1);
  background-color: #32cb89;
  left: 4px;
  height: 14px;
  width: 14px;
  line-height: 14px;
  border: 2px solid white;
  border-radius: 14px;
}
table.dataTable tr.shown td.details-control::before {
  content: "−";
  background-color: #f35956;
}
table.dataTable tr.details-shown {
  background-color: rgba(0,0,0,.075);
}
/*--------------------------------------------------------------------------------------------------------*/






/* MCO - SignaturePad */
a.mco-icon-signature {
  cursor: pointer;
  color: #007bff;
}
a.mco-icon-signature:hover {
  color: #005dc0;
}
a.mco-icon-signature i.fa-border {
  border: 0.125em solid #007bff;
  border-radius: 0.2em;
  padding: 0.1em 0.15em 0.05em;
}
a.mco-icon-signature:hover i.fa-border {
  border-color: #005dc0;
}

.MCO-signaturePad {
  text-align: center;
}
.MCO-signaturePad canvas {
  padding: 0.25rem;
  border-radius: 0.25rem;
  border: 1px solid #dee2e6;
}
/*--------------------------------------------------------------------------------------------------------*/






/* MCO - Icono 'Reloj Arena' animado */
.mco-icon-hourglass-animated {
  opacity: 1;
}
.mco-icon-hourglass-animated i {
  opacity: 0;
  animation: mco-hourglass 2.4s ease-in infinite, mco-hourglass-spin 2.4s ease-out infinite;
}
.mco-icon-hourglass-animated > i:nth-child(1) {
  animation-delay: 0s, 0s;
}
.mco-icon-hourglass-animated > i:nth-child(2) {
  animation-delay: 0.6s, 0s;
}
.mco-icon-hourglass-animated > i:nth-child(3) {
  animation-delay: 1.2s, 0s;
}
.mco-icon-hourglass-animated > i:nth-child(4) {
  animation-delay: 1.8s, 0s;
}
.mco-icon-hourglass-animated > i:nth-child(4) {
  animation: mco-hourglass-end 2.4s ease-in infinite, mco-hourglass-spin 2.4s ease-out infinite;
}

@keyframes mco-hourglass {
  0% {
    opacity: 1;
  }
  24% {
    opacity: 0.9;
  }
  26% {
    opacity: 0;
  }
}
@keyframes mco-hourglass-end {
  0% {
    opacity: 0;
  }
  70% {
    opacity: 0;
  }
  75% {
    opacity: 1;
  }
  100% {
    opacity: 1;
  }
}
@keyframes mco-hourglass-spin {
  75% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(180deg);
  }
}
/*--------------------------------------------------------------------------------------------------------*/