

    /* HEADER SUPERIOR */
    header.header-principal {
      background: #191970;
      color: white;
      padding: 10px 20px;
      display: flex;
      justify-content: space-between;
      align-items: center;
    }

    .header-principal .titulo-app {
      font-size: 20px;
      font-weight: bold;
    }

    .header-principal .usuario {
      font-size: 14px;
      font-style: italic;
    }

    .form-container {
      max-width: 1250px;      
      margin: 0px auto;
      margin-top: 0;
      margin-bottom: 0;
      padding: 0px;      
      /*box-shadow: 0 2px 6px rgba(0,0,0,0.1);*/
      /*border: 1px solid #0419d4;*/
    }

    h2.titulo {
      margin-top: 0;
      color: #191970;
    }

    h3.subtitulo {
      margin-top: 30px;
      margin-bottom: 10px;
      color: #333;
    }

    .divExterno {
      width: 100%;
      max-width: 1230px; /* el mismo que "container_external_table" */
      margin-top: 1;
      justify-content: center;
      align-items: center;
      border-top: 0;
      /*border: 1px solid #00ff00;*/
    }

    .div-criterios {
      margin-top: 10px;
      display: flex;
      flex-wrap: wrap;
      gap: 10px;
      align-items: flex-end;
      /*border: 1px solid #e6094b;*/
    }

    .div-criterios label {
      display: block;
      font-weight: bold;
      margin-bottom: 5px;
    }

    .div-criterios .campo {
      display: flex;
      flex-direction: column;
    }

    .div-criterios input {
      padding: 6px 10px;
      width: 200px;
      border-radius: 4px;
      /*border: 1px solid #ccc;*/
    }

    .div-criterios button {
      padding: 8px 20px;
      border: none;
      background: #1e90ff;
      color: white;
      border-radius: 4px;
      cursor: pointer;
    }

    .div-criterios button:hover {
      background: #0e75d6;
    }

    .div-ConBorde {
      border: 1px solid #ccc;
      border-radius: 4px;
      box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.05);
    }

    .div-borde-tabla {
      border: 1px solid #ccc;
      border-radius: 4px;
      padding: 5px 5px 5px 0px;
      margin-top: 20px;
      margin-bottom: 20px;  
      border-top: 1px solid #ccc;
      border-right: 1px solid #ccc;
      box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.15);
    }


    .container_external_table {
      width: 100%;    /*100%*/
      max-width: 1230px;   /* mismo que la tabla */
      height: 250px;
      margin-top: 1px;
      margin-left: auto;
      margin-right: auto;
      /*border: 1px solid #404aa8;*/
    }

    .container_scroll_table {
        /*NO forzar max-width, porque ya está limitado por el padre .sticky-table-wrapper*/
      margin: 0 auto;      /* centrar */
      width: 100%;  /**/
      height: 250px;
      overflow-x: auto; /*activa el scroll, activarlo solo en el contenedor interno*/
      overflow-y: auto; /*activa el scroll, activarlo solo en el contenedor interno*/
      box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.3);
      /*border: 3px solid #00ff00;*/
    }

    .container_external {
      width: 100%;    /*100%*/
      max-width: 1230px;   /* mismo que la tabla */
      margin-top: 1px;
      margin-left: auto;
      margin-right: auto;
      /*border: 1px solid #e6092e;*/
    }

    .container_scroll {
      /*NO forzar max-width, porque ya está limitado por el padre .sticky-table-wrapper*/
      margin: 0 auto;      /* centrar */
      width: 100%;
      overflow-x: auto; /*activa el scroll, activarlo solo en el contenedor interno*/
      overflow-y: auto; /*activa el scroll, activarlo solo en el contenedor interno*/
      border: 3px solid #0c06c4;
    }    

    .tblResult {
      width: 100%;
      border-collapse: collapse;
    }

    .tblResult th,
    .tblResult td {
      padding: 3px;
      text-align: left;
      border-right: 1px solid #ccc;
      //border: 1px solid #aaa;*/
    }

    .tblResult thead th {
      position: sticky;
      top: 0;
      z-index: 2;
      text-align: center;
      font-family: Arial, Helvetica, sans-serif;
                        font-size: 13px;
                        background-color:#17609B;
                        color: #FFFFFF;
    }

    .tblCriterios {
      width: 100%;
      margin: 0 auto;
    }

    .tblCriterios th,
    .tblCriterios td {
      height: 26px;
      /*padding: 6px 10px;*/
      vertical-align: middle; /* centra el contenido verticalmente */
    }
    
    .tblCriterios input{
      height: 24px;
      padding: 1px;
    }

    .tblCriterios input[type="text"] {
      width: 100%;
      height: 24px;
      padding: 1px 4px;
      box-sizing: border-box; /* importante para que el padding no rompa el 100% */
    }

    .cont-alineado {
      display: flex; /* O display: inline-flex; */
      align-items: center;
      justify-content: space-between;
      gap: 10px;
      /* Si quieres que los elementos se alineen en una fila */
      /*  flex-direction: row; */
    }

    .bloque1-izquierda {
      flex: 0 0 auto;
    }

    .bloque1-centro {
      flex: 1;
      text-align: center;
    }

    .col-fecha {
      width: 70px;
      text-align: center !important;
      white-space: nowrap;   /* evita que se parta */
    }
    .col-number {
      text-align: right !important;
      white-space: nowrap;
    }

    .col-center {
      text-align: center !important;
    }

    .col-widthmin100 {
      min-width: 100px;
      white-space: nowrap;   /* evita que se parta */
    }
