﻿/* Reemplazamos colores primarios de la plantilla */
:root, [data-bs-theme=light] {
    --bs-primary: #78BE20;
    --bs-primary-active: #4D9100;
    --bs-primary-light: #F3FAEA;
    --bs-primary-inverse: #ffffff;
    --bs-primary-clarity: rgba(120, 190, 32, 0.2);
    --bs-primary-rgb: 120, 190, 32;
    --bs-text-primary: #78BE20;
    --bs-primary-text-emphasis: #2E3F0A;
    --bs-primary-bg-subtle: #e6f4d9;
    --bs-primary-border-subtle: #badc92;
    --bs-link-color: #78BE20;
    --bs-link-color-rgb: 120, 190, 32;
    --bs-link-hover-color: #579b03;
    --bs-link-hover-color-rgb: 87, 155, 3;
    --bs-component-active-bg: #78BE20;
    --bs-component-hover-color: #78BE20;
    --bs-component-checked-bg: #78BE20;
    --bs-gray-100: #f6f6f6;
    --bs-menu-link-color-hover: #78BE20;
    --bs-menu-link-color-show: #78BE20;
    --bs-menu-link-color-here: #78BE20;
    --bs-menu-link-color-active: #78BE20;
    --bs-scrolltop-bg-color: #78BE20;
    --bs-scrolltop-bg-color-hover: #78BE20;
    /* Colores propios */
    --color-comparador1: #2F80ED;
    --color-comparador2: #F2994A;
}

[data-bs-theme=dark] {
    --bs-primary-light: #1A2316;
    --bs-gray-100: #23242b;
}

.nav-line-tabs.nav-line-tabs-2x .nav-item .nav-link.active, .nav-line-tabs.nav-line-tabs-2x .nav-item .nav-link:hover:not(.disabled), .nav-line-tabs.nav-line-tabs-2x .nav-item.show .nav-link {
    color: var(--bs-primary);
    border-bottom-width: 2px;
}

.hover-color-primary:hover,
.hover-color-primary:hover .text-gray-700,
.hover-color-primary:hover .accordion-icon-off {
    color: var(--bs-primary) !important;
    transition: color .2s ease;
}

.hover-color-primary:hover {
    transition: color .2s ease;
}

.link-primary:focus, .link-primary:hover {
    color: RGBA(var(--bs-link-hover-color-rgb,1),var(--bs-link-opacity,1)) !important;
    text-decoration-color: RGBA(var(--bs-link-hover-color-rgb,1),var(--bs-link-underline-opacity,1)) !important
}

table.dataTable.dtr-column.collapsed > tbody > tr.parent > td.dtr-control:before, table.dataTable.dtr-column.collapsed > tbody > tr.parent > th.dtr-control:before, table.dataTable.dtr-inline.collapsed > tbody > tr.parent > td.dtr-control:before, table.dataTable.dtr-inline.collapsed > tbody > tr.parent > th.dtr-control:before {
    background-color: var(--bs-primary);
}

.nav-line-tabs .nav-item .nav-link.active, .nav-line-tabs .nav-item .nav-link:hover:not(.disabled), .nav-line-tabs .nav-item.show .nav-link {
    background-color: transparent;
    border: 0;
    border-bottom: 1px solid var(--bs-primary);
    color: var(--bs-primary);
    transition: color .2s ease
}
.btn.btn-iconNoheigth {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 !important;
    width: calc(1.5em + 1.55rem + 2px);
    line-height: 1;
}

#contenedorSelects{
    max-width: 500px;
}

#TiendaSelect + .select2-container .select2-selection--multiple,
#RegionSelect + .select2-container .select2-selection--multiple {
    display: flex !important;
    flex-wrap: wrap !important;
    white-space: normal !important;
    overflow-x: hidden !important;
    min-height: auto !important;
    height: auto !important;
    align-items: flex-start !important;
    padding: 0.375rem 0.75rem;
}

#TiendaSelect + .select2-container .select2-selection__rendered,
#RegionSelect + .select2-container .select2-selection__rendered {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 4px;
    padding: 0;
    margin: 0;
}
#TiendaSelect + .select2-container .select2-selection__choice,
#RegionSelect + .select2-container .select2-selection__choice {
    white-space: nowrap;
}
#select2-TiendaSelect-container, #select2-RegionSelect-container {
    max-width: 90%;
    min-height: 26.63px;
}

@media (min-width: 576px) {
    #contenedorSelects {
        max-width: 350px;
    }


}

