/* **************************
Company: Ingelectra Constructora, S.A.
Autor: Yeily Calderón Marín
Mail: yeilycalderon@yahoo.es
************************** */

:root {
    --anchoSidebar: 225px;
}

* {
    box-sizing: border-box; /* para tener control de las cajas */
    padding: 0px;
    margin: 0px;
    font-size: 11px;
}

/* @font-face {
    font-family: 'DIN';
    src: url("fuente-ig.ttf");
} */

/*#region Etiquetas HTML */

body {
    display: block;
    width: 100%;
    background-color: #fff;
    color: #000;
    font-family: "DIN", sans-serif;
    text-align: center;
}

header {
    display: block;
    /* background-color: #0d553e; */
    background-color: #e6e5e6;
    padding: 10px;
    text-align: left;
    border-bottom: 1px solid #0d553e;
    margin-left: var(--anchoSidebar);
}

main {
    margin-left: var(--anchoSidebar); /* Same as the width of the sidenav */
    font-size: 28px; /* Increased text to enable scrolling */
    padding: 0px 10px;
}

table {
    /*table-layout: fixed;*/
    width: auto;
    border-radius: 5px;
    border-collapse: collapse;
}

th, td {
    border-bottom: 1px solid #f59d40;
    padding: 5px;
    overflow-wrap: break-word;
}

th {
    background: linear-gradient(to top,#0d553e , #fff);
    color: #0d553e;
}

tbody tr:nth-child(even)
{
    background: #e6e5e6;
}

input[type=checkbox]
{
  /* Double-sized Checkboxes */
  -ms-transform: scale(3); /* IE */
  -moz-transform: scale(3); /* FF */
  -webkit-transform: scale(3); /* Safari and Chrome */
  -o-transform: scale(3); /* Opera */
  transform: scale(2);
  padding: 10px;
}

.embebido {
    width: 100%;
    height: 500px;
}

button {
    padding: 5px;
    border-radius: 5px;
}

/*#endregion Etiquetas HTML */

/*#region Ids */

/* #region mnuLateral */
/* No borrar, aunque no se use, queda por si cambia el estilo del menú (componente menu.blade.php) */
#mnuLateral {
    position: fixed;
    width: 200px;
    left: -155px;
    margin: 10px auto;
    text-align: end;
    background: #0d553e;
    transition: all 0.5s;
    padding: 0 5px;
    font-weight: 600;
}
#mnuLateral:hover {
    left: 0;
    transition: all 0.5s;
}
#mnuLateral ul, li {
    list-style: none;
    margin: 0;
    padding: 0; 
}
#mnuLateral ul li:hover { 
    position: relative; 
    z-index: 500;
}
#mnuLateral ul ul{
    visibility: hidden;
    position: absolute;
    top: 0;
    left: 100%;
    z-index: 500;
}
#mnuLateral ul li:hover > ul {
    visibility: visible; 
}
#mnuLateral li:hover, 
#mnuLateral li.active,
#mnuLateral ul ul li:hover { 
    background: (255, 255, 255, 0.3); 
}

#mnuLateral ul ul li {
    background: #0d553e;
}

#mnuLateral img {
    padding-left: 10px;
}

#mnuLateral ul li {
    display: block;
    float: none;
    border-bottom: 1px solid rgba(255, 255, 255, 0.3);
}
#mnuLateral a {
    display: block;
    color: #f59d40;
    padding: 10px;
    text-decoration: none;
    /*line-height: 160%;
    width: 164px;*/
}

#mnuLateral ul li a:hover {
    background-color: rgba(255, 255, 255, 0.3);
}


/* endregion mnuLateral */

