@import url("bootstrap5.3/css/bootstrap.min.css");
@import url("bootstrap-icons/font/bootstrap-icons.min.css");




/* Inicio Nuevos Estilos 2024 */

.badge a {
  text-decoration: blink;
  color: #ffffff;
}

.m01 {

  max-width: 900px !important;

  margin: 1em auto 1em auto;

  display: table;

  float: none !important;

  text-align: center;

}

.interroga {
  --bs-btn-padding-y: 0px;
  --bs-btn-padding-x: 4px;
  --bs-btn-font-size: 9px;
  --bs-btn-border-radius: var(--bs-border-radius-sm);
  border-radius: 25px;
  margin-top: 15px;
}


.m02 {

  max-width: 600px !important;

  margin: 1em auto 1em auto;

  display: table;

  float: none !important;

  text-align: center;

}



.m03 {

  max-width: 500px !important;

  margin: 1em auto 1em auto;

  display: table;

  float: none !important;

  text-align: center;

}

.marg01 {

  padding-right: 2px;

  padding-left: 2px;



}

.over01 {
  width: 100%;
  /*height: 450px;*/
  overflow: auto;
}

/* Contenedor con scroll estético reutilizable */
.scroll-premium {
  max-height: 400px;
  overflow-y: auto;
  overflow-x: hidden;
  padding-right: 5px;
}
.scroll-premium::-webkit-scrollbar {
  width: 6px;
}
.scroll-premium::-webkit-scrollbar-track {
  background: transparent;
}
.scroll-premium::-webkit-scrollbar-thumb {
  background: #cbd5e0;
  border-radius: 10px;
}
.scroll-premium::-webkit-scrollbar-thumb:hover {
  background: #a0aec0;
}



.active {
  color: #000 !important;
}



@use cssnext;



:root {

  --family1: -apple-system, BlinkMacSystemFont, 'Helvetica Neue', sans-serif;

  --family2: 'Avenir Next', 'Segoe UI', 'Lucida Grande', sans-serif;

  --yellow: #FFC842;

  --break-sm: 32rem;

  --break-md: 48rem;

}



@custom-media --only-small (width <=32rem);



* {

  margin: 0;

  padding: 0;

  box-sizing: border-box;

}

body {

  font-weight: 400;

  font-family: var(--family1);
  overflow-x: hidden;

}





td,
th {
  padding: .5rem;
}

th {
  text-align: center;
  /*font-weight: 400;*/
  font-size: .8rem;
}

td {
  /*font-family: var(--family2);
  text-align: center ;*/
}

.text-bg-secondary {
  margin: 2px 0px;
}



.table-margen {
  max-width: 1200px !important;

  margin: 1em auto 1em auto;

  display: table;

  float: none !important;

  text-align: center;

}



.table {

  width: 100%;

  padding: 1rem;

}



.table__heading {
  background: rgba(243, 243, 243, .85);
}



@media (--only-small) {

  .table__heading {
    display: none;
  }

  .table__content {

    display: block;

    padding: .5rem 0;

  }

  .table__row {

    margin: .25rem 1rem;

    padding: .5rem 0;

    display: block;

    border-bottom: 2px solid var(--yellow);

  }

  .table__content:before {

    content: attr(data-heading);

    display: inline-block;

    width: 5rem;

    margin-right: .5rem;

    color: #999;

    font-size: .75rem;

    font-weight: 700;

    font-family: var(--family1);

    text-transform: uppercase;

    letter-spacing: 2px;

  }

}



.contenido01 {

  background: #fff;

  border-radius: 8px;

  box-shadow: 0px 0px 20px #e4e4e4;

  -moz-box-shadow: 0px 0px 20px #e4e4e4;

  -webkit-box-shadow: 0px 0px 20px #e4e4e4;

}



