﻿:root {
    --ColorTextPrimary: rgba(0, 0, 0, 1);
    --ColorTextSecundary: rgba(0, 0, 0, 0.5);
    --ColorTextSecundary55: rgba(0, 0, 0, 0.55);
    --ColorTextDisabled: rgba(0, 0, 0, 0.25);
    --ColorTextInverted: rgba(255, 255, 255, 1);
    --ColorBackgroundPrimary: rgba(237, 237, 237, 1);
    --ColorBackgroundSecondary: rgba(245, 245, 245, 1);
    --ColorBackgroundWhite: rgba(255, 255, 255, 1);
    --ColorFeedbackPositive: rgba(0, 166, 80, 1);
    --ColorFeedbackCaution: rgba(255, 119, 51, 1);
    --ColorFeedbackNegative: rgba(242, 61, 79, 1);
    --ColorBrandColorMP: rgba(255, 230, 0, 1);
    --ColorBrandColorBlueML150: rgba(71, 154, 209, 1);
    --ColorAccentLink: rgba(52, 131, 250, 1);
    --ColorFondoMenuActive: rgba(65, 137, 230, 0.15)
}

body {
    background: var(--ColorBackgroundPrimary)
}

.aside-menu .menu-nav > .menu-item:not(.menu-item-parent):not(.menu-item-open):not(.menu-item-here):not(.menu-item-active):hover > .menu-heading .menu-text, .aside-menu .menu-nav > .menu-item:not(.menu-item-parent):not(.menu-item-open):not(.menu-item-here):not(.menu-item-active):hover > .menu-link .menu-text {
    color: var(--ColorMenu)
}

.btnPrimary {
    border-color: var(--ColorAccentLink) !important;
    color: #fff;
    background-color: var(--ColorAccentLink) !important
}

.k-button-primary, .k-button.k-primary {
    border-color: var(--ColorAccentLink);
    color: #fff;
    background-color: var(--ColorAccentLink);
    border-radius: .42rem
}

.k-button-secondary, .k-button.k-secondary {
    border-color: var(--ColorIconoMenu);
    color: #fff;
    background-color: var(--ColorIconoMenu);
    border-radius: .42rem
}

.btn-descarga {
    color: var(--ColorAccentLink) !important;
    border: 1px solid var(--ColorAccentLink) !important;
    background: transparent !important;
    border-radius: 0.42rem !important
}

.btn.btn-primary {
    color: #FFFFFF !important;
    background-color: var(--ColorAccentLink) !important;
    border-color: var(--ColorAccentLink) !important
}

.btn-check:checked + .btn-primary, .btn-primary.active, .btn-primary.show, .btn-primary:first-child:active, :not(.btn-check) + .btn-primary:active {
    color: #FFFFFF !important;
    background-color: var(--ColorAccentLink) !important;
    border-color: var(--ColorAccentLink) !important
}

.k-pager-numbers .k-link.k-state-selected {
    border-color: var(--ColorAccentLink) !important;
    color: #ffffff !important;
    background-color: var(--ColorAccentLink) !important
}

.k-pager-nav.k-link, .k-pager-refresh {
    border-color: #dee2e6;
    color: var(--ColorAccentLink) !important;
    background-color: #fff
}

.k-pager-numbers .k-link {
    border-color: #dee2e6;
    color: var(--ColorAccentLink) !important;
    background-color: #fff
}

.k-switch-on .k-switch-container {
    border-color: var(--ColorAccentLink) !important;
    background-color: var(--ColorAccentLink) !important
}

.nav .show > .nav-link, .nav .nav-link:hover:not(.disabled), .nav .nav-link.active {
    color: var(--ColorAccentLink) !important
}

.nav.nav-tabs.nav-tabs-line .nav-link:hover:not(.disabled), .nav.nav-tabs.nav-tabs-line .nav-link.active, .nav.nav-tabs.nav-tabs-line .show > .nav-link {
    background-color: #fff0;
    border: 0;
    border-bottom: 1px solid var(--ColorAccentLink) !important;
    -webkit-transition: color 0.15s ease,background-color 0.15s ease,border-color 0.15s ease,-webkit-box-shadow 0.15s ease;
    transition: color 0.15s ease,background-color 0.15s ease,border-color 0.15s ease,-webkit-box-shadow 0.15s ease;
    transition: color 0.15s ease,background-color 0.15s ease,border-color 0.15s ease,box-shadow 0.15s ease;
    transition: color 0.15s ease,background-color 0.15s ease,border-color 0.15s ease,box-shadow 0.15s ease,-webkit-box-shadow 0.15s ease
}

.switch input:checked ~ span:after {
    opacity: 1;
    color: #fff;
    background-color: var(--ColorAccentLink) !important
}

