@charset "UTF-8";
/*
  Nuevos estilos ESPASEM conversando con BOOTSTRAP para Aplicaciones
  ( para ser estandarizado en todas las aplicaciones )
  Archivo Base en WebNuevo
   *** >> última actualización 03/07/2025 << ***
*/

/* 
  Colores ESPASEMSAC (Logo)

  Rojo   : #B22D30 rgb(178,  45, 48)    LOGO Rojo
  Dorado : #D3AC4D rgb(211, 172, 77)    LOGO Dorado
  Azul   : #064B75 rgb(  6,  75, 117)   LOGO Azul 

  Colores Controles

  Azul    : #000066   Azul ESPASEMSAC       rgb(1,0,102)
  Naranja : #FF6600   Naranja ESPASEMSAC    rgb(255,102,0)
  Rojo    : #AF2D30   Rojo ESPASEMSAC       
  Plomo   : #808080   Plomo ESPASEMSAC      rgb(128,128,128)
  Dorado  : #CC9900   Dorado ESPASEMSAC     rgb(204, 153, 0)

  Variaciones

  Azul 01 : #F1F1FF
  Azul 02 : #E5E5FF
  Azul 03 : #D7D7FF
  Azul 04 : #CBCBFF
  Azul 05 : #BFBFFF
  Azul 06 : #B1B1FF
  Azul 07 : #A5A5FF
  Azul 08 : #9797FF
  Azul 09 : #8B8BFF
  Azul 10 : #7F7FFF
  Azul 12 : #6566ff
  Azul 15 : #3f3fff

  Plomo 05  : #F0F0F0
  Plomo 10  : #E6E6E6
  Plomo 15  : #DDDDDD
  Plomo 20  : #CCCCCC
  Plomo 30  : #B3B3B3
  Plomo 40  : #999999
  Plomo 50  : #808080

  Naranja 01  : #FFF6F1
  Naranja 02  : #FFEEE5
  Naranja 03  : #FFE6D7
  Naranja 04  : #FFDECB
  Naranja 05  : #FFD7BF
  Naranja 10  : #FFB07F
  Naranja 15  : #FE883E   rgb(254,136,62)
  
  Dorado 01 : #FFFBF1
  Dorado 02 : #FFF8E5
  Dorado 03 : #FFF4D7
  Dorado 04 : #FFF1CB
  Dorado 05 : #FFEDBF
  Dorado 10 : #FFDC7F

  Colores para Reportes

  Naranja : #FF6600   Naranja ESPASEMSAC -- Resaltar datos Muy intenso
  
  
  Rojo    : #ec1c24  -- Resaltar datos intenso
  Rojo    : #ffacaf  -- Resaltar datos
  Rojo    : #ffd0d1  -- Resaltar linea
  Rojo    : #eecfbe  -- Fondo Rojo
  
  Naranja : #FE883E  -- Resaltar datos intenso
  Naranja : #FFB07F  -- Resaltar datos
  Naranja : #FFD7BF  -- Resaltar linea

  Verde   : #008000  -- Resaltar datos intenso
  Verde   : #b6ffb6  -- Resaltar linea
  Verde   : #b6ffb6  -- Resaltar linea


  Color anterior de cabeceras
  #5D7B9D
*/


:root {
  /* No se pueden ver en el Visual Studio, solo los muestra en ejecución */
  --bs-espasem-azul: #000066; /* Azul ESPASEMSAC */
  --bs-espasem-Naranja: #FF6600; /* Naranja ESPASEMSAC */
  --bs-espasem-rojo: #AF2D30; /* Rojo ESPASEMSAC */
  --bs-espasem-plomo: #808080; /* Plomo ESPASEMSAC */
  --bs-espasem-dorado: #CC9900; /* Dorado ESPASEMSAC */


  --bs-espasem-azul-05: #BFBFFF; /* Azul 05 ESPASEMSAC */
  --bs-espasem-azul-10: #7F7FFF; /* Azul 10 ESPASEMSAC */
  --bs-espasem-azul-15: #3f3fff; /* Azul 15 ESPASEMSAC */

  --bs-espasem-Naranja-03: #FFE6D7; /* Naranja 03 ESPASEMSAC */
  --bs-espasem-Naranja-05: #FFD7BF; /* Naranja 05 ESPASEMSAC */
  --bs-espasem-Naranja-10: #FFB07F; /* Naranja 10 ESPASEMSAC */
  --bs-espasem-Naranja-15: #FE883E; /* Naranja 15 ESPASEMSAC */

  --bs-espasem-dorado-04: #FFF1CB; /* Dorado 04 ESPASEMSAC */
  --bs-espasem-dorado-05: #FFEDBF; /* Dorado 05 ESPASEMSAC */
  --bs-espasem-dorado-10: #FFDC7F; /* Dorado 10 ESPASEMSAC */
  /*--bs-body-font-size: 1rem;*/
}

html {
  font-family: Arial, Helvetica, sans-serif;
  /**/
  /*font-size: 12px;*/ /* Nuevo  20/10/2023*/
  font-size: 0.8rem; /* 16px tamaño comunmente definido por los navegadores (0.8rem se acerca a los 12px que uso) */
}

