@layer xone-reset, xone-base, xone-responsive, xone-layout, xone-components, xone-project;
@layer xone-project {
.xone-coll {
    notab: true;
    show-toolbar: false;
    group-swipe: false;
    editmask: 0;
    dependent: false;
    check-owner: false;
    cell-bgcolor: #FFFFFF;
    cell-border-width: 0;
    cell-border: false;
    cell-even-color: #FFFFFF;
    cell-odd-color: #F5F7FA;
    cell-height: calc(80 * var(--xone-p-unit, 1px));
    cell-tpadding: calc(4 * var(--xone-p-unit, 1px));
    cell-bpadding: calc(4 * var(--xone-p-unit, 1px));
}

.xone-frame {
    border: none;
    background-color: #00000000;
}

.xone-prop {
    font-size: calc((8 + 10) * var(--xone-font-unit, 1px));
    labelbox: false;
    label-wrap: true;
    text-border: false;
    width: 96%;
    margin-left: 2%;
    lines: 1;
    fixed-lines: true;
}

.xone-prop-b {
    color: #FFFFFF;
    background-color: #1A237E;
    border-radius: calc(8 * var(--xone-p-unit, 1px));
    ripple-effect: true;
    forecolor-disabled: #ADAA9C;
    bgcolor-disabled: #C6CEC6;
    forecolor-pressed: #FFFFFF;
    bgcolor-pressed: #0D1642;
}

.xone-prop-nc {
    apply-css: true;
}

.xone-prop-z {
    font-size: calc((8 + 10) * var(--xone-font-unit, 1px));
    labelbox: false;
    label-wrap: true;
    text-border: false;
    width: 96%;
    margin-left: 2%;
    lines: 1;
    fixed-lines: true;
    background-color: #F5F7FA;
    margin-top: 2%;
}

.frameHeader {
    width: 100%;
    height: calc(140 * var(--xone-p-unit, 1px));
    background-color: #1A237E;
    --xone-align: center;
}

.frameBody {
    width: 100%;
    height: -2;
    scroll: true;
    background-color: #F5F7FA;
}

.frameFooter {
    width: 100%;
    height: calc(100 * var(--xone-p-unit, 1px));
    background-color: #F5F7FA;
    --xone-align: center;
}

.groupNoTab {
    tab-visible: false;
}

.btnPrimario {
    width: 90%;
    height: calc(50 * var(--xone-p-unit, 1px));
    background-color: #1A237E;
    color: #FFFFFF;
    border-radius: calc(8 * var(--xone-p-unit, 1px));
    text-align: center;
    font-size: calc((8 + 14) * var(--xone-font-unit, 1px));
    --xone-align: center;
    ripple-effect: true;
}

.btnSecundario {
    width: 90%;
    height: calc(50 * var(--xone-p-unit, 1px));
    background-color: #546E7A;
    color: #FFFFFF;
    border-radius: calc(8 * var(--xone-p-unit, 1px));
    text-align: center;
    font-size: calc((8 + 14) * var(--xone-font-unit, 1px));
    --xone-align: center;
    ripple-effect: true;
}

.btnPeligro {
    width: 90%;
    height: calc(50 * var(--xone-p-unit, 1px));
    background-color: #D32F2F;
    color: #FFFFFF;
    border-radius: calc(8 * var(--xone-p-unit, 1px));
    text-align: center;
    font-size: calc((8 + 14) * var(--xone-font-unit, 1px));
    --xone-align: center;
    ripple-effect: true;
}

.btnExito {
    width: 90%;
    height: calc(50 * var(--xone-p-unit, 1px));
    background-color: #2E7D32;
    color: #FFFFFF;
    border-radius: calc(8 * var(--xone-p-unit, 1px));
    text-align: center;
    font-size: calc((8 + 14) * var(--xone-font-unit, 1px));
    --xone-align: center;
    ripple-effect: true;
}

.btnTransparente {
    background-color: #00000000;
    color: #1A237E;
    font-size: calc((8 + 14) * var(--xone-font-unit, 1px));
    text-align: center;
}

.btnIcono {
    width: calc(48 * var(--xone-p-unit, 1px));
    height: calc(48 * var(--xone-p-unit, 1px));
    background-color: #00000000;
    ripple-effect: true;
    labelwidth: 0;
}

.btnMenuCard {
    width: 46%;
    height: calc(120 * var(--xone-p-unit, 1px));
    background-color: #FFFFFF;
    color: #37474F;
    border-radius: calc(12 * var(--xone-p-unit, 1px));
    font-size: calc((8 + 12) * var(--xone-font-unit, 1px));
    text-align: center;
    --xone-align: center;
    margin-top: calc(8 * var(--xone-p-unit, 1px));
    elevation: 2;
    ripple-effect: true;
}

.textoTitulo {
    font-size: calc((8 + 18) * var(--xone-font-unit, 1px));
    color: #212121;
    text-align: center;
    font-weight: bold;
    labelwidth: 0;
}

.textoSubtitulo {
    font-size: calc((8 + 14) * var(--xone-font-unit, 1px));
    color: #757575;
    text-align: center;
    labelwidth: 0;
}

.textoSecundario {
    font-size: calc((8 + 12) * var(--xone-font-unit, 1px));
    color: #9E9E9E;
    text-align: center;
    labelwidth: 0;
}

.textoHeaderBlanco {
    font-size: calc((8 + 20) * var(--xone-font-unit, 1px));
    color: #FFFFFF;
    font-weight: bold;
    text-align: left;
    labelwidth: 0;
}

.textoHeaderSubBlanco {
    font-size: calc((8 + 13) * var(--xone-font-unit, 1px));
    color: #FFFFFFB3;
    text-align: left;
    labelwidth: 0;
}

.textoEditable {
    labelwidth: 0;
    text-border: true;
    text-border-bottom: true;
    text-border-left: false;
    text-border-right: false;
    text-border-top: false;
    text-border-color: #BDBDBD;
    padding-left: calc(10 * var(--xone-p-unit, 1px));
}

.textoConTooltip {
    labelwidth: 0;
    border-radius: calc(8 * var(--xone-p-unit, 1px));
    floating-tooltip: true;
    tooltip-forecolor: #757575;
    --xone-floating-label-color: #757575;
    expanded-hint-color-focus: #1A237E;
    show-counter: true;
}

.frameKpiCard {
    width: 47%;
    height: calc(130 * var(--xone-p-unit, 1px));
    background-color: #FFFFFF;
    border-radius: calc(12 * var(--xone-p-unit, 1px));
    margin-top: calc(8 * var(--xone-p-unit, 1px));
    margin-left: 2%;
    elevation: 3;
}

.frameKpiCardFull {
    width: 96%;
    height: calc(130 * var(--xone-p-unit, 1px));
    background-color: #FFFFFF;
    border-radius: calc(12 * var(--xone-p-unit, 1px));
    margin-top: calc(8 * var(--xone-p-unit, 1px));
    margin-left: 2%;
    elevation: 3;
}

.kpiValor {
    font-size: calc((8 + 28) * var(--xone-font-unit, 1px));
    color: #1A237E;
    font-weight: bold;
    text-align: center;
    labelwidth: 0;
    width: 90%;
    --xone-align: center;
}

.kpiLabel {
    font-size: calc((8 + 11) * var(--xone-font-unit, 1px));
    color: #78909C;
    text-align: center;
    labelwidth: 0;
    width: 90%;
    --xone-align: center;
}

.kpiIcono {
    width: calc(36 * var(--xone-p-unit, 1px));
    height: calc(36 * var(--xone-p-unit, 1px));
    --xone-align: center;
    labelwidth: 0;
    margin-top: calc(12 * var(--xone-p-unit, 1px));
}

.kpiTendencia {
    font-size: calc((8 + 10) * var(--xone-font-unit, 1px));
    color: #2E7D32;
    text-align: center;
    labelwidth: 0;
    width: 90%;
    --xone-align: center;
}

.kpiTendenciaNeg {
    font-size: calc((8 + 10) * var(--xone-font-unit, 1px));
    color: #D32F2F;
    text-align: center;
    labelwidth: 0;
    width: 90%;
    --xone-align: center;
}

.listado {
    grid-bgcolor: #00000000;
    grid-text-bgcolor: #00000000;
    show-toolbar: false;
    check-owner: false;
    dependent: false;
    show-selected-item: false;
}

.chartBarras {
    width: 94%;
    height: calc(300 * var(--xone-p-unit, 1px));
    margin-left: 3%;
    chart-lock-x-axis: true;
    chart-lock-y-axis: true;
    show-legend: true;
    fontsize-legend: 8;
    chart-show-series-item-labels: true;
    chart-series-item-label-format: ##VALUE##;
}

.chartPastel {
    width: 94%;
    height: calc(300 * var(--xone-p-unit, 1px));
    margin-left: 3%;
    show-legend: true;
    fontsize-legend: 8;
    chart-show-series-item-labels: true;
}

.chartLineas {
    width: 94%;
    height: calc(300 * var(--xone-p-unit, 1px));
    margin-left: 3%;
    chart-lock-x-axis: true;
    chart-lock-y-axis: true;
    show-legend: true;
    fontsize-legend: 8;
    chart-show-series-item-labels: true;
}

.separadorH {
    labelbox: false;
    width: 100%;
    height: calc(1 * var(--xone-p-unit, 1px));
    background-color: #E0E0E0;
    margin-top: calc(5 * var(--xone-p-unit, 1px));
}

.inputForm {
    labelwidth: 0;
    width: 90%;
    height: calc(50 * var(--xone-p-unit, 1px));
    --xone-align: center;
    border-radius: calc(8 * var(--xone-p-unit, 1px));
    floating-tooltip: true;
    tooltip-forecolor: #78909C;
    --xone-floating-label-color: #78909C;
    expanded-hint-color-focus: #1A237E;
    text-border: true;
    text-border-color: #CFD8DC;
    padding-left: calc(12 * var(--xone-p-unit, 1px));
    margin-top: calc(8 * var(--xone-p-unit, 1px));
}

.frameCeldaLista {
    width: 100%;
    height: calc(80 * var(--xone-p-unit, 1px));
    background-color: #FFFFFF;
}

.celdaTitulo {
    font-size: calc((8 + 14) * var(--xone-font-unit, 1px));
    color: #212121;
    font-weight: bold;
    labelwidth: 0;
    text-align: left;
}

.celdaSubtitulo {
    font-size: calc((8 + 11) * var(--xone-font-unit, 1px));
    color: #78909C;
    labelwidth: 0;
    text-align: left;
}

.celdaValor {
    font-size: calc((8 + 14) * var(--xone-font-unit, 1px));
    color: #1A237E;
    font-weight: bold;
    labelwidth: 0;
    text-align: right;
}

.celdaEstado {
    font-size: calc((8 + 10) * var(--xone-font-unit, 1px));
    color: #FFFFFF;
    background-color: #2E7D32;
    border-radius: calc(12 * var(--xone-p-unit, 1px));
    text-align: center;
    labelwidth: 0;
    width: calc(80 * var(--xone-p-unit, 1px));
    height: calc(24 * var(--xone-p-unit, 1px));
}
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
  @view-transition { navigation: none; }
}
/* web-font-display */
@font-face { font-display: swap; }