.table-active, .table-active > th, .table-active > td {
    background-color: #F8F9FA !important;
    --bs-table-accent-bg: transparent !important
}

.aside-menu .menu-nav > .menu-item.menu-item-active > .menu-heading, .aside-menu .menu-nav > .menu-item.menu-item-active > .menu-link {
    background-color: var(--ColorFondoMenuActive)
}

.version {
    color: darkgrey;
    bottom: 0;
    position: absolute;
    text-align: center;
    width: 100%
}

.aside-menu .menu-nav > .menu-item.menu-item-active > .menu-heading .menu-text, .aside-menu .menu-nav > .menu-item.menu-item-active > .menu-link .menu-text {
    color: var(--ColorAccentLink) !important;
    font-weight: 600 !important;
    font-size: 16px !important;
    text-transform: initial
}

.aside-menu .menu-nav > .menu-item > .menu-heading .menu-text, .aside-menu .menu-nav > .menu-item > .menu-link .menu-text {
    color: var(--ColorTextSecundary) !important;
    font-weight: 600 !important;
    font-size: 16px !important;
    text-transform: initial
}

.aside-menu .menu-nav > .menu-item.menu-item-active > .menu-heading .menu-icon.svg-icon svg g [fill], .aside-menu .menu-nav > .menu-item.menu-item-active > .menu-link .menu-icon.svg-icon svg g [fill] {
    fill: var(--ColorAccentLink) !important
}

.svg-icon.svg-icon-primary svg g [fill] {
    fill: var(--ColorTextSecundary) !important
}

.textColorSecondary {
    color: var(--ColorTextSecundary55) !important
}

.k-button-primary, .k-button.k-primary, .k-button-primary.k-state-hover, .k-state-hover.k-button.k-primary {
    border-color: var(--ColorAccentLink);
    background-color: var(--ColorAccentLink)
}

.btnMenuSalir {
    color: var(--ColorAccentLink);
    border: 0;
    background-color: #fff0
}

.btn-refrescar {
    color: var(--ColorAccentLink) !important;
    border: 1px solid var(--ColorAccentLink) !important;
    background: transparent !important;
    border-radius: 0.42rem !important
}

    .btn-refrescar:hover {
        color: white !important;
        background-color: var(--ColorAccentLink) !important
    }

.aside-menu .menu-nav > .menu-item:not(.menu-item-parent):not(.menu-item-open):not(.menu-item-here):not(.menu-item-active):hover > .menu-heading .menu-icon, .aside-menu .menu-nav > .menu-item:not(.menu-item-parent):not(.menu-item-open):not(.menu-item-here):not(.menu-item-active):hover > .menu-link .menu-icon {
    color: var(--ColorTextPrimary);
    opacity: .5
}

.aside-menu .menu-nav > .menu-item > .menu-heading .menu-icon, .aside-menu .menu-nav > .menu-item > .menu-link .menu-icon {
    color: var(--ColorTextPrimary)
}

.nav .show > .nav-link, .nav .nav-link:hover:not(.disabled), .nav .nav-link {
    color: var(--ColorTextDisabled) !important
}

svg {
    fill: var(--ColorAccentLink) !important
}

.toast.toast-info {
    background-color: var(--ColorAccentLink) !important;
    color: #fff
}

.loader-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgb(255 255 255 / .6);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1000
}

.k-toolbar {
    justify-content: flex-end !important
}

.btnOutlinePrimary {
    color: var(--ColorAccentLink);
    background-color: rgb(65 134 230 / .15)
}

    .btnOutlinePrimary :hover {
        background-color: rgb(65 134 230 / .5) !important
    }

#ModalCrearReporte .k-textbox.form-control {
    height: 48px !important;
    font-family: 'Proxima Nova',sans-serif !important;
    font-size: 16px !important;
    border-radius: 6px !important;
    padding: 0 12px !important;
    border: 1px solid #ccc !important;
    box-shadow: none !important
}

.modal-header {
    border-bottom: none !important;
    padding-bottom: 0.5rem !important
}

.modal-title {
    font-family: 'Proxima Nova',sans-serif !important;
    font-weight: 600 !important;
    font-size: 20px !important;
    line-height: 25px !important;
    letter-spacing: 0 !important;
    margin: 0 !important
}

.modal-subtitle {
    font-family: 'Proxima Nova',sans-serif !important;
    font-weight: 400 !important;
    font-size: 14px !important;
    line-height: 18px !important;
    letter-spacing: 0 !important;
    margin-top: 4px !important;
    color: #6c757d !important
}

.modal-body p, .modal-body label {
    font-family: 'Proxima Nova',sans-serif !important;
    font-weight: 400 !important;
    font-size: 16px !important;
    line-height: 20px !important;
    letter-spacing: 0 !important;
    margin-bottom: 12px !important
}