body {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 1rem;
  line-height: 1.5;
  /**/
}

* {
  box-sizing: border-box;
}

.espfont-size {
  font-size: 0.8rem !important;
}

/* LOGIN */

.espEtiquetaLogin {
  font-size: 12px;
  font-style: italic;
  color: #000066 !important; /* Azul ESPASEMSAC */
  /*padding-top: 18px;*/
  display: inline-block;
  width: 80px; /* ancho fijo para alinear */
  margin-right: 2px; /* espacio entre label y textbox */
  text-align: right; /* alineación del texto en el label */
  /**/
  padding: 2px;
  margin: 5px 0px;
  /*border: 1px solid red;*/
}

.espTextBoxLogin {
  text-align: center;
  display: inline-block;
  width: 120px;
  padding: 2px;
  margin: 4px 0px;
  /*height: 90%;*/
  /**/
  /*border: 1px solid blue;*/
  box-sizing: border-box; /* evita que padding altere el ancho */
}


/* Etiquetas */
.espEtiquetaAplicacion {
  /*font-size: 22px;*/
  font-size: 1.7rem;
  font-style: italic;
  color: #000066; /* Azul ESPASEM*/
  /**/
}

.espEtiqueta,
.espEtiquetaCentrada {
  font-size: 0.9rem;
  text-align: right;
  padding: 2px 1px;
  margin: 0px 1px 0px 0px;
  border-collapse: collapse;
}

.espEtiquetaCentrada {
  text-align: center;
  /* Cambios */
  /*border: 1px solid fuchsia;*/
}

.espEtiquetaTitulo {
  font-size: 1.5rem;
  font-style: italic;
  text-decoration: underline;
  color: #000066; /* Azul ESPASEMSAC */
  /**/
}

.espEtiquetaSubTitulo {
  font-size: 1.2rem;
  font-style: italic;
  text-decoration: underline;
  color: #000066; /* Azul ESPASEMSAC */
  /**/
}

.espEtiquetaPie {
  font-style: italic;
  font-size: 1.1rem;
  color: #E5E5FF !important; /* Azul 02*/
  padding-left: 5px;
}


.espEtiquetaMensajes {
  text-align: left;
  color: #AF2D30; /* Rojo ESPASEMSAC */
}
  .espEtiquetaMensajes:empty {
    /*display: none;*/
  }
  .espEtiquetaMensajes:not(:empty) {
    padding: 2px 10px;
  }

.espEtiquetaAvisoGrandeVerde {
  font-size: 14px;
  font-weight: normal;
  color: #008080;
  text-decoration: underline;
}


/* Textos (Formato) */

.text-espAzul {
  color: #000066 !important; /* Azul ESPASEMSAC */
}

.text-espRojo {
  color: #AF2D30 !important; /* Rojo ESPASEMSAC */
}

.text-espNaranja {
  color: #FF6600 !important; /* Naranja ESPASEMSAC */
}

.text-espPlomo {
  color: #808080 !important; /* Plomo ESPASEMSAC */
}

.text-espMagenta {
  color: #920092 !important; /* Magenta */
}

.text-espBlanco {
  color: white !important; /* Blanco*/
}

.text-espHide {
  font: 0/0 a;
  color: transparent;
  text-shadow: none;
  background-color: transparent;
  border: 0;
}

/* Fondos */
.bg-espFondo {
  background-color: #f8f9fa !important; /* Fondo de toda la Aplicación */
}

.bg-espAzul {
  background-color: #000066 !important; /* Azul ESPASEMSAC */
  color: white !important;
}

.bg-espAzul-05 {
  background-color: #BFBFFF !important; /* Azul ESPASEMSAC */
  color: white !important;
}

.bg-espAzul-10 {
  background-color: #7F7FFF !important; /* Azul ESPASEMSAC */
  color: white !important;
}

.bg-espAzul-15 {
  background-color: #3f3fff !important; /* Azul ESPASEMSAC */
  color: white !important;
}


.bg-espRojo {
  background-color: #AF2D30 !important; /* Rojo ESPASEMSAC */
  color: white !important;
}

.bg-espRojo-10 {
  background-color: #ec1c24 !important; /* Rojo ESPASEMSAC */
  color: white !important;
}

.bg-espNaranja {
  background-color: #ff6600 !important; /* Naranja ESPASEMSAC */
  /*color: white !important;*/
  color: #E5E5FF !important; /* Azul 02*/
}

.bg-espNaranja-05 {
  background-color: #FFD7BF !important; /* Naranja 05 ESPASEMSAC */
  color: white !important;
}

.bg-espNaranja-10 {
  background-color: #FFB07F !important; /* Naranja 10 ESPASEMSAC */
  color: white !important;
}

.bg-espNaranja-15 {
  background-color: #FE883E !important; /* Naranja 15 ESPASEMSAC */
  color: white !important;
}


.bg-espPlomo {
  background-color: #808080 !important; /* Plomo ESPASEMSAC */
  color: white !important;
}

.bg-espPlomo-15 {
  background-color: #DDDDDD !important; /* Plomo 15 ESPASEMSAC */
  color: white !important;
}

