
.concepto {
	display: inline-block;
	color: var(--gris);
	font-weight: bold;
	font-size: 14px;
	line-height: 20px;
}

.valor {
	display: inline-block;
	color: var(--gris);
	font-size: 14px;
	max-width: 100%;
}

.tabla_calculadora {
	display: grid;
	grid-template-columns: minmax(130px, auto) minmax(80px, auto);
}

.tabla_colindancias {
	display: grid;
	grid-template-columns: 40px 1fr 50px;
	padding: 0;
}
	.tabla_colindancias > div { padding: 0px 5px; }

.tabla_depositos {
	display: grid;
	grid-template-columns: 300px 400px 550px;
	gap: 20px; /* Espacio entre las columnas y filas */
	margin: 0 auto; /* Centra horizontalmente el div */
	width: fit-content;
}

.tabla_valores2 {
	display: grid;
	grid-template-columns: 2fr 3fr;
}
	.tabla_valores2 > div { padding: 10px 0px; border-bottom: 1px solid var(--alpha); }
	.tabla_valores2 > div:last-child { padding-bottom: 10px; }

.tabla_2, .tabla_3, .tabla_4, .tabla_5, .tabla_6, .tabla_7, .tabla_9, .tabla_10, .tabla_11 {
	display: grid;
	grid-template-columns: repeat(6, 1fr);
}

	.tabla_2 { grid-template-columns: repeat(2, 1fr); }
	.tabla_3 { grid-template-columns: repeat(3, 1fr); }
	.tabla_4 { grid-template-columns: repeat(4, 1fr); }
	.tabla_5 { grid-template-columns: repeat(5, 1fr); }

	.tabla_10 { grid-template-columns: repeat(10, 1fr); }
	.tabla_11 { grid-template-columns: repeat(11, 1fr); }

	.tabla_2 > div, .tabla_3 > div, .tabla_4 > div, .tabla_5 > div, .tabla_6 > div, .tabla_7 > div {
		padding: 10px 0px;
		border-bottom: 1px solid var(--gris);
	}

	.tabla_2 > div:last-child, .tabla_3 > div:last-child, .tabla_4 > div:last-child, 
	.tabla_5 > div:last-child, .tabla_6 > div:last-child, .tabla_7 > div:last-child {
		padding-bottom: 10px;
	}

/*--------------------------------------------------------------
# tabla div
--------------------------------------------------------------*/

.table {
	margin: 0 auto;
	display: grid;
	width: 100%;
	grid-template-rows: auto;
	grid-template-columns: auto;
	grid-gap: 0px;
	justify-content: center; /* Centra horizontalmente en la página */
}

.row {
	display: contents;
}
	.row:hover .cell { background-color: var(--hover); }
	.row:first-child .cell {
		font-weight: bold;
		padding: 6px 5px;
		background-color: var(--gris10);
		color: var(--negro);
		text-align: center;
		vertical-align: top;
	}
	.row:last-child .cell { border-bottom: 1px solid var(--border); }
	.row:nth-last-child(2) .cell { border-bottom: 1px solid var(--border); }
	.row.oculto { display: none; }
	
.cell {
	padding: 5px;
	border-top: 1px solid var(--border);
	border-left: 1px solid var(--border);
	text-align: left;
	vertical-align: top;
}
	.cell:last-child { border-right: 1px solid var(--border); }


/*--------------------------------------------------------------
# tabla scroll
--------------------------------------------------------------*/

.tabla-scroll {
	max-height: 150px;
	overflow-y: auto;
}

.tabla-scroll table {
	width: 100%; /* La tabla ocupa todo el ancho del contenedor */
	border-collapse: collapse; /* Quita espacios entre celdas */
}

.tabla-scroll thead th {
	position: sticky; /* Fija el encabezado */
	top: 0; /* Posición del sticky */
	background-color: white; /* Fondo para el encabezado */
	z-index: 1; /* Eleva el encabezado */
}

/*--------------------------------------------------------------
# tabla
--------------------------------------------------------------*/

table {
	margin: 0px auto 0px;
	color: var(--gris);
	text-align: left;
	font-size: 13px;
	line-height: 18px;
	background: none;
	border-radius: 8px;
	border-collapse: collapse;
	box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
	animation: float 5s infinite;
}

