/*
 * SIGOS V37 · R8G
 * SIGOS_V37_R8G_GOLDEN_CONTAINER_EXACT
 *
 * Fuente única:
 * m5-rei-premium-r8g.css
 *
 * Las reglas interiores son copia literal del Golden Master.
 * Solo cambia el mecanismo que mide el ancho:
 *
 * @media viewport → @container componente.
 */

.sigosR8gGoldenContainerHost {
  container-type: inline-size;
  container-name: sigos-rei-golden;
}

@container sigos-rei-golden (max-width: 640px) {


  .r8gReiToolbar{
    flex-direction:column;
    gap:6px;
    margin-bottom:8px;
  }

  .r8gReiSearchShell{
    width:100%;
    padding:5px;
    border-radius:13px;
  }

  .r8gReiSearch{
    height:40px;
    font-size:11px;
  }

  .r8gReiButton.primary{
    min-height:40px;
    padding:0 14px;
    font-size:9px;
  }

  .r8gReiToolbarActions{
    width:100%;
    overflow-x:auto;
    gap:5px;
    scrollbar-width:none;
    -webkit-overflow-scrolling:touch;
  }

  .r8gReiToolbarActions::-webkit-scrollbar{
    display:none;
  }

  .r8gReiToolbarActions .r8gReiButton{
    flex:0 0 auto;
    min-height:36px;
    padding:0 13px;
    border-radius:10px;
    font-size:9px;
  }


  /* 9 FILTROS */

  .r8gReiFilters{
    gap:5px;
  }

  .r8gReiChip,
  .r8gReiApply{
    min-height:32px;
    font-size:8px;
  }

  .r8gReiChip{
    padding:0 10px;
  }

  .r8gReiChipCount{
    width:20px;
    height:20px;
    font-size:8px;
  }

  .r8gReiFilterSeparator{
    height:23px;
  }


  /* 6 KPIs EN SWIPE */

  .r8gReiKpiViewport{
    margin-top:9px;
  }

  .r8gReiKpis{
    display:flex;
    min-width:0;
    width:max-content;
    gap:6px;
    padding-right:15px;
    scroll-snap-type:x proximity;
  }

  .r8gReiKpi{
    flex:0 0 158px;
    min-height:64px;
    padding:10px 11px;
    border-radius:13px;
    scroll-snap-align:start;
  }

  .r8gReiKpiLabel{
    font-size:8px;
  }

  .r8gReiKpiValue{
    font-size:18px;
  }


  /* TABLA MISMA */

  .r8gReiTableViewport.r8fTableViewport{
    margin-top:9px;
    border-radius:13px;
  }

  .r8gReiTable{
    min-width:1320px;
  }

  .r8gReiTable th{
    padding:8px;
    font-size:8px;
  }

  .r8gReiTable td{
    padding:11px 8px;
  }

  .r8gReiColMt{
    width:89px;
    min-width:89px;
  }

  .r8gReiColDate{
    width:125px;
    min-width:125px;
  }

  .r8gReiColSupplies{
    width:260px;
    min-width:260px;
  }

  .r8gReiColMeter{
    width:285px;
    min-width:285px;
  }

  .r8gReiColBalance{
    width:315px;
    min-width:315px;
  }

  .r8gReiColSbbt{
    width:250px;
    min-width:250px;
  }

  .r8gReiColEvolution{
    width:330px;
    min-width:330px;
  }

  .r8gReiMtCode{
    font-size:12px;
  }

  .r8gReiMtSub{
    font-size:7px;
  }

  .r8gReiDate{
    font-size:10px;
  }

  .r8gReiSupplyCard{
    width:70px;
    padding:9px 6px 7px;
  }

  .r8gReiSupplyCard strong{
    font-size:13px;
  }

  .r8gReiSupplyCard span{
    font-size:8px;
  }

  .r8gReiCompareValue{
    font-size:10px;
  }

  .r8gReiBalanceGrid{
    grid-template-columns:62px 39px 70px 1fr;
    gap:6px;
  }

  .r8gReiMobileHint{
    display:flex;
    justify-content:flex-end;
    padding:5px 2px 0;
    color:#7a8da0;
    font-size:8px;
    font-weight:700;
  }


}
@container sigos-rei-golden (max-width: 640px) {


  /* ==========================================================
     BUSCADOR
     ========================================================== */

  .r8gReiToolbar{
    gap:5px;
    margin-bottom:6px;
  }

  .r8gReiSearchShell{
    gap:4px;
    padding:4px;
    border-radius:11px;
  }

  .r8gReiSearch{
    height:36px;
    padding:0 9px;
    border-radius:9px;
    font-size:10px;
  }

  .r8gReiButton.primary{
    min-height:36px;
    padding:0 11px;
    border-radius:9px;
    font-size:8px;
  }

  .r8gReiToolbarActions{
    gap:4px;
    overflow-x:auto;
    scroll-snap-type:x mandatory;
    scroll-padding-inline:1px;
    overscroll-behavior-x:contain;
  }

  .r8gReiToolbarActions .r8gReiButton{
    min-height:33px;
    padding:0 11px;
    border-radius:9px;
    font-size:8px;

    scroll-snap-align:start;
    scroll-snap-stop:always;
  }


  /* ==========================================================
     FILTROS
     Cada control aterriza ENTERO.
     ========================================================== */

  .r8gReiFilterViewport{
    overflow-x:auto;
    scroll-snap-type:x mandatory;
    scroll-padding-inline:1px;
    overscroll-behavior-x:contain;
  }

  .r8gReiFilters{
    gap:4px;
    padding:1px 10px 3px 1px;
  }

  .r8gReiChip,
  .r8gReiApply{
    min-height:29px;
    border-radius:999px;
    font-size:7px;

    scroll-snap-align:start;
    scroll-snap-stop:always;
  }

  .r8gReiChip{
    padding:0 8px;
  }

  .r8gReiApply{
    padding:0 10px;
    border-radius:9px;
  }

  .r8gReiEvolution{
    gap:6px;
  }

  .r8gReiChipCount{
    width:18px;
    height:18px;
    font-size:7px;
  }

  .r8gReiFilterSeparator{
    height:20px;
    margin:0 1px;
  }


  /* ==========================================================
     KPIs
     EXACTAMENTE 3 TARJETAS COMPLETAS POR VIEWPORT.

     No usamos width fija.
     Así no queda media tarjeta al borde.
     ========================================================== */

  .r8gReiKpiViewport{
    margin-top:7px;

    overflow-x:auto;
    scroll-snap-type:x mandatory;
    scroll-padding-inline:0;
    overscroll-behavior-x:contain;
  }

  .r8gReiKpis{
    display:grid;

    width:200%;
    min-width:200%;

    grid-template-columns:
      repeat(
        6,
        minmax(
          0,
          1fr
        )
      );

    gap:5px;

    padding:0;

    scroll-snap-type:none;
  }

  .r8gReiKpi{
    min-width:0;
    min-height:57px;

    padding:8px 8px;

    border-radius:11px;

    scroll-snap-align:start;
    scroll-snap-stop:always;
  }

  /*
   * 6 tarjetas repartidas sobre 200% del viewport.
   * Resultado:
   * viewport 1 = KPI 1, 2, 3 completas
   * viewport 2 = KPI 4, 5, 6 completas
   */

  .r8gReiKpi:nth-child(1),
  .r8gReiKpi:nth-child(4){
    scroll-snap-align:start;
  }

  .r8gReiKpiLabel{
    min-height:17px;

    margin-bottom:4px;

    font-size:7px;
    line-height:1.15;

    overflow-wrap:normal;
  }

  .r8gReiKpiValue{
    font-size:15px;
    line-height:1;
    white-space:nowrap;
  }


  /* ==========================================================
     TABLA
     MISMA TABLA.
     Solo reducimos anchos.
     ========================================================== */

  .r8gReiTableViewport.r8fTableViewport{
    margin-top:7px;

    overflow-x:auto;

    border-radius:11px;

    scroll-snap-type:x proximity;
    scroll-padding-left:76px;

    overscroll-behavior-x:contain;
  }

  .r8gReiTable{
    /*
     * Antes ~1320px.
     * Ahora ~1120px.
     * Conserva las 7 columnas y todas las celdas.
     */
    min-width:1120px;
  }

  .r8gReiTable th{
    padding:7px 6px;

    font-size:7px;

    scroll-snap-align:start;
  }

  .r8gReiTable td{
    padding:9px 6px;
  }


  /* MT */

  .r8gReiColMt{
    width:76px;
    min-width:76px;
  }

  .r8gReiMtCode{
    margin-bottom:2px;
    font-size:11px;
  }

  .r8gReiMtSub{
    font-size:6px;
  }


  /* FECHA */

  .r8gReiColDate{
    width:88px;
    min-width:88px;
  }

  .r8gReiDate{
    font-size:9px;
    white-space:nowrap;
  }


  /* SUMINISTROS */

  .r8gReiColSupplies{
    width:205px;
    min-width:205px;
  }

  .r8gReiSupplyGrid{
    gap:4px;
  }

  .r8gReiSupplyCard{
    width:60px;

    padding:
      7px
      4px
      6px;

    border-radius:9px;
  }

  .r8gReiSupplyCard strong{
    margin-bottom:3px;
    font-size:11px;
  }

  .r8gReiSupplyCard span{
    font-size:7px;
  }


  /* MEDIDOR / RTC */

  .r8gReiColMeter{
    width:205px;
    min-width:205px;
  }

  .r8gReiCompareStack{
    gap:8px;
  }

  .r8gReiCompareLine{
    grid-template-columns:47px 1fr;
    gap:5px;
  }

  .r8gReiCompareLabel{
    font-size:6px;
    letter-spacing:.08em;
  }

  .r8gReiCompareValue{
    font-size:9px;
  }

  .r8gReiArrow{
    padding:0 3px;
  }


  /* BALANCE SIGOS */

  .r8gReiColBalance{
    width:255px;
    min-width:255px;
  }

  .r8gReiBalanceGrid{
    grid-template-columns:
      53px
      32px
      57px
      1fr;

    gap:5px;
  }

  .r8gReiStatus{
    min-height:21px;

    padding:3px 4px;

    font-size:6px;
  }

  .r8gReiBalanceKind{
    font-size:6px;
  }

  .r8gReiRange{
    min-height:23px;

    padding:3px 5px;

    font-size:7px;
  }

  .r8gReiMetricBig{
    font-size:8px;
  }

  .r8gReiMetricSmall{
    font-size:6px;
  }


  /* SBBT */

  .r8gReiColSbbt{
    width:155px;
    min-width:155px;
  }

  .r8gReiSbbtCell{
    grid-template-columns:61px 1fr;
    gap:7px;
  }

  .r8gReiSbbtRange{
    width:61px;
  }

  .r8gReiSbbtValues{
    gap:1px;
    font-size:7px;
  }

  .r8gReiSbbtValues strong{
    font-size:8px;
  }


  /* EVOLUCIÓN */

  .r8gReiColEvolution{
    width:180px;
    min-width:180px;
  }

  .r8gReiEvolutionTitle{
    margin-bottom:2px;
    font-size:9px;
  }

  .r8gReiEvolutionTransition{
    margin-bottom:2px;
    font-size:7px;
  }

  .r8gReiEvolutionDelta,
  .r8gReiEvolutionProjected{
    font-size:6px;
  }


  /* ==========================================================
     STICKY
     ========================================================== */

  .r8gReiSticky{
    box-shadow:
      8px 0 12px -13px
      #17314b;
  }


  /* ==========================================================
     AYUDA
     ========================================================== */

  .r8gReiMobileHint{
    padding-top:4px;
    font-size:7px;
  }


}
@container sigos-rei-golden (max-width: 640px) {



  /* ==========================================================
     TOOLBAR

     Página 1:
     Buscar MT + Buscar

     Página 2:
     Descargar vista + Descargar REI
     ========================================================== */

  .r8gReiToolbar{
    display:flex !important;
    flex-direction:row !important;
    align-items:stretch !important;

    width:100%;

    gap:0 !important;

    overflow-x:auto !important;
    overflow-y:hidden !important;

    scroll-snap-type:x mandatory !important;
    scroll-padding-inline:0 !important;

    overscroll-behavior-x:contain;
    -webkit-overflow-scrolling:touch;

    scrollbar-width:none;

    margin-bottom:5px !important;
  }

  .r8gReiToolbar::-webkit-scrollbar{
    display:none;
  }


  /* PÁGINA 1 */

  .r8gReiSearchShell{
    flex:0 0 100% !important;

    width:100% !important;
    min-width:100% !important;

    display:flex;

    gap:4px !important;

    padding:4px !important;

    border-radius:11px !important;

    scroll-snap-align:start;
    scroll-snap-stop:always;
  }

  .r8gReiSearch{
    min-width:0 !important;

    height:34px !important;

    padding:
      0
      8px !important;

    border-radius:8px !important;

    font-size:9px !important;
  }

  .r8gReiSearchShell
  .r8gReiButton.primary{
    flex:0 0 72px !important;

    min-width:72px !important;
    min-height:34px !important;

    padding:0 8px !important;

    border-radius:8px !important;

    font-size:8px !important;
  }


  /* PÁGINA 2 */

  .r8gReiToolbarActions{
    flex:0 0 100% !important;

    width:100% !important;
    min-width:100% !important;

    display:grid !important;

    grid-template-columns:
      repeat(
        2,
        minmax(0,1fr)
      ) !important;

    gap:5px !important;

    padding:
      0
      1px !important;

    overflow:visible !important;

    scroll-snap-align:start;
    scroll-snap-stop:always;
  }

  .r8gReiToolbarActions
  .r8gReiButton{
    width:100% !important;

    min-width:0 !important;
    min-height:34px !important;

    padding:
      0
      7px !important;

    border-radius:9px !important;

    font-size:8px !important;
  }


  /* ==========================================================
     FILTROS

     9 CONTROLES REALES.
     El separador visual desaparece en móvil.

     3 páginas × 3 controles completos.
     ========================================================== */

  .r8gReiFilterViewport{
    width:100%;

    overflow-x:auto !important;
    overflow-y:hidden !important;

    scroll-snap-type:x mandatory !important;
    scroll-padding-inline:0 !important;

    overscroll-behavior-x:contain;
    -webkit-overflow-scrolling:touch;

    scrollbar-width:none;
  }

  .r8gReiFilterViewport::-webkit-scrollbar{
    display:none;
  }

  .r8gReiFilterSeparator{
    display:none !important;
  }

  .r8gReiFilters{
    display:grid !important;

    /*
     * 9 controles sobre 300%:
     * cada viewport contiene exactamente 3.
     */

    width:300% !important;
    min-width:300% !important;

    grid-template-columns:
      repeat(
        9,
        minmax(0,1fr)
      ) !important;

    align-items:stretch;

    column-gap:4px !important;

    padding:0 !important;
  }

  .r8gReiChip,
  .r8gReiApply{
    width:100% !important;
    min-width:0 !important;

    min-height:27px !important;

    margin:0 !important;

    padding:
      0
      4px !important;

    border-radius:999px !important;

    font-size:6.4px !important;
    line-height:1 !important;

    letter-spacing:-.01em;

    white-space:nowrap !important;

    overflow:visible !important;

    scroll-snap-align:none !important;
    scroll-snap-stop:normal !important;
  }

  .r8gReiApply{
    border-radius:8px !important;
  }

  .r8gReiEvolution{
    display:flex !important;
    justify-content:center !important;

    gap:4px !important;
  }

  .r8gReiChipCount{
    flex:0 0 16px;

    width:16px !important;
    height:16px !important;

    font-size:6px !important;
  }


  /*
   * Solo los inicios de página hacen snap.
   *
   * 1 = Inconsistente
   * 4 = Medio
   * 7 = Inconsistente +
   *
   * El separador oculto sigue siendo child 8,
   * pero no participa en Grid.
   */

  .r8gReiFilters > :nth-child(1),
  .r8gReiFilters > :nth-child(4),
  .r8gReiFilters > :nth-child(7){
    scroll-snap-align:start !important;
    scroll-snap-stop:always !important;
  }


  /* ==========================================================
     KPI

     6 KPIs
     2 páginas
     3 tarjetas completas por página.
     ========================================================== */

  .r8gReiKpiViewport{
    width:100%;

    margin-top:6px !important;

    overflow-x:auto !important;
    overflow-y:hidden !important;

    scroll-snap-type:x mandatory !important;
    scroll-padding-inline:0 !important;

    overscroll-behavior-x:contain;
    -webkit-overflow-scrolling:touch;

    scrollbar-width:none;
  }

  .r8gReiKpiViewport::-webkit-scrollbar{
    display:none;
  }

  .r8gReiKpis{
    display:grid !important;

    width:200% !important;
    min-width:200% !important;

    grid-template-columns:
      repeat(
        6,
        minmax(0,1fr)
      ) !important;

    gap:4px !important;

    padding:0 !important;
  }

  .r8gReiKpi{
    width:100% !important;
    min-width:0 !important;

    min-height:53px !important;

    padding:
      7px
      7px !important;

    border-radius:10px !important;

    scroll-snap-align:none !important;
    scroll-snap-stop:normal !important;
  }

  .r8gReiKpi:nth-child(1),
  .r8gReiKpi:nth-child(4){
    scroll-snap-align:start !important;
    scroll-snap-stop:always !important;
  }

  .r8gReiKpiLabel{
    min-height:15px !important;

    margin-bottom:3px !important;

    font-size:6.5px !important;
    line-height:1.1 !important;

    white-space:normal !important;
  }

  .r8gReiKpiValue{
    font-size:14px !important;
    line-height:1 !important;

    white-space:nowrap;
  }


  /* ==========================================================
     TABLA

     Mantener todo.
     Compactar un poco más.
     ========================================================== */

  .r8gReiTableViewport.r8fTableViewport{
    margin-top:6px !important;

    border-radius:10px !important;

    scroll-snap-type:x proximity;
  }

  .r8gReiTable{
    min-width:1040px !important;
  }

  .r8gReiTable th{
    padding:
      6px
      5px !important;

    font-size:6.5px !important;
  }

  .r8gReiTable td{
    padding:
      8px
      5px !important;
  }


  /* MT */

  .r8gReiColMt{
    width:72px !important;
    min-width:72px !important;
  }

  .r8gReiMtCode{
    font-size:10px !important;
  }

  .r8gReiMtSub{
    font-size:5.8px !important;
  }


  /* FECHA */

  .r8gReiColDate{
    width:82px !important;
    min-width:82px !important;
  }

  .r8gReiDate{
    font-size:8px !important;
  }


  /* SUMINISTROS */

  .r8gReiColSupplies{
    width:190px !important;
    min-width:190px !important;
  }

  .r8gReiSupplyGrid{
    gap:3px !important;
  }

  .r8gReiSupplyCard{
    width:55px !important;

    padding:
      6px
      3px
      5px !important;

    border-radius:8px !important;
  }

  .r8gReiSupplyCard strong{
    font-size:10px !important;
  }

  .r8gReiSupplyCard span{
    font-size:6px !important;
  }


  /* MEDIDOR / RTC */

  .r8gReiColMeter{
    width:190px !important;
    min-width:190px !important;
  }

  .r8gReiCompareLine{
    grid-template-columns:
      43px
      1fr !important;

    gap:4px !important;
  }

  .r8gReiCompareLabel{
    font-size:5.5px !important;
  }

  .r8gReiCompareValue{
    font-size:8px !important;
  }


  /* BALANCE SIGOS */

  .r8gReiColBalance{
    width:235px !important;
    min-width:235px !important;
  }

  .r8gReiBalanceGrid{
    grid-template-columns:
      49px
      29px
      51px
      1fr !important;

    gap:
      4px
      4px !important;
  }

  .r8gReiStatus{
    min-height:19px !important;

    padding:
      2px
      3px !important;

    font-size:5.5px !important;
  }

  .r8gReiBalanceKind{
    font-size:5.5px !important;
  }

  .r8gReiRange{
    min-height:21px !important;

    padding:
      2px
      4px !important;

    font-size:6px !important;
  }

  .r8gReiMetricBig{
    font-size:7px !important;
  }

  .r8gReiMetricSmall{
    font-size:5.5px !important;
  }


  /* SBBT */

  .r8gReiColSbbt{
    width:145px !important;
    min-width:145px !important;
  }

  .r8gReiSbbtCell{
    grid-template-columns:
      56px
      1fr !important;

    gap:6px !important;
  }

  .r8gReiSbbtRange{
    width:56px !important;
  }

  .r8gReiSbbtValues{
    font-size:6px !important;
  }

  .r8gReiSbbtValues strong{
    font-size:7px !important;
  }


  /* EVOLUCIÓN */

  .r8gReiColEvolution{
    width:155px !important;
    min-width:155px !important;
  }

  .r8gReiEvolutionTitle{
    font-size:8px !important;
  }

  .r8gReiEvolutionTransition{
    font-size:6px !important;
  }

  .r8gReiEvolutionDelta,
  .r8gReiEvolutionProjected{
    font-size:5.5px !important;
  }


  .r8gReiMobileHint{
    padding-top:3px !important;
    font-size:6px !important;
  }


}
@container sigos-rei-golden (max-width: 640px) {



  /* ==========================================================
     TOOLBAR · TODO EN UNA SOLA LÍNEA

     [ Buscar MT.......... ][Buscar] [Descarga]

     El tercer bloque es un único slot:
       Vista ↔ REI
     ========================================================== */

  .r8gReiToolbar{
    display:grid !important;

    grid-template-columns:
      minmax(0,1fr)
      82px !important;

    align-items:stretch !important;

    gap:4px !important;

    width:100% !important;

    overflow:visible !important;

    margin:
      0
      0
      5px !important;
  }


  /*
   * BUSCADOR + BUSCAR
   * FIJOS.
   */

  .r8gReiSearchShell{
    display:flex !important;

    width:100% !important;
    min-width:0 !important;

    flex:initial !important;

    gap:4px !important;

    padding:4px !important;

    border-radius:10px !important;

    scroll-snap-align:none !important;
  }


  .r8gReiSearch{
    flex:
      1
      1
      auto !important;

    width:auto !important;
    min-width:0 !important;

    height:34px !important;

    padding:
      0
      8px !important;

    border-radius:8px !important;

    font-size:9px !important;
  }


  .r8gReiSearchShell
  .r8gReiButton.primary{
    flex:
      0
      0
      60px !important;

    width:60px !important;
    min-width:60px !important;

    min-height:34px !important;
    height:34px !important;

    padding:0 !important;

    border-radius:8px !important;

    font-size:7.8px !important;
  }


  /* ==========================================================
     DESCARGA

     MISMO ESPACIO FÍSICO.

     Swipe:
     [Descargar vista] ↔ [Descargar REI]
     ========================================================== */

  .r8gReiToolbarActions{
    display:flex !important;

    flex:
      initial !important;

    width:82px !important;
    min-width:82px !important;
    max-width:82px !important;

    gap:0 !important;

    padding:0 !important;

    overflow-x:auto !important;
    overflow-y:hidden !important;

    scroll-snap-type:
      x
      mandatory !important;

    scroll-padding-inline:
      0 !important;

    overscroll-behavior-x:
      contain;

    -webkit-overflow-scrolling:
      touch;

    scrollbar-width:
      none;

    border-radius:
      9px;
  }


  .r8gReiToolbarActions::-webkit-scrollbar{
    display:none;
  }


  .r8gReiToolbarActions
  .r8gReiButton{
    flex:
      0
      0
      82px !important;

    width:82px !important;
    min-width:82px !important;
    max-width:82px !important;

    min-height:42px !important;
    height:42px !important;

    padding:
      0
      4px !important;

    border-radius:
      9px !important;

    font-size:
      6.2px !important;

    line-height:
      1.05 !important;

    white-space:
      normal !important;

    text-align:
      center;

    scroll-snap-align:
      start !important;

    scroll-snap-stop:
      always !important;
  }


  /* ==========================================================
     FILTROS

     IZQUIERDA
       rangos swipe

     DERECHA FIJA
       Evolución + Aplicar
     ========================================================== */

  .r8gReiFilterViewport{
    width:
      100% !important;

    overflow:
      visible !important;

    margin:
      0 !important;
  }


  .r8gReiFilters{
    display:grid !important;

    grid-template-columns:
      minmax(0,1fr)
      auto !important;

    align-items:
      stretch !important;

    width:
      100% !important;

    min-width:
      0 !important;

    gap:
      4px !important;

    padding:
      0 !important;
  }


  /* ----------------------------------------------------------
     SWIPER DE RANGOS
     ---------------------------------------------------------- */

  .r8gReiRangeSwiperV3B{
    display:flex;

    width:
      100%;

    min-width:
      0;

    overflow-x:
      auto;

    overflow-y:
      hidden;

    scroll-snap-type:
      x
      mandatory;

    scroll-padding-inline:
      0;

    overscroll-behavior-x:
      contain;

    -webkit-overflow-scrolling:
      touch;

    scrollbar-width:
      none;

    gap:
      0;
  }


  .r8gReiRangeSwiperV3B::-webkit-scrollbar{
    display:none;
  }


  /*
   * Cada página ocupa exactamente el
   * viewport disponible para rangos.
   */

  .r8gReiRangePageV3B{
    flex:
      0
      0
      100%;

    width:
      100%;

    min-width:
      100%;

    display:flex;

    align-items:center;

    justify-content:
      flex-start;

    gap:
      3px;

    padding-right:
      3px;

    scroll-snap-align:
      start;

    scroll-snap-stop:
      always;
  }


  /*
   * CHIP = ANCHO DEL TEXTO.
   *
   * Bajo queda pequeño.
   * Alto queda pequeño.
   * Inconsistente + crece solamente
   * lo que necesita.
   */

  .r8gReiRangePageV3B
  .r8gReiChip{
    flex:
      0
      0
      auto !important;

    width:
      auto !important;

    min-width:
      max-content !important;

    min-height:
      26px !important;

    height:
      26px !important;

    margin:
      0 !important;

    padding:
      0
      7px !important;

    border-radius:
      999px !important;

    font-size:
      6.2px !important;

    line-height:
      1 !important;

    white-space:
      nowrap !important;

    scroll-snap-align:
      none !important;

    scroll-snap-stop:
      normal !important;
  }


  /* ----------------------------------------------------------
     EVOLUCIÓN + APLICAR
     FIJOS
     ---------------------------------------------------------- */

  .r8gReiFixedFiltersV3B{
    display:flex;

    align-items:
      stretch;

    gap:
      3px;

    flex:
      0
      0
      auto;
  }


  .r8gReiFixedFiltersV3B
  .r8gReiEvolution{
    flex:
      0
      0
      105px !important;

    width:
      105px !important;

    min-width:
      105px !important;

    min-height:
      26px !important;

    height:
      26px !important;

    display:flex !important;

    align-items:
      center !important;

    justify-content:
      center !important;

    gap:
      3px !important;

    padding:
      0
      4px !important;

    border-radius:
      999px !important;

    font-size:
      5.6px !important;

    white-space:
      nowrap !important;

    scroll-snap-align:
      none !important;
  }


  .r8gReiFixedFiltersV3B
  .r8gReiChipCount{
    flex:
      0
      0
      15px !important;

    width:
      15px !important;

    height:
      15px !important;

    font-size:
      5.5px !important;
  }


  .r8gReiFixedFiltersV3B
  .r8gReiApply{
    flex:
      0
      0
      46px !important;

    width:
      46px !important;

    min-width:
      46px !important;

    min-height:
      26px !important;

    height:
      26px !important;

    padding:
      0 !important;

    border-radius:
      8px !important;

    font-size:
      6px !important;

    scroll-snap-align:
      none !important;
  }


  /* ==========================================================
     KPI

     Mantener 6.
     3 COMPLETAS por pantalla.
     Compactar otro poco.
     ========================================================== */

  .r8gReiKpiViewport{
    margin-top:
      5px !important;

    overflow-x:
      auto !important;

    scroll-snap-type:
      x
      mandatory !important;

    scroll-padding-inline:
      0 !important;

    overscroll-behavior-x:
      contain;
  }


  .r8gReiKpis{
    display:grid !important;

    width:
      200% !important;

    min-width:
      200% !important;

    grid-template-columns:
      repeat(
        6,
        minmax(0,1fr)
      ) !important;

    gap:
      4px !important;

    padding:
      0 !important;
  }


  .r8gReiKpi{
    width:
      100% !important;

    min-width:
      0 !important;

    min-height:
      48px !important;

    padding:
      6px
      7px !important;

    border-radius:
      10px !important;

    scroll-snap-align:
      none !important;
  }


  .r8gReiKpi:nth-child(1),
  .r8gReiKpi:nth-child(4){
    scroll-snap-align:
      start !important;

    scroll-snap-stop:
      always !important;
  }


  .r8gReiKpiLabel{
    min-height:
      14px !important;

    margin-bottom:
      3px !important;

    font-size:
      6.1px !important;

    line-height:
      1.08 !important;
  }


  .r8gReiKpiValue{
    font-size:
      13px !important;
  }


  /* ==========================================================
     TABLA
     La dejamos premium y completa.
     ========================================================== */

  .r8gReiTableViewport.r8fTableViewport{
    margin-top:
      5px !important;
  }


}
@container sigos-rei-golden (max-width: 640px) {



  /* ==========================================================
     CONTENEDOR GENERAL
     ========================================================== */

  .r8gReiFilterViewport{
    display:block !important;

    width:100% !important;
    min-width:0 !important;
    max-width:100% !important;

    height:auto !important;

    overflow:visible !important;

    margin:0 !important;
    padding:0 !important;
  }


  .r8gReiFilters{
    display:grid !important;

    /*
     * Zona izquierda flexible.
     * Zona derecha fija.
     */

    grid-template-columns:
      minmax(0,1fr)
      154px !important;

    grid-template-rows:
      28px !important;

    align-items:center !important;

    column-gap:4px !important;
    row-gap:0 !important;

    width:100% !important;
    min-width:0 !important;
    max-width:100% !important;

    height:28px !important;
    min-height:28px !important;
    max-height:28px !important;

    margin:0 !important;
    padding:0 !important;

    overflow:visible !important;
  }


  /* ==========================================================
     ÁREA SWIPE · 7 RANGOS
     ========================================================== */

  .r8gReiRangeSwiperV3B{
    grid-column:1 !important;
    grid-row:1 !important;

    display:flex !important;

    flex-direction:row !important;
    flex-wrap:nowrap !important;

    align-items:center !important;

    width:100% !important;
    min-width:0 !important;
    max-width:100% !important;

    height:28px !important;

    margin:0 !important;
    padding:0 !important;

    gap:0 !important;

    overflow-x:auto !important;
    overflow-y:hidden !important;

    scroll-snap-type:
      x
      mandatory !important;

    scroll-padding-inline:
      0 !important;

    overscroll-behavior-x:
      contain !important;

    -webkit-overflow-scrolling:
      touch;

    scrollbar-width:none;
  }


  .r8gReiRangeSwiperV3B::-webkit-scrollbar{
    display:none;
  }


  /* ==========================================================
     CADA PÁGINA = UNA SOLA FILA
     JAMÁS WRAP
     ========================================================== */

  .r8gReiRangePageV3B{
    flex:
      0
      0
      100% !important;

    display:flex !important;

    flex-direction:row !important;
    flex-wrap:nowrap !important;

    align-items:center !important;
    justify-content:flex-start !important;

    width:100% !important;
    min-width:100% !important;
    max-width:100% !important;

    height:28px !important;
    min-height:28px !important;
    max-height:28px !important;

    gap:3px !important;

    margin:0 !important;

    padding:
      0
      3px
      0
      0 !important;

    overflow:hidden !important;

    scroll-snap-align:
      start !important;

    scroll-snap-stop:
      always !important;
  }


  /* ==========================================================
     CHIPS VARIABLES

     IMPORTANTE:
     ancho = contenido real.

     Bajo es pequeño.
     Alto es pequeño.
     Medio es pequeño.
     Inconsistente + crece solo lo necesario.
     ========================================================== */

  .r8gReiRangePageV3B
  .r8gReiChip{
    display:inline-flex !important;

    flex:
      0
      0
      auto !important;

    align-items:center !important;
    justify-content:center !important;

    width:auto !important;
    min-width:max-content !important;
    max-width:none !important;

    height:26px !important;
    min-height:26px !important;
    max-height:26px !important;

    margin:0 !important;

    padding:
      0
      7px !important;

    border-radius:
      999px !important;

    font-size:
      6.2px !important;

    line-height:
      1 !important;

    white-space:
      nowrap !important;

    overflow:
      visible !important;

    text-overflow:
      clip !important;

    scroll-snap-align:
      none !important;
  }


  /* ==========================================================
     FIJOS DERECHA

     Evolución + Aplicar
     SIEMPRE MISMA FILA.
     ========================================================== */

  .r8gReiFixedFiltersV3B{
    grid-column:2 !important;
    grid-row:1 !important;

    display:grid !important;

    grid-template-columns:
      105px
      46px !important;

    grid-template-rows:
      26px !important;

    align-items:center !important;

    gap:3px !important;

    width:154px !important;
    min-width:154px !important;
    max-width:154px !important;

    height:26px !important;
    min-height:26px !important;
    max-height:26px !important;

    margin:0 !important;
    padding:0 !important;

    overflow:visible !important;

    white-space:nowrap !important;
  }


  .r8gReiFixedFiltersV3B
  .r8gReiEvolution{
    grid-column:1 !important;

    display:flex !important;

    align-items:center !important;
    justify-content:center !important;

    width:105px !important;
    min-width:105px !important;
    max-width:105px !important;

    height:26px !important;
    min-height:26px !important;
    max-height:26px !important;

    margin:0 !important;

    padding:
      0
      4px !important;

    gap:3px !important;

    border-radius:
      999px !important;

    font-size:
      5.6px !important;

    line-height:
      1 !important;

    white-space:
      nowrap !important;

    overflow:
      hidden !important;
  }


  .r8gReiFixedFiltersV3B
  .r8gReiChipCount{
    flex:
      0
      0
      15px !important;

    width:15px !important;
    min-width:15px !important;
    max-width:15px !important;

    height:15px !important;
    min-height:15px !important;
    max-height:15px !important;

    font-size:
      5.5px !important;
  }


  .r8gReiFixedFiltersV3B
  .r8gReiApply{
    grid-column:2 !important;

    display:flex !important;

    align-items:center !important;
    justify-content:center !important;

    width:46px !important;
    min-width:46px !important;
    max-width:46px !important;

    height:26px !important;
    min-height:26px !important;
    max-height:26px !important;

    margin:0 !important;

    padding:0 !important;

    border-radius:
      8px !important;

    font-size:
      6px !important;

    line-height:
      1 !important;

    white-space:
      nowrap !important;
  }


  /* ==========================================================
     ANULAR REGLAS VIEJAS QUE PODÍAN HACER WRAP
     ========================================================== */

  .r8gReiFilters > *,
  .r8gReiRangeSwiperV3B > *,
  .r8gReiRangePageV3B > *,
  .r8gReiFixedFiltersV3B > *{
    float:none !important;
  }


  .r8gReiRangeSwiperV3B,
  .r8gReiRangePageV3B,
  .r8gReiFixedFiltersV3B{
    flex-wrap:
      nowrap !important;
  }


}
@container sigos-rei-golden (min-width: 641px) {


  .r8gReiFilterViewport{
    width:100% !important;

    overflow-x:auto !important;
    overflow-y:hidden !important;

    scrollbar-width:none;

    -webkit-overflow-scrolling:
      touch;
  }

  .r8gReiFilterViewport::-webkit-scrollbar{
    display:none;
  }


  .r8gReiFilters{
    display:flex !important;

    flex-direction:row !important;
    flex-wrap:nowrap !important;

    align-items:center !important;

    width:max-content !important;
    min-width:100% !important;

    gap:6px !important;

    margin:0 !important;
    padding:0 !important;
  }


  /*
   * Quitar la noción de "páginas" en desktop.
   */

  .r8gReiRangeSwiperV3B{
    display:flex !important;

    flex:0 0 auto !important;

    flex-direction:row !important;
    flex-wrap:nowrap !important;

    align-items:center !important;

    width:auto !important;
    min-width:0 !important;

    gap:6px !important;

    overflow:visible !important;
  }


  .r8gReiRangePageV3B{
    display:contents !important;
  }


  .r8gReiRangePageV3B
  .r8gReiChip{
    flex:0 0 auto !important;

    width:auto !important;
    min-width:max-content !important;

    margin:0 !important;
  }


  .r8gReiFixedFiltersV3B{
    display:flex !important;

    flex:0 0 auto !important;

    flex-direction:row !important;
    flex-wrap:nowrap !important;

    align-items:center !important;

    width:auto !important;
    min-width:0 !important;

    gap:6px !important;

    margin:0 !important;
    padding:0 !important;
  }


  .r8gReiFixedFiltersV3B
  .r8gReiEvolution{
    width:auto !important;
    min-width:max-content !important;

    min-height:37px !important;

    padding:
      0
      12px !important;

    font-size:10px !important;
  }


  .r8gReiFixedFiltersV3B
  .r8gReiApply{
    width:auto !important;
    min-width:max-content !important;

    min-height:37px !important;

    padding:
      0
      15px !important;

    font-size:10px !important;
  }


}
@container sigos-rei-golden (max-width: 640px) {



  /* ==========================================================
     FILTROS · UNA SOLA LÍNEA
     ========================================================== */

  .r8gReiFilterViewport{
    width:100% !important;

    overflow:visible !important;

    margin:0 !important;
    padding:0 !important;
  }


  .r8gReiFilters{
    display:grid !important;

    /*
     * IZQUIERDA:
     *   cinta de rangos.
     *
     * DERECHA:
     *   Evolución + Aplicar.
     */

    grid-template-columns:
      minmax(0,1fr)
      154px !important;

    align-items:center !important;

    width:100% !important;
    min-width:0 !important;

    height:28px !important;

    gap:4px !important;

    margin:0 !important;
    padding:0 !important;
  }


  /*
   * CINTA CONTINUA.
   *
   * Se eliminan las páginas visuales.
   * Todos los chips quedan consecutivos:
   *
   * Inconsistente · Negativo · Bajo · Medio · Alto...
   */

  .r8gReiRangeSwiperV3B{
    display:flex !important;

    flex-direction:row !important;
    flex-wrap:nowrap !important;

    align-items:center !important;

    width:100% !important;
    min-width:0 !important;

    height:28px !important;

    gap:3px !important;

    margin:0 !important;

    padding:
      0
      7px
      0
      0 !important;

    overflow-x:auto !important;
    overflow-y:hidden !important;

    scroll-snap-type:
      x
      proximity !important;

    scroll-padding-inline:
      0
      7px !important;

    overscroll-behavior-x:
      contain;

    -webkit-overflow-scrolling:
      touch;

    scrollbar-width:none;
  }


  .r8gReiRangeSwiperV3B::-webkit-scrollbar{
    display:none;
  }


  /*
   * Desaparecen los contenedores de página.
   *
   * Sus chips pasan directamente al flex track.
   */

  .r8gReiRangePageV3B{
    display:contents !important;
  }


  .r8gReiRangePageV3B
  .r8gReiChip{
    display:inline-flex !important;

    flex:
      0
      0
      auto !important;

    align-items:center !important;
    justify-content:center !important;

    width:auto !important;
    min-width:max-content !important;

    height:26px !important;
    min-height:26px !important;

    margin:0 !important;

    padding:
      0
      7px !important;

    border-radius:
      999px !important;

    font-size:
      6.2px !important;

    white-space:
      nowrap !important;

    scroll-snap-align:
      start !important;
  }


  /*
   * Un pequeño final de pista permite que
   * Inconsistente + llegue completamente al viewport.
   */

  .r8gReiRangeSwiperV3B::after{
    content:"";

    flex:
      0
      0
      5px;
  }


  /* ==========================================================
     EVOLUCIÓN + APLICAR · FIJOS
     ========================================================== */

  .r8gReiFixedFiltersV3B{
    display:grid !important;

    grid-template-columns:
      105px
      46px !important;

    align-items:center !important;

    width:154px !important;
    min-width:154px !important;

    height:26px !important;

    gap:3px !important;

    margin:0 !important;
    padding:0 !important;
  }


  .r8gReiFixedFiltersV3B
  .r8gReiEvolution{
    width:105px !important;
    min-width:105px !important;

    height:26px !important;
    min-height:26px !important;

    padding:
      0
      4px !important;

    font-size:
      5.6px !important;
  }


  .r8gReiFixedFiltersV3B
  .r8gReiApply{
    width:46px !important;
    min-width:46px !important;

    height:26px !important;
    min-height:26px !important;

    padding:0 !important;

    font-size:
      6px !important;
  }


  /* ==========================================================
     TABLA · 3 POSICIONES LIMPIAS
     ========================================================== */

  .r8gReiTableViewport.r8fTableViewport{
    /*
     * cqw permite calcular las columnas
     * con el ancho REAL del contenedor.
     */

    container-type:
      inline-size;

    overflow-x:auto !important;

    scroll-snap-type:
      x
      mandatory !important;

    scroll-padding-left:
      72px !important;

    overscroll-behavior-x:
      contain;

    -webkit-overflow-scrolling:
      touch;

    box-shadow:
      inset -12px 0 12px -14px
      rgba(26,57,86,.55),
      var(--r8g-shadow);
  }


  /*
   * 3 pantallas:
   *
   * 1 · MT + fecha + suministros
   * 2 · MT + medidor + balance
   * 3 · MT + SBBT + evolución
   */

  .r8gReiTable{
    width:
      calc(
        300cqw - 144px
      ) !important;

    min-width:
      calc(
        300cqw - 144px
      ) !important;

    table-layout:
      fixed !important;
  }


  /* MT fija */

  .r8gReiColMt{
    width:
      72px !important;

    min-width:
      72px !important;

    max-width:
      72px !important;
  }


  /* PÁGINA 1 */

  .r8gReiColDate{
    width:
      82px !important;

    min-width:
      82px !important;

    max-width:
      82px !important;
  }


  .r8gReiColSupplies{
    width:
      calc(
        100cqw - 154px
      ) !important;

    min-width:
      calc(
        100cqw - 154px
      ) !important;

    max-width:
      calc(
        100cqw - 154px
      ) !important;
  }


  /* PÁGINA 2 */

  .r8gReiColMeter{
    width:
      calc(
        46cqw - 33px
      ) !important;

    min-width:
      calc(
        46cqw - 33px
      ) !important;

    max-width:
      calc(
        46cqw - 33px
      ) !important;
  }


  .r8gReiColBalance{
    width:
      calc(
        54cqw - 39px
      ) !important;

    min-width:
      calc(
        54cqw - 39px
      ) !important;

    max-width:
      calc(
        54cqw - 39px
      ) !important;
  }


  /* PÁGINA 3 */

  .r8gReiColSbbt{
    width:
      calc(
        40cqw - 29px
      ) !important;

    min-width:
      calc(
        40cqw - 29px
      ) !important;

    max-width:
      calc(
        40cqw - 29px
      ) !important;
  }


  .r8gReiColEvolution{
    width:
      calc(
        60cqw - 43px
      ) !important;

    min-width:
      calc(
        60cqw - 43px
      ) !important;

    max-width:
      calc(
        60cqw - 43px
      ) !important;
  }


  /*
   * Snap únicamente en inicios de página.
   */

  .r8gReiTable thead
  th:nth-child(2),

  .r8gReiTable thead
  th:nth-child(4),

  .r8gReiTable thead
  th:nth-child(6){
    scroll-snap-align:
      start !important;

    scroll-snap-stop:
      always !important;

    scroll-margin-left:
      72px !important;
  }


  /* ==========================================================
     HISTÓRICO MÓVIL
     ========================================================== */

  .r8gReiEvolutionWithHistory{
    gap:5px;
  }


  .r8gReiHistoryToggle{
    min-width:39px;
    height:25px;

    gap:3px;

    padding:
      0
      5px;

    font-size:7px;
  }


  .r8gReiHistorySymbol{
    width:17px;
    height:17px;

    font-size:13px;
  }


  .r8gReiHistoryBadge{
    min-height:16px;

    padding:
      0
      5px;

    font-size:5.5px;
  }


  .r8gReiHistoryLabel{
    font-size:5.5px;
  }


}
@container sigos-rei-golden (min-width: 641px) {


  .r8gReiFilters{
    align-items:center !important;
  }

  .r8gReiRangeSwiperV3B{
    align-items:center !important;
  }

  .r8gReiFixedFiltersV3B{
    align-items:center !important;
  }


}
@container sigos-rei-golden (max-width: 640px) {


  /* ----------------------------------------------------------
     FILTROS
     ---------------------------------------------------------- */

  .r8gReiRangeSwiperV3B{
    gap:4px !important;
    padding:0 8px 0 0 !important;
  }

  .r8gReiRangePageV3B
  .r8gReiChip{
    padding:0 8px !important;
    font-size:6.15px !important;
  }


  /* ----------------------------------------------------------
     KPI / TOOLBAR
     ---------------------------------------------------------- */

  .r8gReiFixedFiltersV3B{
    gap:4px !important;
  }

  .r8gReiFixedFiltersV3B
  .r8gReiEvolution{
    font-size:5.7px !important;
  }

  .r8gReiFixedFiltersV3B
  .r8gReiApply{
    font-size:6.1px !important;
  }


  /* ----------------------------------------------------------
     TABLA
     Se conserva el sistema de vistas,
     pero se redistribuye mejor el espacio.
     ---------------------------------------------------------- */

  .r8gReiTableViewport.r8fTableViewport{
    padding-right:8px !important;
  }

  .r8gReiTable{
    table-layout:fixed !important;
  }

  .r8gReiTable thead th,
  .r8gReiTable tbody td{
    padding:8px 7px !important;
    vertical-align:top !important;
  }

  .r8gReiTable tbody tr{
    height:auto !important;
  }

  .r8gReiTable tbody td{
    overflow:visible !important;
  }

  .r8gReiTable .r8gReiSticky{
    padding:8px 7px !important;
  }

  .r8gReiMtCode{
    font-size:8px !important;
    line-height:1.05 !important;
  }

  .r8gReiMtSub{
    font-size:5px !important;
    line-height:1.15 !important;
  }

  .r8gReiDate{
    font-size:7px !important;
    line-height:1.1 !important;
  }


  /* ----------------------------------------------------------
     Rebalanceo de columnas móviles
     Más espacio a Balance, SBBT y Evolución
     ---------------------------------------------------------- */

  .r8gReiColMeter{
    width:calc(42cqw - 30px) !important;
    min-width:calc(42cqw - 30px) !important;
    max-width:calc(42cqw - 30px) !important;
  }

  .r8gReiColBalance{
    width:calc(58cqw - 42px) !important;
    min-width:calc(58cqw - 42px) !important;
    max-width:calc(58cqw - 42px) !important;
  }

  .r8gReiColSbbt{
    width:calc(34cqw - 25px) !important;
    min-width:calc(34cqw - 25px) !important;
    max-width:calc(34cqw - 25px) !important;
  }

  .r8gReiColEvolution{
    width:calc(66cqw - 47px) !important;
    min-width:calc(66cqw - 47px) !important;
    max-width:calc(66cqw - 47px) !important;
  }


  /* ----------------------------------------------------------
     Legibilidad interna en columnas pesadas
     ---------------------------------------------------------- */

  .r8gReiTable tbody td:nth-child(4),
  .r8gReiTable tbody td:nth-child(5),
  .r8gReiTable tbody td:nth-child(6),
  .r8gReiTable tbody td:nth-child(7){
    font-size:6px !important;
    line-height:1.18 !important;
  }

  .r8gReiTable tbody td:nth-child(4) *,
  .r8gReiTable tbody td:nth-child(5) *,
  .r8gReiTable tbody td:nth-child(6) *,
  .r8gReiTable tbody td:nth-child(7) *{
    overflow:visible !important;
    text-overflow:clip !important;
    white-space:normal !important;
    overflow-wrap:anywhere !important;
    word-break:normal !important;
  }


  /* Los chips/insignias deben seguir compactos */

  .r8gReiTable tbody td:nth-child(5) button,
  .r8gReiTable tbody td:nth-child(6) button,
  .r8gReiTable tbody td:nth-child(7) button,
  .r8gReiTable tbody td:nth-child(5) .r8gReiHistoryToggle,
  .r8gReiTable tbody td:nth-child(6) .r8gReiHistoryToggle,
  .r8gReiTable tbody td:nth-child(7) .r8gReiHistoryToggle{
    white-space:nowrap !important;
  }


  /* ----------------------------------------------------------
     Ajustes finos de histórico en móvil
     ---------------------------------------------------------- */

  .r8gReiHistoryBadge{
    font-size:5.6px !important;
  }

  .r8gReiHistoryLabel{
    font-size:5.4px !important;
    line-height:1.1 !important;
  }

  .r8gReiHistoryToggle{
    min-width:39px !important;
    height:25px !important;
    font-size:7px !important;
  }

  .r8gReiHistorySymbol{
    width:17px !important;
    height:17px !important;
    font-size:13px !important;
  }


}
@container sigos-rei-golden (max-width: 640px) {


  /* NO tocar buscador ni botón Buscar */
  /* Solo hacer la tabla realmente usable */

  .r8gReiTableViewport.r8fTableViewport{
    overflow-x:auto !important;
    overflow-y:hidden !important;
    -webkit-overflow-scrolling:touch !important;
    padding-bottom:10px !important;
    padding-right:0 !important;
  }

  .r8gReiTable{
    width:1120px !important;
    min-width:1120px !important;
    max-width:none !important;
    table-layout:fixed !important;
    border-collapse:separate !important;
    border-spacing:0 !important;
  }

  .r8gReiTable thead th,
  .r8gReiTable tbody td{
    white-space:normal !important;
    overflow:visible !important;
    text-overflow:clip !important;
    overflow-wrap:anywhere !important;
    word-break:normal !important;
    vertical-align:top !important;
    padding:10px 10px !important;
    font-size:11px !important;
    line-height:1.22 !important;
  }

  .r8gReiTable th:nth-child(1),
  .r8gReiTable td:nth-child(1){
    width:110px !important;
    min-width:110px !important;
    max-width:110px !important;
  }

  .r8gReiTable th:nth-child(2),
  .r8gReiTable td:nth-child(2){
    width:145px !important;
    min-width:145px !important;
    max-width:145px !important;
  }

  .r8gReiTable th:nth-child(3),
  .r8gReiTable td:nth-child(3){
    width:170px !important;
    min-width:170px !important;
    max-width:170px !important;
  }

  .r8gReiTable th:nth-child(4),
  .r8gReiTable td:nth-child(4){
    width:250px !important;
    min-width:250px !important;
    max-width:250px !important;
  }

  .r8gReiTable th:nth-child(5),
  .r8gReiTable td:nth-child(5){
    width:230px !important;
    min-width:230px !important;
    max-width:230px !important;
  }

  .r8gReiTable th:nth-child(6),
  .r8gReiTable td:nth-child(6){
    width:165px !important;
    min-width:165px !important;
    max-width:165px !important;
  }

  .r8gReiTable th:nth-child(7),
  .r8gReiTable td:nth-child(7){
    width:210px !important;
    min-width:210px !important;
    max-width:210px !important;
  }

  .r8gReiTable th:first-child,
  .r8gReiTable td:first-child,
  .r8gReiTable .r8gReiSticky{
    position:sticky !important;
    left:0 !important;
    z-index:3 !important;
    background:inherit !important;
  }

  .r8gReiMtCode{
    font-size:14px !important;
    line-height:1.05 !important;
    font-weight:900 !important;
  }

  .r8gReiMtSub{
    font-size:10px !important;
    line-height:1.15 !important;
  }

  .r8gReiDate{
    font-size:12px !important;
    line-height:1.1 !important;
  }

  .r8gReiHistoryBadge{
    font-size:9px !important;
    line-height:1 !important;
  }

  .r8gReiHistoryLabel{
    font-size:10px !important;
    line-height:1.1 !important;
  }

  .r8gMrMismatchChip{
    height:38px !important;
    padding:0 12px !important;
    font-size:12px !important;
  }

  .r8gMrMismatchCount{
    min-width:22px !important;
    height:22px !important;
    font-size:12px !important;
  }


}
@container sigos-rei-golden (min-width: 641px) {


  .r8gReiFilters,
  .r8gReiRangeSwiperV3B,
  .r8gReiFixedFiltersV3B{
    align-items:center !important;
  }

  .r8gMrMismatchChip{
    height:42px !important;
  }


}
@container sigos-rei-golden (min-width: 641px) {


  .r8gReiFixedFiltersV3B{
    display:flex !important;

    flex-direction:row !important;
    flex-wrap:nowrap !important;

    align-items:center !important;

    width:auto !important;
    min-width:0 !important;
    max-width:none !important;

    gap:6px !important;
  }


  .r8gSpecialFilterViewportV3F{
    width:auto !important;

    overflow:visible !important;
  }


  .r8gSpecialFilterTrackV3F{
    display:flex !important;

    flex-direction:row !important;
    flex-wrap:nowrap !important;

    align-items:center !important;

    gap:6px !important;
  }


  .r8gSpecialFilterTrackV3F
  .r8gReiEvolution,

  .r8gSpecialFilterChipV3F{
    width:auto !important;
    min-width:max-content !important;

    height:37px !important;
    min-height:37px !important;

    padding:
      0
      12px !important;

    font-size:
      10px !important;
  }


  .r8gReiFixedFiltersV3B
  .r8gReiApply{
    flex:0 0 auto !important;

    width:auto !important;
    min-width:max-content !important;

    height:37px !important;
    min-height:37px !important;

    padding:
      0
      15px !important;
  }


}
@container sigos-rei-golden (max-width: 640px) {


  .r8gReiFilters{
    grid-template-columns:
      minmax(0,1fr)
      174px !important;

    gap:4px !important;
  }


  .r8gReiFixedFiltersV3B{
    display:grid !important;

    grid-template-columns:
      124px
      46px !important;

    grid-template-rows:
      26px !important;

    align-items:center !important;

    width:174px !important;
    min-width:174px !important;
    max-width:174px !important;

    height:26px !important;

    gap:4px !important;

    margin:0 !important;
    padding:0 !important;
  }


  /* SWIPE INDEPENDIENTE */

  .r8gSpecialFilterViewportV3F{
    grid-column:1 !important;
    grid-row:1 !important;

    width:124px !important;
    min-width:124px !important;
    max-width:124px !important;

    height:26px !important;

    overflow-x:auto !important;
    overflow-y:hidden !important;

    scroll-snap-type:
      x
      mandatory !important;

    scroll-padding-inline:
      0 !important;

    overscroll-behavior-x:
      contain;

    -webkit-overflow-scrolling:
      touch;

    scrollbar-width:none;

    border-radius:
      999px;
  }


  .r8gSpecialFilterViewportV3F::-webkit-scrollbar{
    display:none;
  }


  .r8gSpecialFilterTrackV3F{
    display:flex !important;

    flex-direction:row !important;
    flex-wrap:nowrap !important;

    align-items:center !important;

    width:max-content !important;

    height:26px !important;

    gap:0 !important;
  }


  /*
   * Cada filtro ocupa exactamente
   * el mismo slot de 124px.
   */

  .r8gSpecialFilterTrackV3F
  .r8gReiEvolution,

  .r8gSpecialFilterChipV3F{
    flex:
      0
      0
      124px !important;

    width:124px !important;
    min-width:124px !important;
    max-width:124px !important;

    height:26px !important;
    min-height:26px !important;
    max-height:26px !important;

    display:flex !important;

    align-items:center !important;
    justify-content:center !important;

    gap:3px !important;

    margin:0 !important;

    padding:
      0
      4px !important;

    border-radius:
      999px !important;

    font-size:
      5.6px !important;

    line-height:
      1 !important;

    white-space:
      nowrap !important;

    scroll-snap-align:
      start !important;

    scroll-snap-stop:
      always !important;
  }


  .r8gSpecialFilterTrackV3F
  .r8gReiChipCount{
    flex:
      0
      0
      15px !important;

    width:15px !important;
    min-width:15px !important;
    max-width:15px !important;

    height:15px !important;
    min-height:15px !important;

    font-size:
      5.5px !important;
  }


  /*
   * Aplicar siempre visible.
   */

  .r8gReiFixedFiltersV3B
  .r8gReiApply{
    grid-column:2 !important;
    grid-row:1 !important;

    width:46px !important;
    min-width:46px !important;
    max-width:46px !important;

    height:26px !important;
    min-height:26px !important;

    margin:0 !important;

    padding:0 !important;

    font-size:
      6px !important;
  }


}