.bg-espPlomo-20 {
  background-color: #CCCCCC !important; /* Plomo 20 ESPASEMSAC */
  color: white !important;
}

.bg-espPlomo-30 {
  background-color: #B3B3B3 !important; /* Plomo 30 ESPASEMSAC */
  color: white !important;
}

.bg-espDorado {
  background-color: #CC9900 !important; /* Dorado ESPASEMSAC */
  color: white !important;
}

.bg-espDorado-10 {
  background-color: #FFDC7F !important; /* Dorado ESPASEMSAC */
  color: black !important;
}

.bg-espNegro {
  background-color: black !important; /* Negro */
  color: white !important;
}

.espLinea {
  font-family: Arial, sans-serif;
  background-color: #122372;
  padding: 0.4px;
  margin: 0.4px;
  height: -15px;
}

/* * Tabla * */

.espTabla {
  font-family: inherit;
  font-size: 0.9rem;
  font-size: 12px; /* Nuevo 20/10/2023*/
  margin: 0px;
  padding: 0px;
  border-collapse: collapse; /* colapsa bordes solo en Tablas */
  /*width: 100%;*/
  table-layout: fixed;
}

/* Tabla - Filas (tr) */

.espTabla_filaHide {
  font-size: 0.01em; /* tamaño relativo al fuente, es un % del padre */
  box-sizing: border-box;
  visibility: collapse;
  visibility: hidden;
  /*display: none;*/ /* No usar, esto malogra toda la visualización*/
}

.espTabla_filaTitulo {
  border-bottom: 1px solid var(--bs-espasem-azul);
}

/* Tabla - Columnas (Celdas td) */
.espTabla_colEspera,
.espTabla_colTitulo,
.espTabla_colCabecera,
.espTabla_colFiltro,
.espTabla_colDatos,
.espTabla_colTabla,
.espTabla_colOpciones,
.espTabla_colOpcionesReporte,
.espTabla_colReporte,
.espTabla_colMensajes,
.espTabla_colValida {
  /*font-size: 12px;*/
  font-size: 0.9rem;
  margin: 0px;
  padding: 0px;
  border: none;
  /**/
  border-collapse: collapse;
}

.espTabla_colEspera {
  text-align: center;
  /*width: 1.8rem;*/
  width: 30px;
}

.espTabla_colTitulo {
  text-align: left;
}

.espTabla_colCabecera,
.espTabla_colFiltro,
.espTabla_colDatos {
  /*padding: 3px 0px;*/
  padding-bottom: 6px;
  border-bottom-width: thin;
  border-bottom-style: solid;
  border-bottom-color: var(--bs-espasem-azul); /* Azul EspAsEmSac */
}

.espTabla_colTabla {
  text-align: center;
  vertical-align: top;
  padding-bottom: 5px;
  border-top: thin solid #000066; /* Azul EspAsEmSac */
  border-bottom: thin solid #000066; /* Azul EspAsEmSac */
}

.espTabla_colOpciones,
.espTabla_colOpcionesReporte {
  font-size: 12px;
  font-size: 0.9rem;
  text-align: center;
  vertical-align: middle;
  padding: 5px 1px 4px;
}

.espTabla_colOpcionesReporte {
  text-align: left;
  border-top: solid;
  border-top-width: thin;
  border-top-color: #000066; /* Azul EspAsEmSac */
  padding-left: 20px;
}

.espTabla_colReporte {
  padding: 0px;
}

.espTabla_colMensajes {
  text-align: left;
  color: #AF2D30; /* Rojo ESPASEMSAC */
  background-color: #f1dada; /* Rojo personalizado */
  border-radius: 4px;
}

.espTabla_colValida {
  text-align: left;
}

.espTabla_colDerecha,
.espTabla_colIzquierda,
.espTabla_colIzquierdaTitulo,
.espTabla_colCentrada,
.espTabla_colBoton {
  /*font-size: 12px;*/
  font-size: 0.9rem;
  margin: 0px;
  padding: 1px 0px;
  border: none;
  vertical-align: middle;
  border-collapse: collapse;
  /**/
}

.espTabla_colCentrada {
  text-align: center;
}

.espTabla_colDerecha {
  text-align: right;
}

.espTabla_colIzquierda,
.espTabla_colIzquierdaTitulo {
  text-align: left;
}

.espTabla_colBoton {
  text-align: left;
  padding-left: 4px;
}

/* Controles */
.controlBoton,
.controlBotonTresPuntos {
  /*font-size: 12px;*/
  font-size: 0.9rem;
  background-color: #CCCCCC; /* Plomo 20 */
  color: #000066; /* Azul ESPASEMSAC */
  text-align: center;
  white-space: nowrap;
  margin: 2px 1px;
  padding: 2px 4px;
  border: 1px solid #808080; /* Plomo 50 */
  border-radius: 3px;
  line-height: 150%;
  /* CAMBIOS */
  --bs-btn-color: #000066; /* Azul */
  --bs-btn-bg: #CCCCCC; /* Plomo 20 */
  --bs-btn-border-color: #064B76; /* Azul EspAsEmSac */

  --bs-btn-hover-color: #fff; /* Blanco */
  --bs-btn-hover-bg: #064B76; /* Azul EspAsEmSac */
  --bs-btn-hover-border-color: #CCCCCC; /* Plomo 20 */


  --bs-btn-active-color: #fff; /* Blanco */
  --bs-btn-active-bg: #064B76; /* Azul EspAsEmSac */
  --bs-btn-active-border-color: #0a53be;
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: #fff; /* Blanco */
  --bs-btn-disabled-bg: #CCCCCC; /* Plomo 20 */
  --bs-btn-disabled-border-color: #064B76; /* Azul EspAsEmSac */
}