table.cien { width: 100%; }

table th {
	font-size: 16px;
	font-weight: 100;
	text-align: center;
	vertical-align: middle;
	padding: 10px;
	border-bottom: 4px solid var(--dorado);
	border-right: 1px solid var(--oxford);
	background: var(--oscuro);
	color: var(--plata);
}

table th:first-child { border-top-left-radius:8px; }
table th:last-child { border-top-right-radius:8px; border-right:none; }
table th a { color: var(--blanco); }

table th.t-centro { text-align: center; }
table th.t-derecha { text-align: right; }
table th.t-izquierda { text-align: left; }
table th.sin-radio { border-radius: 0; }

table tr { border-bottom: 1px solid var(--border); }
 
table tr:hover td { background: var(--hover); color: var(--negro); }

table tr:first-child { border-top:none; }
table tr:last-child { border-bottom:none; }
table tr:nth-child(odd) td { background: var(--alternate); }
table tr:nth-child(odd):hover td { background: var(--hover); }

table tr:hover td input { color: var(--negro); }
table tr:hover td input:focus { color: var(--negro); }
table tr:hover td label { color: var(--negro); }
table tr:hover td textarea { color: var(--negro); }
table tr:hover td textarea:focus { color: var(--negro); }
table tr:hover td select { color: var(--negro); }

table td a { color: var(--negro); }

table tr:hover td a { color: var(--blanco); }

table td {
	padding: 10px 8px;
	background: var(--td);
	display: left;
	font-weight: normal;
	vertical-align: middle;
	text-align: left;
	border-right: 1px solid var(--border);
	}

table td:last-child { border-right: 0px; }
table td:first-child { text-align: right; }
table td.t-centro { text-align: center; }
table td.t-derecha { text-align: right; }
table td.t-izquierda { text-align: left; }
table td.sinmargen { padding: 0px; }
table td input.sinmargen { color: var(--blanco); }

table tr td.marino { background: var(--marino); color: var(--blanco); }
table tr td.azul { background: var(--azul); color: var(--blanco); }
table tr td.cielo { background: var(--cielo); color: var(--blanco); }
table tr td.celeste { background: var(--celeste); color: var(--blanco); }
table tr td.azulclaro { background: var(--azulclaro); color: var(--negro); }
table tr td.guinda { background: var(--guinda); color: var(--blanco); }
table tr td.rojo { background: var(--rojo); color: var(--blanco); }
table tr td.rojo2 { background: var(--rojo2); color: var(--blanco); }
table tr td.rojoclaro { background: var(--rojoclaro); color: var(--negro); }
table tr td.rosa { background: var(--rosa); color: var(--blanco); }
table tr td.violeta { background: var(--violeta); color: var(--blanco); }
table tr td.rosaclaro { background: var(--rosaclaro); color: var(--negro); }
table tr td.morado { background: var(--morado); color: var(--blanco); }
table tr td.moradoclaro { background: var(--moradoclaro); color: var(--negro); }
table tr td.cafe { background: var(--cafe); color: var(--blanco); }
table tr td.cafeclaro { background: var(--cafeclaro); color: var(--negro); }
table tr td.naranja { background: var(--naranja); color: var(--blanco); }
table tr td.naranja2 { background: var(--naranja2); color: var(--blanco); }
table tr td.naranjaclaro { background: var(--naranjaclaro); color: var(--negro); }
table tr td.amarillo { background: var(--amarillo); color: var(--blanco); }
table tr td.amarillo2 { background: var(--amarillo2); color: var(--blanco); }
table tr td.amarilloclaro { background: var(--amarilloclaro); color: var(--negro); }
table tr td.verde { background: var(--verde); color: var(--blanco); }
table tr td.verde2 { background: var(--verde2); color: var(--blanco); }
table tr td.limon { background: var(--limon); color: var(--blanco); }
table tr td.verdeclaro { background: var(--verdeclaro); color: var(--negro); }
table tr td.negro { background: var(--negro); color: var(--blanco); }
table tr td.rata { background: var(--rata); color: var(--blanco); }
table tr td.gris { background: var(--gris); color: var(--blanco); }
table tr td.gris9 { background: var(--gris9); color: var(--blanco); }
table tr td.blanco { background: var(--blanco); color: var(--blanco); }