/* region sidebar */
/*.wrapper .sidebar{
    background: rgb(5, 68, 104);
    position: fixed;
    top: 0;
    left: 0;
    width: var(--anchoSidebar);
    height: 100%;
    padding: 20px 0;
    transition: all 0.5s ease;
}

.wrapper .sidebar .profile{
    margin-bottom: 30px;
    text-align: center;
}

.wrapper .sidebar .profile img{
    display: block;
    width: 100px;
    height: 100px;
    border-radius: 50%;
    margin: 0 auto;
}

.wrapper .sidebar .profile h3{
    color: #ffffff;
    margin: 10px 0 5px;
}

.wrapper .sidebar .profile p{
    color: rgb(206, 240, 253);
    font-size: 14px;
}

.wrapper .sidebar ul li a{
    display: block;
    padding: 13px 30px;
    border-bottom: 1px solid #10558d;
    color: rgb(241, 237, 237);
    font-size: 16px;
    position: relative;
    text-decoration: none;
    text-align: left;
}

.wrapper .sidebar ul li a .icon{
    color: #dee4ec;
    width: 30px;
    display: inline-block;
}

.wrapper .sidebar ul li a:hover,
.wrapper .sidebar ul li a.active{
    color: #0d553e;

    background:#e6e5e6;
    border-right: 2px solid rgb(5, 68, 104);
}

.wrapper .sidebar ul li a:hover .icon,
.wrapper .sidebar ul li a.active .icon{
    color: #0c7db1;
}

.wrapper .sidebar ul li a:hover:before,
.wrapper .sidebar ul li a.active:before{
    display: block;
}

.wrapper .section{
    width: calc(100% - var(--anchoSidebar));
    margin-left: var(--anchoSidebar);
    transition: all 0.5s ease;
}

.wrapper .section .top_navbar{
    background: rgb(7, 105, 185);
    height: 50px;
    display: flex;
    align-items: center;
    padding: 0 30px;

}

body.active .wrapper .sidebar{
    left: var(calc(-1 * --anchoSidebar));
}

body.active .wrapper .section{
    margin-left: var(--anchoSidebar);
    width: 100%;
}
*/

.reporte {
    --anchoSidebar: 0px;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  }

.sidebar {
    position: fixed;
    top: 0;
    left: 0;
    margin: 0;
    padding: 0;
    width: var(--anchoSidebar);
    background-color: rgb(5, 68, 104);
    height: 100%;
    overflow: auto;
  }

.sidebar .perfil{
    padding-bottom: 30px;
    color: #ffffff;
    text-align: center;
    border-bottom: 1px solid #10558d;
}

.sidebar .perfil img{
    display: block;
    width: 100px;
    height: 100px;
    border-radius: 50%;
    margin: 15px auto;
}

.sidebar .perfil h3 {
    margin: 10px 0 5px;
}
  
.sidebar a {
    display: block;
    color: rgb(241, 237, 237);
    padding: 13px 30px;
    text-decoration: none;
    border-bottom: 1px solid #10558d;
    text-align: left;
}
   
.sidebar a.active {
    background-color: #e6e5e6;
    color: #0d553e;
}

.sidebar ul li a .icon{
    color: #dee4ec;
    width: 30px;
    display: inline-block;
}
  
.sidebar a:hover:not(.active) {
    background-color: #e6e5e6;
    color: #0d553e;
}
/* endregion sidebar */

#chk-fav {
    display: none;
}

#chk-fav:checked ~ .nav-fav {
    display: flex;
}

#frm-login {
    padding: 10px;
    background-color: #0d553e;
}

#moduloVue {
    border: 1em solid #0d553e;
	height: 80%;
}

#moduloVue > iframe {
	height: 700px;
}


/*#endregion Ids */

/*#region Verdaderas Clases */
/*#region Contenedores */
.nombre-sitio {
    font-size: 32px;
}

.inicio {
    background-color: #e6e5e6;
    color: #f59d40;
    text-align: center;
    font-size: xx-large;
    padding: 10px;
    border: 1em solid #0d553e;
}

.login,
.mensaje {
    background-color: #fff;
    color: #0d553e;
    padding: 20px;
    margin: 10px;
    font-size: 16px;
    text-align: center;
}

.login {
    text-align: end;
}

.header {
    display: block;
    background-color: #e6e5e6;
    padding: 10px;
    text-align: left;
    border-top: 1px solid #0d553e;
    border-bottom: 1px solid #0d553e;
}

.cuerpo {
    /* display: flex;
    flex-direction: column; */
    
    align-items: center;
    padding: 20px;
    margin-left: var(--anchoSidebar);
}

.cuerpo table {
    display: inline-block;
    margin: 1em;
}

.grupo {
    width: auto;
    border: 1px solid #e6e5e6;
    border-radius: 5px;
    padding: 10px;
    margin: 10px;
    background: #fff;
}

/* #region Emergente */

.contenido {
    display: grid;
    /*grid-template-rows: repeat(3, 1fr);*/
    gap: 5px;
    font-size: 12px;
    align-items: stretch;
    border: 1px solid #999;
    margin-left: var(--anchoSidebar);
    padding: 20px;
}

.contenido-titulo {
    font-size: 24px;
    font-weight: bold;
    color: #fff;
    padding: 5px;
    background-color:rgb(10, 100, 150);
    border-radius: 5px;
}