.controlBotonTresPuntos {
  background-image: url(../Imagenes/card-list.svg);
  background-repeat: no-repeat;
  background-position: center;
  padding: 0px 4px;
  padding-left: 12px;
  color: transparent; /* Oculta los tres puntos ... */
  width: 26px;
}

.controlBoton:hover {
  cursor: pointer;
  background-color: #000066; /* Azul Marino Oscuro */
  color: #FFFFFF; /* Plomo 0 */
}

.controlBotonTresPuntos:hover {
  cursor: pointer;
  background-color: #7F7FFF;
}

.controlBoton:active,
.controlBotonTresPuntos:active {
  transform: scale(0.9);
}

.controlBoton:disabled,
.controlBotonTresPuntos:disabled {
  cursor: not-allowed;
  color: #3f3fff; /* Azul 15 */
  background-color: #D7D7FF; /* Azul 03 */
}


/* Panel */

.controlPanel {
  font-size: 0.9rem;
  border-collapse: collapse;
  border: 1px solid #FF6600; /*Naranja ESPASEMSAC*/
  border-radius: 4px;
  box-shadow: 0 1px 3px rgba(75, 75, 255, 0.1);
  margin: 0px;
  margin-bottom: 1px;
  padding: 2px;
  padding-bottom: 6px;
  background: linear-gradient(135deg, rgba(75, 75, 255, 0.05) 0%, rgba(75, 75, 255, 0.1) 100%);
  width: 100%;
  transition: all 0.2s ease;
}

  .controlPanel:hover {
    border-color: #4B4BFF;
    box-shadow: 0 2px 6px rgba(75, 75, 255, 0.15);
  }
  /* Estilo para el legend (GroupingText) */
  .controlPanel fieldset {
    border: none;
    /*border: 1px solid red;*/
    margin: 0;
    padding: 0;
  }

  .controlPanel legend {
    /*font-size: 9pt;*/
    font-size: 1rem;
    font-weight: bold;
    font-style: italic;
    text-decoration: underline;
    color: #000066; /* Azul ESPASEMSAC */
    padding: 0 4px;
  }


.controlTextBox,
.controlTextBox_Alerta,
.controlTextBox_Centrado,
.controlTextBox_Filtro,
.controlTextBox_Filtro15,
.controlTextBox_Filtro20,
.controlTextBox_Numero,
.controlTextBox_NumeroCorto,
.controlTextBox_NumeroLargo {
  font-family: inherit;
  /*font-size: 12px;*/
  font-size: 0.9rem;
  text-align: left;
  padding: 1px 2px;
  margin: 0px;
  margin-left: 2px;
  border-width: 1px;
  border-style: solid;
  border-color: rgba(128, 128, 128, 0.4);
  vertical-align: middle;
}

.controlTextBox_Alerta {
  color: red;
  font-weight: bold;
  background-color: white;
}

.controlTextBox_Centrado {
  text-align: center;
}

.controlTextBox_Filtro {
  width: 140px;
  padding-left: 4px;
}

.controlTextBox_Filtro15 {
  width: 120px;
  padding-left: 4px;
}

.controlTextBox_Filtro20 {
  width: 160px;
  padding-left: 4px;
}

.controlTextBox_Numero,
.controlTextBox_NumeroCorto,
.controlTextBox_NumeroLargo {
  text-align: right;
  width: 75px;
  padding-right: 2px;
}

.controlTextBox_NumeroCorto {
  width: 65px;
}

.controlTextBox_NumeroLargo {
  width: 85px;
}

  .controlTextBox:disabled,
  .controlTextBox_Alerta:disabled,
  .controlTextBox_Centrado:disabled,
  .controlTextBox_Filtro:disabled,
  .controlTextBox_Filtro15:disabled,
  .controlTextBox_Filtro20:disabled,
  .controlTextBox_Numero:disabled,
  .controlTextBox_NumeroCorto:disabled,
  .controlTextBox_NumeroLargo:disabled {
    background-color: var(--bs-espasem-Naranja-03); /* Naranja 03 */
  }

  .controlTextBox:placeholder-shown,
  .controlTextBox_Alerta:placeholder-shown,
  .controlTextBox_Centrado:placeholder-shown,
  .controlTextBox_Filtro:placeholder-shown,
  .controlTextBox_Numero:placeholder-shown,
  .controlTextBox_NumeroCorto:placeholder-shown,
  .controlTextBox_NumeroLargo:placeholder-shown {
    color: var(--bs-espasem-Naranja);
  }

  .controlTextBox:not(:placeholder-shown),
  .controlTextBox_Alerta:not(:placeholder-shown),
  .controlTextBox_Centrado:not(:placeholder-shown),
  .controlTextBox_Filtro:not(:placeholder-shown),
  .controlTextBox_Numero:not(:placeholder-shown),
  .controlTextBox_NumeroCorto:not(:placeholder-shown),
  .controlTextBox_NumeroLargo:not(:placeholder-shown) {
    color: black;
  }