@media (min-width: 668px) {
    #contenedorSelects {
        max-width: 350px;
    }
}


@media (min-width: 768px) {
    #contenedorSelects {
        max-width: 400px;
    }
}

@media (min-width: 992px) {
    .app-header {
        display: none;
    }

    .app-wrapper {
        margin-top: 0 !important;
    }

    #contenedorSelects {
        max-width: 500px;
    }
}

@media (min-width: 1150px) {

    #contenedorSelects {
        max-width: 600px;
    }

}
@media (min-width: 1300px) {
    #contenedorSelects {
        max-width: 750px;
    }
}
@media (min-width: 1400px) {
    #contenedorSelects {
        max-width: 850px;
    }
}
@media (min-width: 1500px) {
    #contenedorSelects {
        max-width: 950px;
    }
}
@media (min-width: 1600px) {
    #contenedorSelects {
        max-width: 1050px;
    }
}


@media print {

    :root, [data-bs-theme=light] {
        --bs-primary: #78BE20;
        --bs-primary-active: #4D9100;
        --bs-primary-light: #F3FAEA;
        --bs-primary-inverse: #ffffff;
        --bs-primary-clarity: rgba(120, 190, 32, 0.2);
        --bs-primary-rgb: 120, 190, 32;
        --bs-text-primary: #78BE20;
        --bs-primary-text-emphasis: #2E3F0A;
        --bs-primary-bg-subtle: #e6f4d9;
        --bs-primary-border-subtle: #badc92;
        --bs-link-color: #78BE20;
        --bs-link-color-rgb: 120, 190, 32;
        --bs-link-hover-color: #579b03;
        --bs-link-hover-color-rgb: 87, 155, 3;
        --bs-component-active-bg: #78BE20;
        --bs-component-hover-color: #78BE20;
        --bs-component-checked-bg: #78BE20;
        --bs-gray-100: #f6f6f6;
        --bs-text-warning: #F6C000;
        --bs-text-danger: #F8285A;
        --bs-text-dark: #1E2129;
        --bs-text-muted: #99A1B7;
        --bs-text-gray-100: #F9F9F9;
        --bs-text-gray-200: #F1F1F4;
        --bs-text-gray-300: #DBDFE9;
        --bs-text-gray-400: #C4CADA;
        --bs-text-gray-500: #99A1B7;
        --bs-text-gray-600: #78829D;
        --bs-text-gray-700: #4B5675;
        --bs-text-gray-800: #252F4A;
        --bs-text-gray-900: #071437;
        --bs-warning-light: #FFF8DD;
        --bs-info-light: #E9F3FF;
        --bs-danger-light: #FFEEF3;
        --bs-warning: #C59A00;
        --bs-danger: #E42855;
        --bs-code-bg: #f1f3f8;
        --bs-code-shadow: rgba(0, 0, 0, 0.08) 0px 3px 9px 0px;
        --bs-code-border-color: transparent;
        --bs-code-color: #b93993;
        --bs-success-light: #DFFFEA;
        --bs-success: #17C653;
        /* Colores propios */
        --color-comparador1: #2F80ED;
        --color-comparador2: #F2994A;
    }

    .NoMostrarenPDF {
        display: none !important;
    }

    .ImagenaMostrarenPDF {
        max-width: 400px;
        max-height: 300px;
        width: auto;
        height: auto;
        object-fit: contain;
        display: block;
    }


    .saltoPaginaPDF {
        page-break-before: always;
        margin: 0;
    }

    table {
        font-size: 13px !important;
    }

    table tr {
        page-break-inside: avoid;
    }

    #contenedorCabeceraSecciones {
        margin: auto;
    }

    #contenedorCabeceraSecciones > div.col-md-3 {
        flex: 0 0 auto;
        width: 50%
    }

    #contenedorCabeceraSecciones > div.col-md-6 {
        flex: 0 0 auto;
        width: 70%;
        margin: auto;
    }

    #contenedorCabeceraSecciones > div[class*="col-md-"] div.card-body {
        padding: .5rem .75rem;
    }

    div.contenedorTablaPDF > div.card-body {
        padding: 0px .75rem;
    }

    #contenedorCabeceraSecciones > div[class*="col-md-"] > div.card {
        padding: 1rem 1.5rem;
    }

    #kt_app_content {
        padding: 10px 0px;
    }

    .card {
        border: 1px solid #e0e0e0;
        border-radius: 0.475rem;
        box-shadow: 0 0.5rem 1rem rgba(0,0,0,0.05);
        padding: 1.5rem;
        background-color: #fff;
    }

    .card.contenedorTablaPDF {
        border: none;
        border-radius: 0.475rem;
        box-shadow: none;
        padding: 0rem 1.5rem;
        background-color: #fff;
    }

   
    svg.highcharts-root {
        width: 100% !important;
        height: auto !important;
        max-height: none !important;
    }

    .highcharts-container {
        max-width: 100% !important;
        height: auto !important;
    }

    #respuestaVariables .collapse {
        display: block !important;
        height: auto !important; 
        visibility: visible !important;
        overflow: visible !important;
    }

    #acordeonVariables .accordion-item {
        border:none;
    }

    .minwPDF-300 {
        min-width: 300px;
    }

    .maxwPDF-300 {
        max-width: 300px;
    }
   
    .fsPDF-14 {
        font-size: 14px !important;
    }

    .mtPDF-0 {
        margin-top: 0px !important
    }

    .mtPDF-1 {
        margin-top: .25rem !important
    }

    .mtPDF-2 {
        margin-top: .5rem !important
    }

    .mtPDF-3 {
        margin-top: .75rem !important
    }

    .mtPDF-4 {
        margin-top: 1rem !important
    }

    .mtPDF-5 {
        margin-top: 1.25rem !important
    }

    mt-autoPDF {
        margin-top: auto !important
    }

    .align-middlePDF {
        vertical-align: middle !important
    }

    .justify-content-centerPDF {
        justify-content: center !important
    }

    .d-flexPDF {
        display: flex !important
    }

    .mx-autoPDF {
        margin-right: auto !important;
        margin-left: auto !important
    }

    .bullet {
        display: inline-block;
        background-color: #c4cada;
        border-radius: 6px;
        width: 8px;
        height: 4px;
        flex-shrink: 0;
    }

    code:not([class*=language-]) {
        font-weight: 400;
        color: var(--bs-code-color);
        border: 1px solid var(--bs-code-border-color);
        background-color: var(--bs-code-bg);
        border-radius: .3rem;
        line-height: inherit;
        font-size: 1rem;
        padding: .1rem .4rem;
        margin: 0 .5rem;
        box-shadow: 0 3px 9px rgba(0, 0, 0, .08);
    }

    .text-gray-100 {
        color: var(--bs-text-gray-100) !important;
    }
    .text-gray-200 {
        color: var(--bs-text-gray-200) !important;
    }
    .text-gray-300 {
        color: var(--bs-text-gray-300) !important;
    }
    .text-gray-400 {
       color: var(--bs-text-gray-400) !important;
    }
    .text-gray-500 {
        color: var(--bs-text-gray-500) !important;
    }
    .text-gray-600 {
        color: var(--bs-text-gray-600) !important;
    }
    .text-gray-700 {
        color: var(--bs-text-gray-700) !important;
    }
    .text-gray-800 {
        color: var(--bs-text-gray-800) !important;
    }
    .text-gray-900 {
        color: var(--bs-text-gray-900) !important;
    }

    .bg-light-info {
        background-color: var(--bs-info-light) !important
    }

    .bg-light-warning {
        background-color: var(--bs-warning-light) !important
    }
    .badge-light-danger {
        background-color: var(--bs-danger-light);
        color: var(--bs-danger);
    }
    .badge-light-success {
        background-color: var(--bs-success-light);
        color: var(--bs-success);
    }

    .text-muted {
        color: var(--bs-text-muted) !important;
    }
    .fst-italic {
        font-style: italic !important
    }

    .fst-normal {
        font-style: normal !important
    }

    .fw-lighter {
        font-weight: lighter !important
    }

    .fw-light {
        font-weight: 300 !important
    }

    .fw-normal {
        font-weight: 400 !important
    }

    .fw-medium {
        font-weight: 500 !important
    }

    .fw-semibold {
        font-weight: 500 !important
    }

    .fw-bold {
        font-weight: 600 !important
    }

    .fw-bolder {
        font-weight: 700 !important
    }
 
}

.page-helper-bar {
    display: none;
}

.page-helper-bar-on {
    display: block;
}

.page-helper-bar > .card {
    top: -1rem;
    cursor: pointer;
}

.forzarUnderlineHover:hover {
    text-decoration: underline !important;
}

#olaSelect + .select2 .select2-selection {
    padding-right: 2.75rem;
}