.contenido-bar {
    margin-left: 10px;
    margin-right: 10px;
    background-color: #e6e5e6;
}

.contenido-menu {
    display: grid;
    margin-left: 50px;
    grid-template-columns: repeat(3, 1fr);
}

.contenido-menu-2 {
    display: grid;
    grid-template-columns: 1fr 2fr;
}

.contenido-menu-4 {
    display: grid;
    margin-left: 50px;
    grid-template-columns: repeat(4, 1fr);
}

.contenido-data {
    display: grid;
    /*justify-content: center;*/
    /*margin: 0 auto;*/
    margin-left: 10px;
    margin-right: 10px;
    /*border: 1px solid royalblue ;*/
    margin-bottom: 10px;
    border-radius: 5px;
}

.contenido-card {
    display: grid;
    gap: 5px;
    font-size: 12px;
    align-items: stretch;
}

/* .scrollable {
    width: 300px;
    height: 200px;
    overflow: auto;
    border: 1px solid #ccc;
} */

/* #region Modal */

.modal {
    display: none;
    width: 100%;
    height: 100vh;
    position: fixed;
    top: 0;
    left: 0;
    overflow: auto;
    background-color:rgba(0,0,0,0.5);
    justify-content: center;
    align-items: center;
    z-index: 999;
}

#y-modal input[type=checkbox] {
    display: none;
}

#y-modal input[type=checkbox]:checked ~ .modal {
    display: flex;
}

.modal-contenedor {
    display: grid;
    max-width: 700px;
    max-height: 550px;
    background-color: #fff;
    border-radius: 5px;
    justify-content: center;
    align-items: center;
}

.modal-titulo {
    display: flex;
    height: 50px;
    padding: 10px;
    margin: 5px;
    justify-content: center;
    align-items: center;
    background: linear-gradient(to bottom, rgb(5, 68, 104), #fff);
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    font-size: x-large;
    font-weight: bold;
}

.modal-contenido {
    height: auto;
    max-height: 350px;
    margin: 15px;
    overflow-y: auto;
}

.modal-pie {
    display: flex;
    margin: 10px;
    padding-top: 10px;
    justify-content: flex-end;
    border-top: 1px solid #999;
    background: linear-gradient(to top, #0d553e, #fff);
}

.modal-pie button:hover {
    color: #000;
}

/* #endregion Modal */

/* #region Alerta */
.alerta {
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background: rgba(0,0,0,0.7);
	z-index: 99999;
	opacity:0;
	-webkit-transition: opacity 400ms ease-in;
	-moz-transition: opacity 400ms ease-in;
	transition: opacity 400ms ease-in;
	pointer-events: none;
}

.alerta:target {
	opacity:1;
	pointer-events: auto;
}

.alerta > div {
	width: 400px;
	position: relative;
	margin: 10% auto;
	padding: 5px 20px 13px 20px;
	border-radius: 10px;
	background: #fff;
	background: -moz-linear-gradient(#fff, #999);
	background: -webkit-linear-gradient(#fff, #999);
	background: -o-linear-gradient(#fff, #999);
    -webkit-transition: opacity 400ms ease-in;
    -moz-transition: opacity 400ms ease-in;
    transition: opacity 400ms ease-in;
}

.alertaClose {
	background: #606061;
	color: #FFFFFF;
	line-height: 25px;
	position: absolute;
	right: -12px;
	text-align: center;
	top: -10px;
	width: 24px;
	text-decoration: none;
	font-weight: bold;
	-webkit-border-radius: 12px;
	-moz-border-radius: 12px;
	border-radius: 12px;
	-moz-box-shadow: 1px 1px 3px #000;
	-webkit-box-shadow: 1px 1px 3px #000;
	box-shadow: 1px 1px 3px #000;
}

.alertaClose:hover { 
    background: #00d9ff; 
}

/* #endregion Alerta */

/* #region modal Textbox Buscador */
.busqueda [hidden] {
    display: none;
}

.busqueda .visually-hidden {
    position: absolute;
    clip: rect(0, 0, 0, 0);
}

.busqueda {
    display: inline-block;
    position: relative;
}

.busqueda > input {
    display: block;
}

.busqueda > ul {
    position: absolute;
    left: 0;
    z-index: 1;
    min-width: 100%;
    box-sizing: border-box;
    list-style: none;
    padding: 0;
    margin: 0;
    background: #fff;
}

.busqueda > ul:empty {
    display: none;
}

.busqueda > ul {
	border-radius: .3em;
	margin: .2em 0 0;
	background: hsla(0,0%,100%,.9);
	background: linear-gradient(to bottom right, white, hsla(0,0%,100%,.8));
	border: 1px solid rgba(0,0,0,.3);
	box-shadow: .05em .2em .6em rgba(0,0,0,.2);
	text-shadow: none;
}

@supports (transform: scale(0)) {
	.busqueda > ul {
		transition: .3s cubic-bezier(.4,.2,.5,1.4);
		transform-origin: 1.43em -.43em;
	}
	
	.busqueda > ul[hidden],
	.busqueda > ul:empty {
		opacity: 0;
		transform: scale(0);
		display: block;
		transition-timing-function: ease;
	}
}


#autoCompletedList {
    color: hsl(0, 0%, 0%);
    padding: 0;
    margin: 0;
    list-style-type: none;
  }
  #autoCompletedList li {
    background: #424242;
    padding: 5px;
    color: hsl(0, 0%, 100%);
    border-bottom: dotted 1px hsl(0, 0%, 58%);
  }
  #autoCompletedList li:hover {
    background: hsl(0, 0%, 36%);
    cursor: pointer;
  }

      
  #autoCompletedList {
    color: hsl(0, 0%, 0%);
    padding: 0;
    margin: 0;
    list-style-type: none;
  }
  #autoCompletedList li {
    background: #424242;
    padding: 5px;
    color: hsl(0, 0%, 100%);
    border-bottom: dotted 1px hsl(0, 0%, 58%);
  }
  #autoCompletedList li:hover {
    background: hsl(0, 0%, 36%);
    cursor: pointer;
  }