.controlRadioButton,
.controlCheckBox {
  padding: 2px 4px;
  margin: 0px;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  line-height: 80%;
  /**/
}

  /* Espacio entre el radiobutton o checkbox y el texto */
  .controlRadioButton input[type="radio"],
  .controlCheckBox input[type="checkbox"] {
    margin-right: 4px; /* espacio entre radiobutton y texto */
    margin-left: 4px; /* espacio entre radiobutton y texto */
  }

  .controlRadioButton label {
    margin-right: 3px; /* espacio entre cada radio item */
    display: inline-flex;
    align-items: center;
    cursor: pointer;
  }

  /* Espaciado entre cada ListItem */
  .controlCheckBox td {
    padding-right: 6px; /* espacio entre los ítems */
  }


.controlDropDownList,
.controlDropDownList_Año,
.controlDropDownList_Periodo {
  /*font-size: 12px;*/
  text-align: left;
  padding: 2px;
  margin: 0px;
  border-width: 1px;
  border-style: solid;
  border-color: rgba(128, 128, 128, 0.4);
  vertical-align: middle;
  border-radius: 3px;
}

.controlDropDownList_Año {
  width: 60px;
  text-align: center;
}

.controlDropDownList_Periodo {
  width: 120px;
}

.controlReporte {
  border-width: 2px;
  border-style: none;
  background-color: white;
  width: 100%;
  height: 100%;
}



/* -------------------------- */
/* *** Control - GridView *** */
/* -------------------------- */
.controlGridView {
  font-family: inherit;
  font-size: 0.9rem;
  font-weight: normal;
  color: #333333; /* Plomo 80 (#333333) */
  background-color: #CCCCCC; /* Plomo 20  : #CCCCCC */
  /* Cambios */
  border-collapse: collapse;
}

  .controlGridView a {
    /* estilo del paginador */
    color: white;
    text-decoration: underline;
  }


.controlGridView_HeaderStyle {
  font-weight: normal;
  text-align: center;
  color: white;
  background-color: #6c757d; /* Bootstrap gray-600 */
  border-right: 1px solid white !important; /* Separador vertical */
  padding: 4px 2px;
}

  .controlGridView_HeaderStyle th {
    border-right: 1px solid #dee2e6; /* Separador vertical */
  }

.controlGridView_PagerStyle {
  margin: 0px;
  padding: 0px;
  color: white;
  background-color: #6c757d; /* Bootstrap gray-600 */
}

  .controlGridView_PagerStyle a {
    /*color: #ffc107;*/ /* Amarillo Bootstrap para contraste */
    color: white;
    text-decoration: none;
    padding: 4px 6px;
    margin: 0 2px;
    border-radius: 4px;
    font-weight: bold;
  }

    .controlGridView_PagerStyle a:hover {
      color: white;
      background-color: #495057; /* más oscuro al pasar el mouse */
      padding: 4px 6px;
      text-decoration: none;
    }

  .controlGridView_PagerStyle span {
    color: white;
    background-color: #495057;
    padding: 4px 6px;
    margin: 0 2px;
    border-radius: 4px;
    font-weight: bold;
  }


/* Filas por Tipo de Mensaje ( controlGridView_fila ) */

.controlGridView_filaSeleccionada {
  background-color: #FE883E; /* Naranja 15 */
  color: white;
}

.controlGridView_filaSeleccionUno {
  background-color: #7F7FFF; /* Azul 10 ESPASEMSAC */
  color: white;
  color: #D7D7FF;
}

.controlGridView_filaSeleccionDos {
  background-color: #3f3fff; /* Azul 15 */
  color: white;
}

.controlGridView_filaSeleccionTres {
  background-color: #00bb00; /* Verde - Resaltar datos intenso*/
  color: white;
}

.controlGridView_filaCorrecto {
  background-color: #008000; /* Verde - Resaltar datos intenso*/
  color: white;
}

.controlGridView_filaInactivo {
  background-color: #ec1c24; /* Rojo - Resaltar datos intenso*/
  background-color: #fc4c53; /* Rojo personalizado */
  color: white;
}

.controlGridView_filaError {
  background-color: #ec1c24; /* Rojo - Resaltar datos intenso*/
  color: white;
}

.controlGridView_filaAlerta {
  background-color: #CC9900; /* Dorado */
  color: white;
}

.controlGridView_filaInformacion {
  background-color: #FFDC7F; /* Dorado 10 */
  /*color: white;*/
}

  .controlGridView_filaSeleccionada td,
  .controlGridView_filaSeleccionUno td,
  .controlGridView_filaSeleccionDos td,
  .controlGridView_filaSeleccionTres td,
  .controlGridView_filaCorrecto td,
  .controlGridView_filaInactivo td,
  .controlGridView_filaError td,
  .controlGridView_filaAlerta td,
  .controlGridView_filaInformacion td {
    border-right: 1px solid #dee2e6; /* Separador vertical */
    border-top: 1px solid #CCCCCC;
  }