.modal-footer {
    border-top: none !important;
    justify-content: flex-end !important
}

    .modal-footer .btn-primary {
        height: 48px !important;
        font-family: 'Proxima Nova',sans-serif !important;
        font-size: 16px !important
    }

    .modal-footer .btn-secondary {
        height: 48px !important;
        font-family: 'Proxima Nova',sans-serif !important;
        font-size: 16px !important
    }

#ModalHistorialDescargas .k-grid {
    background: #fff0;
    border: none;
    font-family: inherit;
    font-size: 1rem
}

    #ModalHistorialDescargas .k-grid table {
        border-collapse: collapse !important;
        width: 100% !important
    }

#ModalHistorialDescargas .k-grid-header th {
    background-color: #f8f9fa !important;
    color: #212529 !important;
    border: 1px solid #dee2e6 !important;
    padding: .75rem !important;
    font-weight: 500;
    text-align: left;
    vertical-align: middle
}

#ModalHistorialDescargas .k-grid .k-grid-table td span {
    font-family: "Proxima Nova",sans-serif;
    font-weight: 600;
    font-size: 14px;
    line-height: 18px;
    letter-spacing: 0%;
    vertical-align: middle
}

#ModalHistorialDescargas .k-grid .k-grid-table td button {
    font-family: Proxima Nova;
    font-weight: 600;
    font-size: 14px;
    line-height: 18px;
    letter-spacing: 0%;
    vertical-align: middle
}

#ModalHistorialDescargas .k-grid-header .k-icon {
    margin-left: .25rem
}

#ModalHistorialDescargas .k-grid-content td {
    border: 1px solid #dee2e6 !important;
    padding: .75rem !important;
    vertical-align: middle
}

#ModalHistorialDescargas .k-grid-content tr:hover {
    background-color: #f1f3f5 !important
}

#ModalHistorialDescargas .k-pager-wrap {
    padding: .5rem;
    background-color: #fff;
    border-top: 1px solid #dee2e6
}

#ModalHistorialDescargas .k-pager-numbers .k-link {
    border: 1px solid #dee2e6 !important;
    color: var(--ColorAccentLink) !important;
    padding: .375rem .75rem;
    border-radius: .25rem;
    background-color: #fff
}

    #ModalHistorialDescargas .k-pager-numbers .k-link.k-state-selected {
        background-color: var(--ColorAccentLink) !important;
        color: #fff !important;
        border-color: var(--ColorAccentLink) !important
    }

    #ModalHistorialDescargas .k-pager-numbers .k-link:hover {
        background-color: #e9ecef !important
    }

#ModalHistorialDescargas .k-pager-nav .k-link {
    border: 1px solid #dee2e6 !important;
    padding: .375rem .75rem;
    border-radius: .25rem;
    background-color: #fff
}

    #ModalHistorialDescargas .k-pager-nav .k-link:hover {
        background-color: #e9ecef !important
    }

#ModalHistorialDescargas .k-grid .k-alt {
    background-color: white !important
}

#ModalHistorialDescargas .k-grid-header th {
    background-color: #f8f9fa !important;
    color: #212529 !important;
    border: 1px solid #dee2e6 !important;
    padding: .75rem !important;
    text-align: left;
    vertical-align: middle;
    font-family: 'Proxima Nova',sans-serif;
    font-weight: 600;
    font-style: normal;
    font-size: 14px;
    line-height: 18px;
    letter-spacing: 0
}

#ModalHistorialDescargas .k-grid-toolbar {
    border-color: transparent !important
}

#ModalHistorialDescargas .k-grid-content {
    overflow-x: hidden !important
}

.toast-message {
    font-family: Proxima Nova;
    font-weight: 400;
    font-style: normal;
    font-size: 16px !important;
    line-height: 20px;
    letter-spacing: 0%;
    vertical-align: middle
}

.toast {
    max-width: 650px !important;
    height: 64px !important;
    align-content: center !important
}

#toast-container.toast-top-center > div, #toast-container.toast-bottom-center > div {
    width: 600px !important
}

.toast.toast-success {
    background-color: #00A650
}

#ModalHistorialDescargas .modal-header {
    margin: 0 48px;
    padding: 24px 0 0 0px !important
}

#ModalHistorialDescargas .modal-body {
    padding: 0;
    margin: 32px 48px 30px 48px
}

#ModalHistorialDescargas .modal-footer {
    padding: 0;
    margin: 0 48px 48px 48px
}

#ModalHistorialDescargas .btn-link:disabled {
    color: rgb(0 0 0 / .25) !important;
    pointer-events: none
}

.label.label-light-success {
    color: #00A650 !important;
    background-color: rgb(0 166 80 / .1) !important
}

.label.label-light-warning {
    color: #FF7733 !important;
    background-color: rgb(255 119 51 / .1) !important
}