/* Pointer */
.busqueda > ul:before {
    content: "";
    position: absolute;
    top: -.43em;
    left: 1em;
    width: 0; height: 0;
    padding: .4em;
    background: white;
    border: inherit;
    border-right: 0;
    border-bottom: 0;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}

.busqueda > ul > li {
    position: relative;
    padding: .2em .5em;
    cursor: pointer;
}

.busqueda > ul > li:hover {
    background: hsl(200, 40%, 80%);
    color: black;
}

.busqueda > ul > li[aria-selected="true"] {
    background: hsl(205, 40%, 40%);
    color: white;
}

.busqueda mark {
    background: hsl(65, 100%, 50%);
}

.busqueda li:hover mark {
    background: hsl(68, 100%, 41%);
}

.busqueda li[aria-selected="true"] mark {
    background: hsl(86, 100%, 21%);
    color: inherit;
}
/* #endregion Textbox Buscador */

/* #endregion Emergente */


/* .bloque {
    display: block;
} */

/*#endregion Contenedores*/

/*#region Posicion */
.centrado {
    display: inline-block;
    width: auto;
    text-align: center;
    /*justify-self: center;
    align-self: center;*/
    margin-left: auto;
    margin-right: auto;
}

.bloque {
    display: inline-block;
    width: 80%;
    margin-left: 5px;
    margin-right: 5px;
}

.derecha {
    text-align: right;
    justify-self: end;
}

.izquierda {
    text-align: left;
}

.oculto {
    display: none;
}

.deshabilitado {
    pointer-events: none;
}

.sep-S {
    margin: 2px;
}

.sep-M {
    margin: 5px;
}

.sep-L {
    margin: 10px;
}

.sep-R-XL {
    margin-right: 100px;
}

.ancho-corto {
    width: 100px;
}

.ancho-medio {
    width: 300px;
}

.ancho-largo {
    width: 500px;
}

.ancho-extralargo {
    width: 750px
}

.ancho-auto {
    display: inline-block;
    margin-left: auto;
    margin-right: auto;
}

.ancho-full {
    display: inline-block;
    width: 100%;
}

/*#endregion Posicion */

/*#region Apariencia */

.control {
    /*font-weight: bold;*/
    padding:6px 12px;
    font-size:12px;
    background-color:#fff;
    border-radius:5px;
    text-decoration: none;
    -webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,.075);
    box-shadow:inset 0 1px 1px rgba(0,0,0,.075);
    -webkit-transition:border-color ease-in-out .30s,-webkit-box-shadow ease-in-out .30s;
    -o-transition:border-color ease-in-out .30s,box-shadow ease-in-out .30s;
    transition:border-color ease-in-out .30s,box-shadow ease-in-out .30s
}

.encabezado {
    color: orange;
}