table tr:nth-child(odd) td.marino { background: var(--marino); opacity: .7; }
table tr:nth-child(odd) td.azul { background: var(--azul); opacity: .7; }
table tr:nth-child(odd) td.cielo { background: var(--cielo); opacity: .7; }
table tr:nth-child(odd) td.celeste { background: var(--celeste); opacity: .7; }
table tr:nth-child(odd) td.azulclaro { background: var(--azulclaro); opacity: .7; }
table tr:nth-child(odd) td.guinda { background: var(--guinda); opacity: .7; }
table tr:nth-child(odd) td.rojo { background: var(--rojo); opacity: .7; }
table tr:nth-child(odd) td.rojo2 { background: var(--rojo2); opacity: .7; }
table tr:nth-child(odd) td.rojoclaro { background: var(--rojoclaro); opacity: .7; }
table tr:nth-child(odd) td.rosa { background: var(--rosa); opacity: .7; }
table tr:nth-child(odd) td.violeta { background: var(--violeta); opacity: .7; }
table tr:nth-child(odd) td.rosaclaro { background: var(--rosaclaro); opacity: .7; }
table tr:nth-child(odd) td.morado { background: var(--morado); opacity: .7; }
table tr:nth-child(odd) td.moradoclaro { background: var(--moradoclaro); opacity: .7; }
table tr:nth-child(odd) td.cafe { background: var(--cafe); opacity: .7; }
table tr:nth-child(odd) td.cafeclaro { background: var(--cafeclaro); opacity: .7; }
table tr:nth-child(odd) td.naranja { background: var(--naranja); opacity: .7; }
table tr:nth-child(odd) td.naranja2 { background: var(--naranja2); opacity: .7; }
table tr:nth-child(odd) td.naranjaclaro { background: var(--naranjaclaro); opacity: .7; }
table tr:nth-child(odd) td.amarillo { background: var(--amarillo); opacity: .7; }
table tr:nth-child(odd) td.amarillo2 { background: var(--amarillo2); opacity: .7; }
table tr:nth-child(odd) td.amarilloclaro { background: var(--amarilloclaro); opacity: .7; }
table tr:nth-child(odd) td.verde { background: var(--verde); opacity: .7; }
table tr:nth-child(odd) td.verde2 { background: var(--verde2); opacity: .7; }
table tr:nth-child(odd) td.limon { background: var(--limon); opacity: .7; }
table tr:nth-child(odd) td.verdeclaro { background: var(--verdeclaro); opacity: .7; }
table tr:nth-child(odd) td.negro { background: var(--negro); opacity: .7; }
table tr:nth-child(odd) td.rata { background: var(--rata); opacity: .7; }
table tr:nth-child(odd) td.gris { background: var(--gris); opacity: .7; }
table tr:nth-child(odd) td.gris9 { background: var(--gris9); opacity: .7; }
table tr:nth-child(odd) td.blanco { background: var(--blanco); opacity: .7; }

table tr:hover td.marino { background: var(--marino); opacity: .9; }
table tr:hover td.azul { background: var(--azul); opacity: .9; }
table tr:hover td.cielo { background: var(--cielo); opacity: .9; }
table tr:hover td.celeste { background: var(--celeste); opacity: .9; }
table tr:hover td.azulclaro { background: var(--azulclaro); opacity: .9; }
table tr:hover td.guinda { background: var(--guinda); opacity: .9; }
table tr:hover td.rojo { background: var(--rojo); opacity: .9; }
table tr:hover td.rojo2 { background: var(--rojo2); opacity: .9; }
table tr:hover td.rojoclaro { background: var(--rojoclaro); opacity: .9; }
table tr:hover td.rosa { background: var(--rosa); opacity: .9; }
table tr:hover td.violeta { background: var(--violeta); opacity: .9; }
table tr:hover td.rosaclaro { background: var(--rosaclaro); opacity: .9; }
table tr:hover td.morado { background: var(--morado); opacity: .9; }
table tr:hover td.moradoclaro { background: var(--moradoclaro); opacity: .9; }
table tr:hover td.cafe { background: var(--cafe); opacity: .9; }
table tr:hover td.cafeclaro { background: var(--cafeclaro); opacity: .9; }
table tr:hover td.naranja { background: var(--naranja); opacity: .9; }
table tr:hover td.naranja2 { background: var(--naranja2); opacity: .9; }
table tr:hover td.naranjaclaro { background: var(--naranjaclaro); opacity: .9; }
table tr:hover td.amarillo { background: var(--amarillo); opacity: .9; }
table tr:hover td.amarillo2 { background: var(--amarillo2); opacity: .9; }
table tr:hover td.amarilloclaro { background: var(--amarilloclaro); opacity: .9; }
table tr:hover td.verde { background: var(--verde); opacity: .9; }
table tr:hover td.verde2 { background: var(--verde2); opacity: .9; }
table tr:hover td.limon { background: var(--limon); opacity: .9; }
table tr:hover td.verdeclaro { background: var(--verdeclaro); opacity: .9; }
table tr:hover td.negro { background: var(--negro); opacity: .9; }
table tr:hover td.rata { background: var(--rata); opacity: .9; }
table tr:hover td.gris { background: var(--gris); opacity: .9; }
table tr:hover td.gris9 { background: var(--gris9); opacity: .9; }
table tr:hover td.blanco { background: var(--blanco); opacity: .9; }

