/* CSS del sistema by Hiva */
a {
    color:#FF9800
}
a.badge {
    color:#fff;
}
.badge {
    border:0px !important;
}
.navbar-vertical .navbar-brand > img, .navbar-vertical .navbar-brand-img {
    max-height: initial !important;
}
.navbar-vertical {
    background:#fff !important;
}
.navbar-vertical .navbar-nav .nav-link {
    color: #344767;
}
.user-image {
    width: 36px;
    height: 36px;
    border-radius: 50%;
}
/* css variables */
:root {
    --blue: #2C46C3;
    --red: #DE3B40;
    --mint: #0EA5A8;
    --orange: #FF7F00;
    --lblue: #379AE6;
    --yellow: #FFEB15;
    --black: #000;

    /* Material Design Colors */
    --primary-blue: #2196F3; /* Azul Primario */
    --secondary-blue: #03A9F4; /* Azul Secundario */
    --light-blue: #80D8FF; /* Azul Claro */
    --dark-blue: #1565C0; /* Azul Oscuro */
    
    --primary-red: #F44336; /* Rojo Primario */
    --secondary-red: #FF5722; /* Rojo Secundario */
    --light-red: #FFCDD2; /* Rojo Claro */
    --dark-red: #D32F2F; /* Rojo Oscuro */
    
    --primary-green: #4CAF50; /* Verde Primario */
    --secondary-green: #8BC34A; /* Verde Secundario */
    --light-green: #A5D6A7; /* Verde Claro */
    --dark-green: #006539; /* Verde Oscuro */
    
    --primary-yellow: #FFEB3B; /* Amarillo Primario */
    --secondary-yellow: #FF9800; /* Amarillo Secundario */
    --light-yellow: #FFF59D; /* Amarillo Claro */
    --dark-yellow: #FBC02D; /* Amarillo Oscuro */
    
    --primary-purple: #9C27B0; /* Púrpura Primario */
    --secondary-purple: #673AB7; /* Púrpura Secundario */
    --light-purple: #E1BEE7; /* Púrpura Claro */
    --dark-purple: #8E24AA; /* Púrpura Oscuro */

    --grey: #9E9E9E; /* Gris */
    --light-grey: #BDBDBD; /* Gris Claro */
    --dark-grey: #616161; /* Gris Oscuro */
}
.bg-color-blue {
    background-color:var(--blue);
}
.bg-color-red {
    background-color:var(--red);
}
.bg-color-mint {
    background-color:var(--mint);
}
.bg-color-orange {
    background-color:var(--orange);
}
.bg-color-lblue {
    background-color:var(--lblue);
}
.bg-color-yellow {
    background-color:var(--yellow);
}
.bg-color-green {
    background-color:var(--primary-green);
}
.bg-color-dgreen {
    background-color:var(--dark-green);
}
.bg-color-purple {
    background-color:var(--primary-purple);
}
.bg-color-orange {
    background-color:var(--secondary-red);
}
.bg-color-blue-2 {
    background-color:var(--secondary-blue);
}
.btn-sm, .btn-group-sm > .btn {
    height: 30px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    line-height: 1em;
}
/* Reset para botones ícono */
/* ===== Botones de ícono ===== */
.btn-icon {
  border: none;
  border-radius: 0.5rem;
  width: 30px;
  height: 30px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: background-color 0.2s;
  margin-left: 0.25rem;
}

.btn-icon i {
  font-size: 0.9rem;
}
.btn-icon:hover i {
  color:#fff !important;
}

/* Editar (Amarillo) */
.btn-icon.warning {
  background-color: var(--light-yellow);
  color: var(--dark-yellow);
}
.btn-icon.warning:hover { background-color: var(--primary-yellow); }

/* Eliminar (Rojo) */
.btn-icon.danger {
  background-color: var(--light-red);
  color: var(--dark-red);
}
.btn-icon.danger:hover { background-color: var(--primary-red); }

/* Info (Azul) */
.btn-icon.info {
  background-color: var(--light-blue);
  color: var(--dark-blue);
}
.btn-icon.info:hover { background-color: var(--primary-blue); }

/* Success (Verde) */
.btn-icon.success {
  background-color: var(--light-green);
  color: var(--dark-green);
}
.btn-icon.success:hover { background-color: var(--primary-green); }

/* Default (Gris) */
.btn-icon.default {
  background-color: var(--light-grey);
  color: var(--dark-grey);
}
.btn-icon.default:hover { background-color: var(--grey); }

.sidenav-header {
    height: auto;
}

.title-sec {
    display: inline-block;
    font-size: 1.4rem;
    color: #344767 !important;
    font-weight: 600;
}
.title-sec::after {
    content:"";
    width:30px;
    height:2px;
    background:#e3e3e3;
    display:block;
}
.select2-container {
    width:100% !important;
}
.select2-selection__rendered {
    padding: 0.5rem 0px !important;
    line-height: 1.5em !important;
    font-size: 0.875rem !important;
}
.select2-container--default .select2-selection--single {
    border: 0px !important;
    border-bottom: 1px solid #d2d2d2 !important;
    border-radius: 0px !important;
    height:auto !important;
}
span.error {
    font-size:0.9rem;
    color:red;
}
.bg-gradient-menu {
    background-image: linear-gradient(195deg, #2196F3 0%, #00BCD4 100%);
}
.swal2-popup,.swal2-title {
    font-family: "Roboto", Helvetica, Arial, sans-serif !important;
}
#salirBtn {
    cursor:pointer;
}
label {
    background: #e3e3e3;
    padding: 0.2rem 0.3rem;
    color: #000;
    font-size: 0.7rem;
    line-height: 1em;
    border-radius: 4px !important;
    margin-left: -0.3rem !important;
    margin-bottom: 5px !important;
}
label::after {
    content:":";
    color:#000;
    font-size: 0.7rem;
}
.radio-check-box-container label {
    background: #fff;
    padding: 0px;
    color: #000;
    font-size: 0.8rem;
    line-height: initial;
    border-radius: 0px !important;
    margin-left: 0px !important;
    margin-bottom: initial !important;
}
input.form-control:-internal-autofill-selected,
input.form-control:-webkit-autofill,
.input-group input.form-control:-webkit-autofill {
    background-color: white !important; /* Fondo blanco */
}
.modal-header {
    background-color: #e3e3e3;
}
.subtitulo_form {
        text-transform: uppercase;
        padding: 0.4rem 0px;
        width: 50%;
        border-bottom: 3px solid ;
        letter-spacing: 2px
}
.subtitulo_info {
    color:var(--blue);
}
.icon-lg i {
    top: 12%;
    font-size: 2rem;
}

.collapse-icon-bg {
    /*background: #e3e3e3;*/
    border-radius: 4px;
    padding:3px 5px;
    aspect-ratio: 1/1;
    display: flex;
    flex-flow: column;
    justify-content: center;
    align-items: center;
}