/* AQUi VA : .controlGridView_filaSeleccionada */

.controlGridView_celdaNaranja {
  background-color: #ff6600 !important; /* Naranja ESPASEMSAC */
  color: white !important;
  border-top: 1px solid #CCCCCC;
}

.controlGridView_celdaRojo {
  background-color: #AF2D30 !important; /* Rojo ESPASEMSAC */
  color: white !important;
  border-top: 1px solid #CCCCCC;
}

.controlGridView_celdaDorado {
  background-color: #CC9900 !important; /* Dorado ESPASEMSAC */
  color: white !important;
  border-top: 1px solid #CCCCCC;
}

.controlGridView_celdaAzul {
  background-color: #000066 !important; /* Azul ESPASEMSAC */
  color: white !important;
  border-top: 1px solid #CCCCCC;
}



.controlGridView_RowStyle,
.controlGridView_AlternatingRowStyle {
  vertical-align: middle;
  padding: 1px 2px;
  margin: 0px;
  border-top: 1px solid #CCCCCC !important;
}

  .controlGridView_RowStyle td {
    border-right: 1px solid #dee2e6; /* Separador vertical */
    border-top: 1px solid #CCCCCC !important;
    vertical-align: middle;
    padding: 1px 2px;
    margin: 0px;
  }

  .controlGridView_RowStyle:hover,
  .controlGridView_AlternatingRowStyle:hover {
    background-color: #FFB07F; /* Naranja 10 */
    color: black;
  }

.controlGridView_AlternatingRowStyle {
  background-color: #ffffff;
}

  .controlGridView_AlternatingRowStyle td {
    border-right: 1px solid #dee2e6; /* Separador vertical */
    border-top: 1px solid #CCCCCC !important;
    padding: 1px 2px;
    vertical-align: middle;
    margin: 0px;
  }


.controlGridView_SelectedRowStyle {
  color: white;
  background-color: #7F7FFF !important; /* Azul 10 */
}

  .controlGridView_SelectedRowStyle td {
    border-right: 1px solid #CCCCCC; /* Separador vertical */
    border-top: 1px solid #CCCCCC !important;
    padding: 1px 2px;
    vertical-align: middle;
    margin: 0px;
  }

.controlGridView_EmptyDataRowStyle {
  font-size: 1rem;
  /*background-color: #f8d7da;*/
  color: #41464b; /* gris oscuro */
  text-align: center;
}


/* GridView (Dataset) - Filas */

.controlGridView_filaSel,
.controlGridView_filaCentrada,
.controlGridView_filaCodigo,
.controlGridView_filaDescripcion,
.controlGridView_filaImporte,
.controlGridView_filaFecha,
.controlGridView_filaCheckBox {
  text-align: center;
  border: none;
  padding: 1px;
  margin: 0px;
}

.controlGridView_filaSel {
  /*font-size: 12px;*/
  display: block;
  background-color: #808080; /* Plomo */
  color: white;
  padding: 2px 4px;
  margin: 0px 1px;
  border-radius: 3px;
  width: 32px;
}

  .controlGridView_filaSel:hover {
    cursor: pointer;
    background-color: #000066; /* Azul Marino Oscuro */
  }

  .controlGridView_filaSel:active {
    transform: scale(0.9);
  }

  .controlGridView_filaSel td {
    border-right: 1px solid #dee2e6; /* Separador vertical */
    border-top: 1px solid #CCCCCC !important;
    padding: 1px 1px;
    vertical-align: middle;
    margin: 0px;
  }


.controlGridView_filaCentrada {
  text-align: center;
}

.controlGridView_filaCodigo {
  text-align: center;
}

.controlGridView_filaDescripcion {
  text-align: left;
  padding-left: 2px;
}

.controlGridView_filaImporte {
  text-align: right;
  padding-right: 2px;
}

.controlGridView_filaFecha {
  text-align: center;
  width: 70px;
}

.controlGridView_filaCheckBox {
  text-align: center;
  width: 28px;
}

.controlGridView_controlCheckBox {
  display: block;
  padding: 0px;
  margin: 0px;
  width: 100%;
  text-align: center;
}




/* * ==> COMPLEMENTOS (revisar si aun sirven 2025-05-13) <== * */

/* padding ( Bootstrap v5.1.2 (https://getbootstrap.com/) ) */

/* */


/* Configuración del Menu de Opciones */
.esp-StaticSelectedStyle {
  color: #507CD1;
}

.esp-StaticMenuItemStyle {
  border: 1px solid red;
}

.esp-DynamicSelectedStyle {
  background-color: var(--bs-espasem-rojo);
}

.esp-StaticHoverStyle {
  background-color: var(--bs-espasem-rojo);
  background-color: #AF2D30;
}

/* ----------------------------------------- */
/* > > * * ADAPTACIONES AL BOOTSTRAP * * < < */
/* ----------------------------------------- */
/*.navbar-brand {
  font-size: 2.5rem;
  padding-top: 0.3rem;
  padding-bottom: 0.2rem;*/