.titulos01 {

  background: linear-gradient(to bottom, #fff 0%, #e8e8e8 100%);

  border: 1px solid #ddd !important;

  text-align: center;

  font-weight: 600;

}





/* Fin Nuevos Estilos 2024 */



.titulos {

  font-family: Verdana, Arial, Helvetica, sans-serif;

  font-size: 14px;

  font-weight: bold;

  color: #333333;

}





.boton {

  font-style: normal;

  background-color: #337ab7;

  border-color: #2e6da4;

  border: 1px solid transparent;

  color: #fff;

  padding: 1px 5px;

  border-radius: 3px;

}



.textos_destacados {

  font-family: Verdana, Arial, Helvetica, sans-serif;

  font-size: 12px;

  font-weight: bold;

  color: #999999;

}

.celda_titulo {

  font-family: Verdana, Arial, Helvetica, sans-serif;

  font-size: 12px;

  font-weight: bold;

  text-transform: capitalize;

  background-color: #CCCCCC;

  text-align: center;

  vertical-align: middle;

  color: #666666;

  border-top-style: none;

  border-right-style: none;

  border-bottom-style: none;

  border-left-style: none;

}

.Celda_form {

  color: #666666;
  background-color: #ffffff;
  padding-left: .8em;
  border: 1px solid #e1e1e1;
  border-radius: 3px;
  padding: 5px 10px;

}

.celda_casillas {

  background-color: #CCCCCC;

  text-align: center;

  padding-top: 2px;

  padding-bottom: 2px;

}





/**** MVC *****/

body {

  font-size: 14px;

  font-family: Verdana, Arial, Helvetica, sans-serif;

  margin: 0;

  padding: 0;



}

a {

  text-decoration: underline;

  color: #3399ff;

}

a:hover {

  color: #A5A5A5;

}

h1 {

  font-size: 1.4em;

}

#headlogo {
  background-color: #ffffff;
  width: 100%;
  margin: 0 auto;
  text-align: center;
  padding: 10px 0;
  border-bottom: 1px solid #e5e7eb;
}

nav#menuprinc {
  position: sticky;
  top: 0;
  z-index: 1000;
  box-shadow: 0 4px 10px rgba(0,0,0,0.1);
}

nav#menuprinc ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}

nav#menuprinc ul li {
  float: none;
}



table.estilo01 tbody {

  background: #000;
  border: 20px solid #fff0;
  border-radius: 8px;

}

table.estilo03 tbody {

  background: #000;
  border: 20px solid #fff0;
  border-radius: 8px;

}



table.estilo01,
table.estilo02 {

  max-width: 1250px;

  min-width: 370px;

  margin: 1em auto;

  /*border-collapse: collapse;*/

  /*overflow: hidden;*/

  border: 1px solid #EAEAEA;

  border-radius: 8px;

  box-shadow: 0px 0px 20px #e4e4e4;

  -webkit-box-shadow: 0px 0px 20px #e4e4e4;

}

table.estilo03 {

  width: 100%;

  margin: 1em auto;

  /*border-collapse: collapse;*/

  /*overflow: hidden;*/

  border: 1px solid #EAEAEA;

  border-radius: 8px;

  box-shadow: 0px 0px 20px #e4e4e4;

  -webkit-box-shadow: 0px 0px 20px #e4e4e4;

}

table.estilo01 tr:first-child,
table.estilo02 tr:first-child,
table.estilo03 tr:first-child {

  text-align: center;

  font-weight: bold;

  background: linear-gradient(to bottom, #fff 0%, #e8e8e8 100%);

  /*border: 1px solid #ddd !important;*/

}

table.estilo01 tr,
table.estilo02 tr,
table.estilo03 tr {

  background: #fff;

  font-size: 14px;

  text-align: left;

}

p {
  margin-top: .5rem;
  margin-bottom: .5rem;
}

table.estilo01 td,
table.estilo02 td,
table.estilo03 td {

  padding: 0em 0.5em 0.5em 0.5em;



}

.accordion-body {
  text-align: justify;
}


.row {
  margin-right: calc(0* var(--bs-gutter-x));
  margin-left: calc(0* var(--bs-gutter-x));
}


.coledit {

  width: 20%;

  text-align: center;

}





table.tareas,
table.tareaSinEnc {

  margin: 0 AUTO;

  border-collapse: separate;

  border-spacing: 2px;

}

.tareas tr:first-child {

  background: #EAEAEA !important;

}

.tareas tr:nth-child(2n+1),
.tareaSinEnc tr:nth-child(2n+1),
.estilo02 tr:nth-child(2n+1) {

  background: #F7F7F7;

}

.tareas td {}



table.tareaSinEnc {

  border: 1px solid #EAEAEA;

}

table.tareaSinEnc tr:first-child {

  text-align: inherit;

  font-weight: inherit;

  background: #F7F7F7;

}





.centrado-fila {

  text-align: center !important;

}



.texto_Alerta {

  color: #F00;

  font-weight: bold;

}



.celda_nombre {

  font-weight: bold;

}



ul.cajabuscador {

  float: left;

  min-width: 90px;

  vertical-align: top;

  list-style-type: none;

  margin: .1em;

}

ul.cajabuscador .boton {

  clear: both;

  display: block;

  margin: .5em;

}

ul.cajabuscador h1 {

  font-size: 1em;

  text-align: center;

  background-color: #ddd;

  width: 100%;

}



/*** Form ***/

form {

  clear: both;

}



#paginacion {

  font-size: 1em;

  margin: 1em auto;

  display: block;

  text-align: center;

  width: 90%;

}