.encabezado-grilla {
    background: #424242;
    color: #fff;
    border: #fff solid 1px;
}

.subtitulo {
    display: grid;
    padding: 5px;
    margin: 10px;
    /* margin-left: 100px; */
    text-align: left;
    /* background-color: #b38e8e; */
    background-color: #9d9d9d;
    border-radius: 5px;
}

.N {
    font-weight: bold;
}

/*#region Efectos */

.iluminado:focus,
.iluminado:hover {
    border-color:#f59d40;
    outline:0;
    -webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgb(255, 255, 0);
    box-shadow:inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgb(255, 255, 0);
    -webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,0.5),0 0 8px rgb(255, 255, 0);
    box-shadow:inset 0 1px 1px rgba(0,0,0,0.5),0 0 8px rgb(255, 255, 0);
}

.iluminado-fijo {
    border-color:#f59d40;
    outline:0;
    -webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgb(255, 255, 0);
    box-shadow:inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgb(255, 255, 0);
    -webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,0.5),0 0 8px rgb(255, 255, 0);
    box-shadow:inset 0 1px 1px rgba(0,0,0,0.5),0 0 8px rgb(255, 255, 0);
}

.sombreado {
    box-shadow: 2px 2px 2px 2px rgba(0,0,0,0.3);
}

.error {
    color: red;
}

.borde {
    border: 1px solid #999;
}


.aviso {
    padding: 10px;
    margin: 10px 0;
    border-radius: 4px;
}

.aviso-success {
    background-color: #d4edda; /* Color de fondo verde claro */
    color: #155724; /* Color del texto verde oscuro */
    border: 1px solid #c3e6cb; /* Borde verde */
}

.aviso-error {
    background-color: #df8f8f; /* Color de fondo rojo claro */
    color: #eb0505; /* Color del texto rojo oscuro */
    border: 1px solid #e6c3c3; /* Borde rojo */
}

.aviso-success a {
    color: #155724; /* Color del enlace dentro de la alerta */
}

.aviso-success .close {
    float: right;
    font-size: 20px;
    font-weight: bold;
    color: #155724;
    text-decoration: none;
    opacity: 0.5;
}

.aviso-success .close:hover .aviso-error {
    opacity: 1; /* Cambia la opacidad al pasar el ratón */
}

/*
.fondo-oscuro {
    color:#fff!important;
    background-color:#000!important;
}

.w3-container,.w3-panel{padding:0.01em 16px}.w3-panel{margin-top:16px;margin-bottom:16px}
.w3-teal,.w3-hover-teal:hover{color:#fff!important;background-color:#009688!important}
.w3-btn,.w3-button{border:none;display:inline-block;padding:8px 16px;vertical-align:middle;overflow:hidden;text-decoration:none;color:inherit;background-color:inherit;text-align:center;cursor:pointer;white-space:nowrap}
.w3-display-topleft{position:absolute;left:0;top:0}.w3-display-topright{position:absolute;right:0;top:0}
.w3-card-4,.w3-hover-shadow:hover{box-shadow:0 4px 10px 0 rgba(0,0,0,0.2),0 4px 20px 0 rgba(0,0,0,0.19)}
.w3-button:hover{color:#000!important;background-color:#ccc!important}
*/
/*#endregion Efectos */

/*#endregion Apariencia */

/*#endregion Verdaderas Clases*/

/*#region Clases */


/* Asignarle una apariencia a label */
.etiqueta {
    border: 1px solid silver;
    border-radius: 4px;
    padding: 0 10px;
    /* height: 10px; */

    display: inline-flex;
    align-items: center;
    justify-content: center;
    /* height: 30px; */
}