table tr:hover td.b-verdeclaro { background: var(--verdeclaro); opacity: .9; }
table tr:hover td.b-azulclaro { background: var(--azulclaro); opacity: .9; }
table tr:hover td.b-rojoclaro { background: var(--rojoclaro); opacity: .9; }

table tr:hover td a { color: var(--negro); }
table tr:hover td a.marino { color: var(--blanco); }
table tr:hover td a.azul { color: var(--blanco); }
table tr:hover td a.cielo { color: var(--blanco); }
table tr:hover td a.guinda { color: var(--blanco); }
table tr:hover td a.rojo { color: var(--blanco); }
table tr:hover td a.rosa { color: var(--blanco); }
table tr:hover td a.violeta { color: var(--blanco); }
table tr:hover td a.morado { color: var(--blanco); }
table tr:hover td a.cafe { color: var(--blanco); }
table tr:hover td a.naranja { color: var(--blanco); }
table tr:hover td a.amarillo { color: var(--blanco); }
table tr:hover td a.verde { color: var(--blanco); }
table tr:hover td a.negro { color: var(--blanco); }
table tr:hover td a.rata { color: var(--blanco); }
table tr:hover td a.gris { color: var(--blanco); }
table tr:hover td a.gris9 { color: var(--blanco); }
table tr:hover td a.blanco { color: var(--blanco); }

table td.rosaclaro a { color: var(--rojo); }

table tr.grisclaro td { background: var(--grisclaro); }
table tr.grisclaro:nth-child(odd) td { background: var(--grisclaro2); }
table tr.grisclaro:hover td { background: var(--gris); }

table tr.rojoclaro td { background: var(--rojoclaro); }
table tr.rojoclaro:nth-child(odd) td { background: var(--rojoclaro2); }
table tr.rojoclaro:hover td { background: var(--rojo); }

table tr.verdeclaro td { background: var(--verdeclaro); }
table tr.verdeclaro:nth-child(odd) td { background: var(--limon); }
table tr.verdeclaro:hover td { background: var(--verde); }

table tr.amarilloclaro td { background: var(--amarilloclaro); }
table tr.amarilloclaro:nth-child(odd) td { background: var(--amarilloclaro2); }
table tr.amarilloclaro:hover td { background: var(--amarillo); color:var(--gris); }

table tr.moradoclaro td { background: var(--verdeclaro); }
table tr.moradoclaro:nth-child(odd) td { background: var(--limon); }
table tr.moradoclaro:hover td { background: var(--verde); }

table tfoot { border-top: 4px solid var(--oscuro); }
table tfoot td { background: var(--plata); }

table tfoot tr:last-child td:first-child { border-bottom-left-radius: 8px; }
table tfoot tr:last-child td:last-child { border-bottom-right-radius: 8px; }
table tfoot tr:hover td { background: var(--plata); color: var(--gris); }
table tfoot tr:nth-child(odd) td { background: var(--plata); }
table tfoot tr:nth-child(odd):hover td { background: var(--plata); }
table tfoot tr:hover td input { color: var(--azul); }
table tfoot tr:hover td input:focus { color: var(--azul); }