#paginacion a {

  text-decoration: none;

}

#paginacion a:hover {

  color: #8bc021;

}



.black_overlay {

  display: none;

  position: absolute;

  top: 0%;

  left: 0%;

  width: 100%;

  height: 150%;

  background-color: #000000;

  z-index: 1001;

  -moz-opacity: 0.8;

  opacity: .80;

  filter: alpha(opacity=80);

}



.white_content {

  display: none;

  position: absolute;

  top: 15%;

  left: 25%;

  width: 50%;

  height: 30%;

  padding: 16px;

  border: 10px solid #FF0000;

  background-color: #FFFFFF;

  overflow: auto;

}

/* Inicio Modern Contract Cards */
body.modern-bg {
	background-color: #f7f9fc;
	font-family: 'Inter', 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
}
.modern-logo-container {
	background-color: #ffffff;
	text-align: center;
	padding: 25px 20px;
	box-shadow: 0 4px 15px rgba(0, 0, 0, 0.02);
	margin-bottom: 40px;
	border-top: 5px solid var(--emp-color, #337ab7);
}
.modern-logo-container img {
	max-height: 80px;
	width: auto;
}
.modern-card {
	background: #ffffff;
	border-radius: 16px;
	box-shadow: 0 10px 40px rgba(0, 0, 0, 0.05);
	border: 1px solid #eef1f6;
	width: 100%;
	max-width: 600px;
	margin: 0 auto 50px;
	overflow: hidden;
}
.modern-header {
	background-color: transparent;
	color: #1f2937;
	padding: 40px 30px 10px;
	text-align: center;
	font-weight: 800;
	font-size: 26px;
	letter-spacing: -0.5px;
}
.modern-subheader {
	text-align: center;
	color: #6b7280;
	font-size: 15px;
	padding: 0 40px;
	margin-bottom: 35px;
	line-height: 1.5;
}

/* --- Premium Design System --- */
.premium-body {
    background-color: #f3f4f6 !important;
}

.card-premium,
.table-premium,
.input-premium,
.btn-premium {
    font-family: 'Inter', sans-serif;
}

.card-premium {
    border: none !important;
    box-shadow: 0 2px 10px rgba(0,0,0,0.04) !important;
    border-radius: 10px !important;
    background-color: #ffffff;
    overflow: hidden;
}

.table-premium thead th {
    background-color: #f8f9fa;
    border-bottom: 2px solid #eee;
    color: #444;
    font-weight: 700;
    text-transform: uppercase;
    font-size: 0.9rem;
    padding: 10px 15px !important;
}

.table-premium td {
    vertical-align: middle;
    padding: 5px 15px !important;
    font-size: 1rem;
    border-bottom: 1px solid #f3f4f6;
    background-color: #fff;
}

.table-premium .folder-row td {
    background-color: #f9fafb !important;
}

.table-premium .category-row:hover td {
    background-color: #fcfcfc;
}

.action-link, .btn-link-action {
    text-decoration: none !important;
    display: inline-flex;
    padding: 2px 6px;
    border-radius: 6px;
    transition: all 0.2s;
    font-size: 0.7rem;
}

.btn-link-action:hover {
    background-color: #f3f4f6;
}

.detail-link {
    text-decoration: none;
    color: #0d6efd;
    transition: all 0.2s;
}

.detail-link:hover {
    text-decoration: underline;
    opacity: 0.8;
}

.text-monto-positivo { color: #198754; font-weight: 600; }
.text-monto-negativo { color: #dc3545; font-weight: 600; }
.sticky-top-custom { position: sticky; top: 1rem; z-index: 100; }

.input-premium {
    border-radius: 12px !important;
    border: 1px solid #e5e7eb !important;
    padding: 12px 18px !important;
    font-size: 0.95rem !important;
    transition: all 0.2s !important;
}

.btn-premium {
    border-radius: 12px !important;
    font-weight: 600 !important;
    padding: 12px 32px !important;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1) !important;
    transition: all 0.2s !important;
    border: none;
}

.btn-premium:hover {
    transform: translateY(-1px) !important;
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1) !important;
}

.folder-icon-svg {
    margin-right: 12px;
}

.badge-premium {
    font-size: 0.75rem !important;
    padding: 6px 12px !important;
    border-radius: 8px !important;
    font-weight: 600 !important;
}

.modern-body {
	padding: 0 45px 45px;
}
.modern-form-group {
	margin-bottom: 25px;
	text-align: left;
}
.modern-form-label {
	display: block;
	font-weight: 600;
	margin-bottom: 10px;
	color: #374151;
	font-size: 15px;
}
/* Mantener compatibilidad con inputs existentes en la interfaz moderna */
.modern-card .Celda_form {
	border: 1px solid #d1d5db;
	border-radius: 8px;
	padding: 15px 18px;
	width: 100%;
	font-size: 16px;
	color: #1f2937;
	background-color: #f9fafb;
	transition: all 0.2s;
	box-sizing: border-box;
}
.modern-card .Celda_form:focus {
	border-color: var(--emp-color, #337ab7);
	background-color: #ffffff;
	box-shadow: 0 0 0 3px rgba(51, 122, 183, 0.15);
	outline: none;
}
.modern-card .boton {
	background-color: var(--emp-color, #337ab7);
	color: #fff;
	border: none;
	border-radius: 8px;
	padding: 16px 24px;
	font-size: 18px;
	font-weight: 700;
	width: 100%;
	cursor: pointer;
	letter-spacing: 0.5px;
	transition: transform 0.1s, opacity 0.2s, box-shadow 0.2s;
	box-sizing: border-box;
	box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
}
.modern-card .boton:active {
	transform: scale(0.98);
}
.modern-card .boton:hover {
	opacity: 0.9;
	box-shadow: 0 6px 15px rgba(0, 0, 0, 0.15);
}
/* Fin Modern Contract Cards */

.premium-footer {
    background-color: #ffffff;
    border-top: 1px solid #e5e7eb;
    padding: 20px 0;
    margin-top: 50px;
    width: 100%;
}

.premium-footer-content {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 15px;
    padding-right: 50px;
    font-size: 0.85rem;
    color: #6b7280;
    font-family: 'Inter', sans-serif;
}

/* Botón actualizar animación */
@keyframes spin-clockwise {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}
.btn-actualizar .bi-arrow-clockwise {
    display: inline-block !important;
    transition: transform 0.3s ease !important;
}
.btn-actualizar:not(.loading):hover .bi-arrow-clockwise {
    transform: rotate(180deg) !important;
}
.btn-actualizar.loading .bi-arrow-clockwise {
    animation: spin-clockwise 1s linear infinite !important;
}

/* Responsividad para Cartola Banco */
@media (max-width: 991.98px) {
    .border-mobile-none {
        border-left: none !important;
        border-right: none !important;
        border-top: 1px dashed #dee2e6 !important;
        border-bottom: 1px dashed #dee2e6 !important;
        padding-top: 15px !important;
        padding-bottom: 15px !important;
    }
}

@media (max-width: 767.98px) {
    .table-sm-mobile th,
    .table-sm-mobile td {
        padding: 8px 4px !important;
        font-size: 0.8rem !important;
    }
    .table-sm-mobile th {
        font-size: 0.75rem !important;
    }
    .table-sm-mobile .badge {
        font-size: 0.7rem !important;
        padding: 3px 6px !important;
    }
}

.fs-7 {
	font-size: 0.85rem !important;
	line-height: 1.45 !important;
}

/* Contenedor adaptativo para la tabla de agenda */
.agenda-table-container {
  max-height: max(300px, calc(100vh - 520px));
  overflow-y: auto;
  overflow-x: hidden;
  padding-right: 5px;
}
.agenda-table-container::-webkit-scrollbar {
  width: 6px;
}
.agenda-table-container::-webkit-scrollbar-track {
  background: transparent;
}
.agenda-table-container::-webkit-scrollbar-thumb {
  background: #cbd5e0;
  border-radius: 10px;
}
.agenda-table-container::-webkit-scrollbar-thumb:hover {
  background: #a0aec0;
}