/*font-size:12px;*/
/*}*/

.navbar {
  --bs-navbar-color: white;
  padding: 2px;
}

.nav-link {
  /*background-color: var(--bs-espasem-dorado);*/
  /*background-color: var(--bs-espasem-Naranja);*/
  /*border-radius: 4px;*/
  padding: 2px;
}

  .nav-link:hover, .nav-link:focus {
    background-color: var(--bs-espasem-rojo);
  }

.dropdown-item {
  background-color: black;
  color: white;
}

  .dropdown-item:hover, .dropdown-item:focus {
    color: white;
    background-color: var(--bs-espasem-rojo);
  }

/* *** INICIO - manejo de submenu *** */
/* Estilos CSS necesarios para soportar menús de múltiples niveles */

.dropdown-menu {
  background-color: black;
}

/* Estilos base para los submenús anidados */
.dropdown-submenu {
  position: relative;
}

  /* Flecha para indicar que hay un submenú */
  .dropdown-submenu > .dropdown-item.dropdown-toggle::after {
    display: inline-block;
    margin-left: 0.255em;
    vertical-align: 0.255em;
    content: "";
    border-top: 0.3em solid transparent;
    border-right: 0;
    border-bottom: 0.3em solid transparent;
    border-left: 0.3em solid;
  }

  /* Posicionamiento de submenús nivel 2 y superior */
  .dropdown-submenu > .dropdown-menu {
    top: 0;
    left: 100%;
    /*margin-top: -0.5rem;*/
    margin-left: 0;
    border-radius: 0.5rem;
    /*background-color: var(--bs-espasem-Naranja);*/
  }

  /* Mostrar submenu al hacer hover (opcional) */
  .dropdown-submenu:hover > .dropdown-menu {
    display: block;
  }

/* Para dispositivos móviles necesitaremos JavaScript */
@media (max-width: 991.98px) {
  .dropdown-menu .dropdown-menu {
    margin-left: 0.5rem;
    margin-right: 0.5rem;
    margin-bottom: 0.5rem;
  }
}
/* *** FIN - manejo de submenu *** */

/* Reescritas por Espasem */



/* *** FIN *** */



/* * Modal Popup * */

.modalPopup {
  font-family: inherit;
  /*font-size: 1rem;*/
  border: 1px solid #00008C; /* Azul 10 */
  background-color: #F1F1FF; /* Azul 2 */
  padding: 1px;
  margin: 0px;
}

  .modalPopup p {
    padding: 5px;
  }

.modalBackground {
  background-color: #7F7FFF; /* Azul 10 */
  filter: opacity(80%);
  opacity: 0.8;
}



/* Textbox Watermark */
.watermarked {
  background-color: #FFF4D7; /* Dorado 03 */
  color: hsl(20, 80%, 60%);
}

.espValidador {
  display: none;
}

.espHighlightCssClass {
  color: hsl(20, 80%, 60%);
  animation: movAlerta 1s infinite;
}

@keyframes movAlerta {
  80% {
    color: red;
    font-weight: 600;
  }
}


.espHighlightCssClass {
  color: hsl(20, 80%, 60%);
  animation: movAlerta 1s infinite;
}

@keyframes movAlerta {
  80% {
    color: red;
    font-weight: 600;
  }
}

/* Eliminar para que se use el mensaje por defecto del Ajax */
.espValidatorCalloutExtender {
  font-family: inherit;
  font-size: 14px !important;
  color: red !important;
  border-style: solid !important;
  border-width: 1px !important;
  border-color: #00008C !important; /* Azul 10 */
  background-color: #FFDECB !important; /* Naranja 04 */
}


/*   * * TEMPORALES (usados para el diseño) * * */
.esp-borde-color-azul {
  border: 1px solid blue;
  /**/
  /*margin: 0px;*/
}

.esp-borde-color-rojo {
  border: 1px solid red;
  /**/
  /*margin: 0px;*/
}

.esp-borde-color-naranja {
  border: 1px solid orange;
  /**/
  /*margin: 0px;*/
}


.pb-6 {
  padding-bottom: 3.5rem !important;
}
.pb-7 {
  padding-bottom: 4rem !important;
}


.w-30 {
  width: 30% !important;
}

.w-40 {
  width: 40% !important;
}

.w-60 {
  width: 50% !important;
}

.w-80 {
  width: 50% !important;
}

.w-90 {
  width: 90% !important;
}

.top-10 {
  top: 10% !important;
}


@media (min-width: 576px) {
  .modal-m4 {
    --bs-modal-width: 400px;
  }

  .modal-m5 {
    --bs-modal-width: 500px;
  }

  .modal-m6 {
    --bs-modal-width: 600px;
  }

  .modal-m7 {
    --bs-modal-width: 700px;
  }
}

/* *** Para el Nuevo Calendario *** */
/* Estilos para Calendar con Bootstrap 5 */

/*.modal-body .table {
  margin: auto;
}
*/
/*.calendar td, .calendar th {
  text-align: center;
}
*/
.modal-position-top-left {
  position: fixed;
  top: 10rem;
  left: 8rem;
  margin: 0;
  transform: none !important;
}