.etiqueta-lbl {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.etiqueta:hover {
    background-color: rgba(0, 0, 0, 0.05);
}

/*#region Imagenes */
.logo-inicio {
    width: 30%;
    height: 30%;
}

.logo {
    width: 300px;
    padding: 10px;
    border-radius: 5px;
}

/*#endregion Imagenes */

.ico-fav {
    position: absolute;
    top: 50px;
    left: calc(320px + var(--anchoSidebar));
    border-radius: 15px;
}

.nav-fav {
    display: none;
    position: absolute;
    left: calc(300px + var(--anchoSidebar));
    background: #0d553e;
    font-weight: bold;
    /*transition: all 0.5s;*/
}

.nav-fav ul li a {
    display: block;
    color: #f59d40;
    padding: 10px;
    text-decoration: none;
    line-height: 160%;
    width: 164px;
}

.nav-fav ul li a:hover {
    background-color: rgba(150, 250, 150, 0.3);
}

.nav-fav ul,
.nav-sesion ul {
    overflow: hidden;
    list-style: none;
}

.nav-sesion ul li a {
    position: absolute;
    /*left: 90%;*/
    top: 50px;
    background-color: #f59d40;
    padding: 10px;
    text-decoration: none;
    /*font-size: medium;*/
    border-radius: 5px;
    right: 50px;

    -webkit-appearance: button;
    -moz-appearance: button;
    appearance: button;
    box-shadow: 2px 2px 2px 2px rgba(0,0,0,0.3);
    color: #0d553e;
}

.contenedor {
    display: grid;
    grid-template-columns: repeat(2,1fr);
    gap: 1em;
    margin: 10px 10px 10px 60px;
    /* min-height: 400px; */
}

.colspan-2 {
    grid-column: span 2;
}

.colspan-3 {
    grid-column: span 3;
}

.colspan-6 {
    grid-column: span 6;
}

.rowspan-2 {
    grid-row: span 2;
}

.rowspan-3 {
    grid-row: span 3;
}

.novedad {
    background: #e6e5e6;
    border-radius: 3px;
    border: 1px solid rgba(0,0,0,0.3);
    justify-self: center;
    align-self: center;
    margin-left: var(--anchoSidebar);
}

.titulo {
    background: linear-gradient(to top,#0d553e , #fff);
    height: 30px;
    text-align: center;
    font-weight: bold;
}

.nov-nota {
    display: grid;
    grid-template-columns: 1fr 2fr;
}

.nov-pie {
    background: linear-gradient(to top,#f59d40, #fff);
    padding: 20px;
}

.imagen img {
    width: 200px;
}

.pie {
    display: block;
    /*background: #0d553e;*/
    background-color: #e6e5e6;
    /*background: linear-gradient(to bottom, #0d553e, #555255);*/
    /*color: #f59d40;*/
    color: #0d553e;
    padding: 20px;
    font-size: 10px;
    border-top: 1px solid #0d553e;
    border-bottom: 1px solid #0d553e;
    margin-left: var(--anchoSidebar);
}

.boton {
    background: linear-gradient(to top,#f59d40 , #fff);
    color: #0d553e;
}

.btn-menu {
    padding: 5px;
    margin: 3px;
    float: right;
    text-decoration: none;
    border-radius: 3px;

    -webkit-appearance: button;
    -moz-appearance: button;
    appearance: button;
    color: #0d553e;
}

.toolbar {
    display: flex;
    padding: 5px;
    gap: 5px;
    float: left;
    border-radius: 5px;
}

.pagination {
    display: flex;
    padding-left: 0;
    list-style: none;
}
.page-item:not(:first-child) .page-link{margin-left:-1px}.page-item.active .page-link{z-index:3;color:#fff;background-color:#0d6efd;border-color:#0d6efd}.page-item.disabled .page-link{color:#6c757d;pointer-events:none;background-color:#fff;border-color:#dee2e6}.page-link{padding:.375rem .75rem}.page-item:first-child .page-link{border-top-left-radius:.25rem;border-bottom-left-radius:.25rem}.page-item:last-child .page-link{border-top-right-radius:.25rem;border-bottom-right-radius:.25rem}

/*
.tool-btn {
    display: grid;
    grid-template-columns: 30px 50px;
    align-items: center;
    vertical-align: middle;
    border: 1px solid #0d553e;
    padding: 5px;
    border-radius: 3px;
}*/

.tabla {
    width: 100%;
}

.tabla tbody tr:hover { 
    background: #acc5da; 
} 

.tabla td {
    cursor: grabbing; 
    text-align: start;
}

.tabla img {
    cursor: pointer;
}

/*#endregion Clases */



/*#region Media */
@media screen and (max-width:768px) {
    :root {
        --anchoSidebar: 0px;
    }

    .login {
        text-align: center;
    }

    /*.nav-sesion {
        display: none;
    }*/

    .contenedor {
        grid-template-columns: 1fr;
    }

    .sidebar {
        width: 100%;
        height: auto;
        position: relative;
    }

    .sidebar a {
        float: left;
        width: 200px;
    }

    .modal-contenido {
        width: 90%;
    }
}
  
@media screen and (max-width: 400px) {
    .sidebar a {
        text-align: center;
        float: none;
    }
}

/*#endregion Media */