/*.text-muted.bg-light {
  pointer-events: none;
  cursor: not-allowed;
}*/


/* Aplica a la tabla del Calendario */
/*asp\:Calendar .table td,
asp\:Calendar .table th {
  text-align: center;
  vertical-align: middle;
  padding: 10.5rem;
}*/

/* Día seleccionado */
/*.cal-dia-seleccionado {
  background-color: #0d6efd;
  color: white;
  font-weight: bold;
}*/

/* Hoy */
/*.cal-hoy {
  border: 2px solid brown;
  background-color: #BFBFFF;
  font-weight: bold;
  color: black;
}*/

/* Sábados */
/*.cal-sabado {
  color: #0d6efd;
  border: 2px solid blue;
}*/

/* Domingos */
/*.cal-domingo {
  color: #dc3545;
  border: 2px solid red;
}*/

/* Feriado */
/*.cal-feriado {*/
/*background-color: #ffc107 !important;*/
/*background-color: #ffacaf;
  color: #212529;
  font-weight: bold;
}*/

/* Fuera de rango */
/*.cal-inactivo {
  color: #b0b0b0;
  background-color: #f8f9fa;
  pointer-events: none;
}*/
/* Fin de Tabla Calendario */



/*  AQUI ESTOY */

.calendar-bootstrap {
  width: 100%;
  border: none;
  font-family: inherit;
}

  .calendar-bootstrap thead {
    background-color: red;
    color: var(--bs-white);
  }


  .calendar-bootstrap table {
    width: 100%;
    border-collapse: separate;
    padding: 2px 8px;
  }

.calendar-title {
  /* Descripción del mes y año actual (junio de 2025) */
  background-color: var(--bs-espasem-Naranja);
  color: var(--bs-white);
  font-weight: 400;
  padding: 0px;
  border: none;
}

.calendar-day-header {
  /* cabecera de días (LU, MA Mi JU VI SA DO)*/
  background-color: var(--bs-black);
  color: var(--bs-white);
  font-weight: 400;
  font-size: 0.9rem;
  padding: 2px 4px;
  text-align: center;
}

.calendar-day {
  background-color: white;
  border: 1px solid var(--bs-border-color);
  padding: 4px;
  text-align: center;
  cursor: pointer;
  transition: all 0.2s ease;
  border-radius: 6px;
}

  .calendar-day:hover {
    background-color: var(--bs-primary-bg-subtle) !important;
    border-color: var(--bs-primary);
  }

.calendar-selected-day {
  background-color: var(--bs-primary);
  /*color: white !important;*/
  color: #3f3fff !important;
  font-weight: 400;
  border-color: var(--bs-primary);
  border-radius: 6px;
}

.calendar-weekend {
  background-color: var(--bs-info-bg-subtle);
  color: var(--bs-info-text-emphasis);
}

  .calendar-weekend:hover {
    background-color: var(--bs-primary-bg-subtle);
    border-color: var(--bs-primary);
  }

.calendar-other-month {
  background-color: var(--bs-secondary-bg);
  color: var(--bs-secondary-color);
  opacity: 0.5;
}

.calendar-today {
  background-color: var(--bs-warning-bg-subtle) !important;
  color: var(--bs-warning-text-emphasis) !important;
  font-weight: 600;
  border: 2px solid var(--bs-warning) !important;
}

.calendar-nav {
  /* Cambio de meses (May .... Jul) (NO SE USA) */
  /*background-color: var(--bs-primary);*/
  background-color: var(--bs-espasem-Naranja-15);
  font-weight: bold;
  padding: 2px 4px;
  text-decoration: none;
  /*border-radius: 4px;*/
}

  .calendar-nav:hover {
    background-color: var(--bs-primary-dark);
    color: white;
  }

/* Días deshabilitados por validación */
.calendar-day-disabled {
  background-color: var(--bs-secondary-bg) !important;
  color: var(--bs-secondary-color) !important;
  cursor: not-allowed !important;
  opacity: 0.5;
}

/*




.calendar-selected-day {
  background-color: var(--bs-primary) !important;
  color: white !important;
  font-weight: 600;
  border-color: var(--bs-primary) !important;
  border-radius: 4px;
}

.calendar-weekend {
  background-color: var(--bs-info-bg-subtle);
  color: var(--bs-info-text-emphasis);
}

.calendar-other-month {
  background-color: var(--bs-secondary-bg);
  color: var(--bs-secondary-color);
  opacity: 0.6;
}

.calendar-today {
  background-color: var(--bs-warning-bg-subtle) !important;
  color: var(--bs-warning-text-emphasis) !important;
  font-weight: 600;
  border: 2px solid var(--bs-warning) !important;
}


  .calendar-nav:hover {
    background-color: var(--bs-primary-dark);
    color: white;
  }
*/
/* Días deshabilitados por validación */
/*.calendar-day-disabled {
  background-color: var(--bs-secondary-bg) !important;
  color: var(--bs-secondary-color) !important;
  cursor: not-allowed !important;
  opacity: 0.5;
}*/