﻿/* Inicio material icons estilo */

/* fuente Material Icons */
@font-face {
    font-family: 'Material Icons';
    font-style: normal;
    font-weight: 400;
    src: url(../fonts/MaterialIcons-Regular.eot); /* For IE6-8 */
    src: local('Material Icons'), local('MaterialIcons-Regular'), url(../fonts/MaterialIcons-Regular.woff2) format('woff2'), url(../fonts/MaterialIcons-Regular.woff) format('woff'), url(../fonts/MaterialIcons-Regular.ttf) format('truetype');
}

.material-icons {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 24px; /* Preferred icon size */
    display: inline-block;
    line-height: 1;
    text-transform: none;
    letter-spacing: normal;
    word-wrap: normal;
    white-space: nowrap;
    direction: ltr;
    /* Support for all WebKit browsers. */
    -webkit-font-smoothing: antialiased;
    /* Support for Safari and Chrome. */
    text-rendering: optimizeLegibility;
    /* Support for Firefox. */
    -moz-osx-font-smoothing: grayscale;
    /* Support for IE. */
    font-feature-settings: 'liga';
}

.itemstyle2 .material-icons {
    color: var(--fontColorGridItem);    
}


.alternatingitemstyle2 .material-icons {
    color: var(--fontColor);
}

/* Fin material icons estilo */

/* Inicio estilos genéricos */

.opacity1 {
    opacity: 1;
}

.opacity08 {
    opacity: 0.8;
}

.bgopacity05 {
    background-color: rgba(0,0,0,0.5) !important
}

.bgopacity075 {
    background-color: rgba(0,0,0,0.75) !important
}

.boldFont {
    font-weight: bold;
}

.backgroundColorEmpty {
    background-color: inherit;
}

.whiteColor{
    color: white !important;
}

.margin-0px-auto {
    margin: 0px auto;
}

.mantener-formato-texto {
    white-space: pre-line;
}

.text-align-right {
    text-align:right;
}

.date-column-width {
    min-width: 100px;
}

/* Fin estilos genéricos */

/* Inicio wave animacion estilo */
/* ## Header container */
.header-img {
    height: 50px;
    width: 100%;
    position: relative;
    overflow: hidden;
    background: linear-gradient(#DED91D, #EBE867);
    opacity: var(--bgOpacity);
}

    .header-img img {
        position: absolute;
        right: 10px;
        bottom: 10px;
    }
/* ## Wave config */
.wave {
    background: url('../img/wave.svg') repeat-x;
    position: absolute;
    width: 6400px;
    height: 198px;
    left: -1350px;
    animation: wave 5s cubic-bezier( 0.36, 0.45, 0.63, 0.53) infinite forwards;
    transform: translate3d(0, 0, 0);
}

    .wave:nth-of-type(2) {
        top: -25px;
        left: -1450px;
        opacity: 1;
        animation: wave 5s cubic-bezier( 0.36, 0.45, 0.63, 0.53) -.125s 0.2 forwards, swell 7s ease -1.25s 0.2 forwards;
    }

    .wave:nth-of-type(3) {
        top: -25px;
        left: -1300px;
        opacity: 1;
        animation-play-state: paused;
    }

    .wave:nth-of-type(4) {
        top: -25px;
        left: -1350px;
        opacity: 1;
        animation-play-state: paused;
    }

.wave_paused {
    animation-play-state: paused;
}
/* ## Keyframes */
@keyframes wave {
    0% {
        margin-left: 0;
    }

    100% {
        margin-left: -1600px;
    }
}

@keyframes swell {
    0%, 100% {
        transform: translate3d(0,-25px,0);
    }

    50% {
        transform: translate3d(0,5px,0);
    }
}

/* Fin wave animacion estilo */

/* Inicio general estilo */

/* Logos por pais */
.img-logo-MX { width: 170px; margin-top: -10px; margin-left: 25px; }
.img-logo-ES { width: 180px; margin-top: -10px; margin-left: 25px; }
.img-logo-IT { width: 180px; margin-top: -10px; margin-left: 25px; }
.img-logo-DE { width: 200px; margin-top: 8px; margin-left: 25px; }
.img-logo-PT { width: 180px; margin-top: -5px; margin-left: 25px; }
.img-logo-BE { width: 180px; margin-top: 0px; margin-left: 25px; }
.img-logo-PL { width: 235px; margin-top: 10px; margin-left: 5px; }
.img-logo-GB { width: 260px; margin-top: -40px; margin-left: -15px; }
.img-logo-UK { width: 260px; margin-top: -40px; margin-left: -15px; }
.img-logo-FR {width: 260px;margin-top: -6px;}
.img-logo- { width: 180px; margin-top: -10px; margin-left: 25px; }

/* ## Custom bootstrap styles */

.alert-danger {
    background-color: var(--bgAlertRed);
    color: var(--fontColorAlertRed);
    border: 2px solid var(--fontColorAlertRed);
}

.modal-header {
    background-color: var(--bgColorBodyBlanco);
    border: 2px solid var(--bgColorBodyBlanco);
}
/*cabecera modales como el popup idioma*/

.modal-body {
    background-color: var(--bgColorBody);
    border: 2px solid var(--bgColorBodyBlanco);
} /*cuerpo modales como el popup idioma*/

.container-fluid {
    max-width: 100%;
    margin: 0 auto;
}

.py-3 {
    width: calc(100% - var(--leftMenuMaxWidth));
}
/*master page CONTENEDOR PRINCIPAL PARTE DERECHA (PAGINA)*/

.sidebar-navigation li a:not([href]):hover {
    color: red;
} 

/*.navbar-brand img {
    width: 100%;
    max-width: 200px;
    margin-left: 40px;
    margin-top: 5px;
}*/

.brand-logo-image {
    max-width: 200px;
    max-height: 75px;
    margin: -10px 0px 0px 25px;
    width: 100%;
    padding: 0.75rem 0.1rem 0.2rem 0.1rem;
}

.section {
    margin-top: 40px;
}
.form-cls { width:100%; max-width:500px; margin:0 auto; margin-top:40px; background-color:#f9f9f9;}
.form-container {padding: 30px;}
.nav-line { background-image: linear-gradient(to right, var(--primaryColor), var(--fillColor));
            height:2px; width:100%; border-radius:5px; margin-bottom:20px; margin-top:-16px; }
.nav-crumb { margin-top:0px; }
footer { background-color: #fff; border-radius: .25rem; margin-top:50px; padding: .75rem 1rem; }
.div-right { text-align:right; }
.div-right > .btn-link { float:right; display:inline-flex; }
.div-right > .btn-link i { font-size: 12pt; margin-top:3px; margin-left:10px;  }

.header-nav {
    /*background-image: linear-gradient(to right, #001C11 250px, var(--primaryColor));    */
    background-image: var(--bgColorAreaSuperior);
    width: 100%;
    height: 60px;
} /*CONTENEDOR PRINCIPAL PARTE SUPERIOR (PERFIL Y LOGO)*/

.img-logo {
    float: right;
    margin-top: 18px;
    margin-right: 20px;
}
.material-icons { opacity:0; width:30px;  }
.page_title {
    font-weight: var(--fontWeight);
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    color: var(--fontColorGrey2) !important;
}
.breadcrumb-item a { color: #999; }
.breadcrumb-item a:hover { color: #295C10; }
.breadcrumb {
    padding-right: 0;
    padding-bottom: 8px;
    background-color: var(--bgColorGreyDark);
    border: var(--borderSections);
}
/* fix fileinput -> rgba(0,123,255,.25); */
/* ## Menu-sidebar navigation */
.sidebar {
    background: linear-gradient(var(--bgColorMenuGrad1), var(--bgColorMenuGrad2));
    padding: 10px 10px 80px 10px;
    border-radius: 6px;
    position: relative;
    overflow: hidden;
    /*background-color: var(--bgColorGreyDark);*/
}
.sidebar_wave { background: url('../img/wave.svg') repeat-x; position: absolute;    
                width: 6400px; height: 198px; left: -1350px; bottom:0; }
.sidebar_wave_y { background: url('../img/wave_y.svg') repeat-x; position: absolute;    
                  width: 6400px; height: 218px; left: -1350px; bottom:0; }
.sidebar-navigation {
    padding: 0;
    margin: 0;
    list-style-type: none;
    position: relative;
    color: white;
    max-width: 100%;
    width: 100%;
    font-size: var(--fontSize10pt);
    background-color: var(--bgColorGreyDark);
}
    .sidebar-navigation li {
        position: relative;
        display: inline-flex;
        width: 100%;
        line-height: 20px;
        /*ojito que este estilo está ampliado en codigo vb en UIController.GetCSSStylesUIEnhanced */
    }
.sidebar-navigation li.subitem { margin-top:0; display:none; }
.sidebar-navigation li.item { background-color:#f1f1f1; margin-top:0; height:30px; }

        .sidebar-navigation li a {
            padding: 7px 15px 7px 20px;
            display: inline-flex;            
            z-index: 0;
            position: inherit;
            width: 100%;
            flex-wrap: wrap;
            overflow: hidden;            
            color: var(--fontColorGrey) !important;
        } /*textos primer nivel*/

.sidebar-navigation li.item a { padding: 0px 15px 0px 20px;

}

.sidebar-navigation li.item a i { padding-top:2px; }


    .sidebar-navigation li.item a span {
        padding-top: 4px;        
    }
    .sidebar-navigation li.item a img {
        position: absolute;
        right: 2px;
        top: 4px;
    }

.alertIcon {
    height: var(--inputCheckbox);
    width: var(--inputCheckbox);
}

.alertIconMenu {
    height: var(--iconMenuAlert);
    width: var(--iconMenuAlert);
}

.imgDownload {
    display:flex;
    width: 1.8rem;
    height: 1.8rem;
}

.sidebar-navigation li a:active,
.sidebar-navigation li a:hover,
.sidebar-navigation li a:focus {
    text-decoration: none;
    outline: none;
} /*cortinilla grande extendida */


.sidebar-navigation li a i { display:block; margin-right:15px; margin-top:10px; font-size:6pt; }

        .sidebar-navigation li a span {
            white-space: nowrap;
            text-overflow: ellipsis;
            float: left;
            width: calc(100% - 30px);
            overflow: hidden;
            padding-top: 2px;                      
        }

/*MENU izquierdo cortinilla grande izquierda*/
        /*extensor cortinilla grande izquierda*/
        .sidebar-navigation li:not(.subitem):not(.item):not(.item-group)::before {
            background-color: var(--primaryColor);
            position: absolute;
            content: '';
            height: 100%;
            left: 0;
            top: 0;
            -webkit-transition: width 0.2s ease-in;
            transition: width 0.2s ease-in;
            width: 5px;
            z-index: 0;            
        }

        /*cortinilla grande izquierda durante el hover*/
        .sidebar-navigation li:not(.item-group):not(.item):not(.subitem):hover span {
            color: var(--fontColor2);
            transition: all 0.1s ease-in;
        }
/*texto dentro de las cortinillas grandes desplegadas*/
/*FIN MENU izquierdo cortinilla grande izquierda*/


/*MENU izquierdo cortinilla pequeña izquierda*/
    /*extensor cortinilla pequeña izquierda*/
        .sidebar-navigation li.item::before {
            background-color: #f1f1f1;
            position: absolute;
            content: '';
            height: 90%;
            left: 0;
            top: 50%;
            -webkit-transition: width 0.2s ease-in;
            transition: width 0.2s ease-in;
            width: 5px;
            z-index: 0;
            transform: translate(0,-50%);
            background-color: var(--primaryColor)
        }

/*punto cortinilla pequeña izquierda*/
.sidebar-navigation li.item i {
        color: var(--primaryColor);
    }

/*punto cortinilla pequeña izquierda durante el hover*/
.sidebar-navigation li.item:hover i {
    color: white;
    transition: all 0.2s ease-in;
    color: var(--fontColor2);
}

/*FIN MENU izquierdo cortinilla pequeña izquierda*/


/*MENU izquierdo: cortinilla derecha*/
/* Background de la cortinilla derecha (desplegable EXPAND_MORE)*/
.sidebar-navigation li.item-group::before {
            background-color: var(--bgColorGreyDark2);
            position: absolute;
            content: '';
            height: 100%;
            right: 0;
            top: 0;
            -webkit-transition: width 0.2s ease-in;
            transition: width 0.2s ease-in;
            width: 20px;
            z-index: 0;            
        }
/* Icono de la cortinilla derecha (flecha hacia abajo)*/
.item-group-icon {
    position: absolute;
    right: 6px;
    top: 10px;
    color: var(--fontColorGrey);    
}

/* Icono de la cortinilla derecha durante el hover (flecha hacia abajo)*/
.sidebar-navigation li.item-group:hover .item-group-icon .material-icons {
    color: var(--fontColor2);
}

.sidebar-navigation li.item-group:hover .item-group-icon {
    right: 6px;
    color: white;
    transition: all 0.1s ease-in;
}
/* FIN MENU izquierdo: cortinilla derecha*/



.item-group-icon i { font-size:14pt; }

.sidebar-navigation .item-group-icon i:hover {
    cursor: pointer; 
}

.sidebar-navigation .item-group-icon i {
    cursor: default;    
}


.sidebar-navigation li:not(.item-group):hover::before {
    width: 100% !important;    
}
.sidebar-navigation li:not(.item-group):not(.item):not(.subitem) span {  transition: all 0.2s ease-in; }


.sidebar-navigation li.item:hover { background-color:#f5f5f5;}

.sidebar-navigation li.item:hover::before { 
    width: 35px !important; 
    border-radius: 0 5px 5px 0; 
    background-color: var(--primaryColor) !important; 
} /*Cortinillas pequeñas desplegadas*/


.sidebar-navigation li.item-group:hover::before { width: 30px !important; background-color: var(--primaryColor); }


.subitem ul { padding-left:0px; width:100%; margin-bottom:5px;  }
.navbar-expand-sm .navbar-collapse { max-width:100%; width:100%; }
.nicescroll-rails-vr { margin-left: 15px; }
.disabled-menu {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 1;
    z-index: 990;
    background: repeating-linear-gradient(45deg, black, black 3px, transparent 3px, transparent 10px)
}
/* ## Form fix */
.dynamicValidator {
    background-color: LemonChiffon;
    border: solid 1px Black;
    font-size: 8pt;
    padding: 5px;
    margin-top: 5px;
    width: 100%;
}

/* ## Selected item */
.item.item-selected span {
    text-decoration: underline;
}
.item.item-selected::before { width: 35px !important; border-radius: 0 5px 5px 0; background-color: var(--primaryColor) !important; }
.item.item-selected i {
    color: white !important;
}

.sidebar-navigation a.item-selected[data-type="submenu"] {
    color: white !important;
}

.item-selected:not(.item) {
    background-color: var(--primaryColor);
    
}
    .item-selected:not(.item) span {
        color: var(--fontColor2);
    }
.item-selected:not(.item)::before { background-color: var(--primaryColor) !important; width:5px !important; max-width: 5px !important; }

/* ## Media querys */
@media (max-width: 575px) {
    .navbar { padding:0 !important; }
    .navbar-collapse { padding:0px !important; }
    .usr_info {
        position: inherit !important;
        text-align: center;
        margin: 0 auto;
        height: 38px;
        right: 0 !important;
        top: 0px !important;
        background-color: #e9e9e9;
        border-radius: 0 !important;
        box-sizing: unset;
        padding: 9px 0px 0px 0px; z-index:1000;
    }
    .col-crumb { display: none; }
    .sidebar { border-radius:0 !important; padding-bottom: 20px !important; border-bottom:1px solid #d1d1d1; box-shadow: 0 4px 2px -2px #d1d1d1; }
    /*.usr_container { position:absolute; left:50%; top:50%; transform:translate(-50%, -50%);width: max-content; min-width:215px;    }*/    
    .navbar-brand img { margin-left:20px; }
    
    .img-logo {
        display: none;
    }
    .sidebar { background: none; background-color: #f9f9f9; padding:0;}
    .collapse .sidebar_wave, .collapse .sidebar_wave_y { display:none; }
    .header-img { display:none; }        
    .options_bar a { color:var(--primaryColor) !important; }
    .options_bar a > i { text-decoration: none !important; }
    .nav-line { margin-bottom:10px; height:4px; }
    .options_bar { position:initial; margin:0 auto; margin-top:20px; max-width:350px; }
    .sidebar-navigation {
        max-width: 350px;
        margin: 0 auto;
        margin-top: 0px;
        margin-top: 10px;
    }
    .navbar-expand-sm .navbar-collapse {
        max-height: none !important;
    }

}
/* User media */
@media (max-width: 850px) { 
    .area-info { display: none; }
}
@media (max-width: 698px) {
    .input-group-text {  width: 120px !important;}     
}
@media (max-width: 698px) and (min-width: 576px) {    
    #lblUsuario { display: none; }
    .usr_icon { padding-right:0 !important;}
    .usr_box { padding: 1px 3px 1px 3px !important;}
}
@media (max-width: 576px) {
    .row_flex {
        position: absolute;
        background-color: #E9ECEF;
        padding: 5px 10px !important;
    }
    .sidebar-navigation {  margin-top:45px;  }
}

/* ## Bootstrap override primary styles */
.btn-link { color:var(--primaryColor);}
.btn-link:hover { color:var(--primaryColor)}

.btn-primary, .btn-primary.disabled, .btn-primary:disabled {
    background-color: var(--bgPrimaryWhite);
    border-color: var(--primaryColor);
    border-width: 2px;
    color: var(--fontColorInverse);
    font-weight: var(--fontWeight);
    font-size: var(--fontSize1rem);
}

    .btn-primary:hover, .btn-primary:active, .btn-primary:focus {
        background-color: var(--secondaryColor);
        border-color: var(--primaryColor);
        font-size: var(--fontSize1rem);
    }

    .btn-primary.focus, .btn-primary:focus {
        background-color: var(--secondaryColor);
        border-color: var(--primaryColor);
        box-shadow: 0 0 0 .2rem var(--primaryColor);
        font-size: var(--fontSize1rem);
    }

    .btn-primary.disabled, .btn-primary:disabled {
        background: repeating-linear-gradient(45deg, var(--primaryColor), var(--primaryColor)10px, var(--bgColorBody) 0px, var(--bgColorBody) 13px);
        opacity: 100%;
        cursor: no-drop;
        font-size: var(--fontSize1rem);
        color: var(--fontBtnDisabled);
    }

.btn-primary:not(:disabled):not(.disabled).active, .btn-primary:not(:disabled):not(.disabled):active, .show > .btn-primary.dropdown-toggle {background-color: var(--primaryColor); border-color: var(--primaryColor); }
.btn-primary:not(:disabled):not(.disabled).active:focus, .btn-primary:not(:disabled):not(.disabled):active:focus, .show > .btn-primary.dropdown-toggle:focus { box-shadow: 0 0 0 .2rem  var(--primaryColor);}


.btn-primaryInverse {
    background-color: var(--bgPrimaryBlack) !important;
    border: 2px solid var(--bgPrimaryBlack) !important;
    color: var(--fontColorWhite);
    font-size: var(--fontSize1rem);
}

    .btn-primaryInverse:hover {
        background-color: var(--bgSecondaryWhite) !important;
        border-color: var(--bgPrimaryBlack) !important;
        color: var(--fontColorInverse);
        font-size: var(--fontSize1rem);
    }


.btn-secondary {
    background-color: var(--bgBtnSecondary);
    border-color: var(--primaryColor);
    border-width: 2px;
    color: var(--fontColorInverse);
    font-weight: var(--fontWeight);
    font-size: var(--fontSize1rem);
}

    .btn-secondary:hover, .btn-secondary:active, .btn-secondary:focus {
        background-color: var(--bgBtnSecondaryHover);
        border-color: var(--primaryColor);
        font-size: var(--fontSize1rem);
    }


.input-group-text {
    background-color: var(--fillColor);
    border: 1px solid #ced4da;
    color: var(--fontColor);
    font-weight: var(--fontWeight);
}
.navbar-light .navbar-toggler-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(255, 255, 255, 1)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}
.breadcrumb-item { position:relative; margin-left: 5px; margin-right: 5px; }
.breadcrumb-item + .breadcrumb-item::before { position: absolute; left:-4px; }
.imbBloodMode {
    height: 50px;
    background-color: inherit;
    position:relative;
    top: -10px;
    left: 20px;
}
/* > Focus / Active (var(--primaryColor) glow) */
textarea:focus,
textarea.form-control:focus,
input.form-control:focus,
input[type=text]:focus,
input[type=password]:focus,
input[type=email]:focus,
input[type=number]:focus,
input[type=file]:focus,
input[type=file]:active,
select:focus,
.select2:focus,
.custom-file-input:focus,
.custom-file:focus,
.custom-file-label:focus,
.select2-container--default .select2-selection--single:focus,
[type=text].form-control:focus,
[type=password].form-control:focus,
[type=email].form-control:focus,
[type=tel].form-control:focus,
[type=file].form-control:focus,
[type=file].form-control:active,
[contenteditable].form-control:focus {
    box-shadow: 0 0 0 .2rem var(--primaryColor) !important;
}


.form-control {
    font-size: var(--fontSize16px) !important;
    font-weight: var(--fontWeight);
    padding: var(--formControlPadding);
    height: 100%;
    min-height: var(--heightFormControls);
    color: var(--fontColorGreyInverse);
}/*form-controls (textboxes de los filtros de la seccion de filtros) */



.form-controlGrid {
    font-size: 14px !important;
}

.mb-1 {margin-bottom:1px !important; }

/* ## Select2 plugin */

.select2-container--default.select2-container--disabled .select2-selection--single {
    background: var(--bgDisabled);
    color: var(--fontColorGridItem) !important;
}


    .select2-results__option--highlighted {
    color: white !important;
    background-color: var(--secondaryColor) !important;
}
.select2-container--default .select2-selection--single {
    border: 1px solid #ced4da !important;
    border-radius: 0 4px 4px 0 !important;
    height: var(--heightFormControls) !important;
    padding: 4px;
}
.select2-container--default .select2-selection--single .select2-selection__arrow { top:6px !important; }
.select2-container--default .select2-results__option[aria-selected="true"] { background-color: #fff; }
/*.select2 { width: calc(100% - 90px) !important; }*/
.select2 { width:100% !important; }
.input-group-row { display: table; width:100%; margin-bottom: 1rem!important; }
.input-group-prepend-cell { display: table-cell; width: auto; padding-top:1px; vertical-align: top;}
    .input-group-prepend-cell .input-group-text {
        height: var(--heightFormControls);
        border-right: 0;
        border-radius: 3px 0 0 3px;
    } /* contenedor campos filtros*/
.input-cell { display: table-cell; width:100%; padding-top:1px; overflow:hidden; }
.igt-right {
    border-left: 0;
    background-color: var(--bgColorMenuGrad2) !important;
}


.select2-container .select2-selection--single .select2-selection__rendered {
    white-space: unset !important;
    font-size: var(--fontSize16px);
    color: var(--fontColorGreyInverse);
} /*letras combos (select2)*/

/* ## Override cetelem styles */
.maxBoxLabels { width: 180px !important;}

.gridFooter {
    color: var(--fontColorGridFooter);
    font-weight: bolder;
    font-size: var(--fontSizeGridFooter);
}

/*lupas de los grids*/
.gridRowIcon { 
    height: var(--iconGridRow1);
    width: var(--iconGridRow1);
}

.gridRowSwither {
    height: var(--iconGridSwitcherH);
    width: var(--iconGridSwitcherW);
}

input[type=checkbox], input[type=radio] {
    height: var(--inputCheckbox);
    width: var(--inputCheckbox);
}

.imgCalendar { height:20px; position: absolute; right:10px; top:10px; z-index:1000; }

.iconCalendar {
    filter: var(--invertCalendarIcon);
    height: var(--heightFormControls);
    width: 30px;
    background-color: var(--bgColorCalendarIcon) !important;
}

    
    .form-row-right { float: right; }
.fr-margin { margin-top:-15px; margin-bottom:15px; }
.fr-margint { margin-top:15px; }
.searchDiv { border:1px solid #c1c1c1; background-color: #FBFAD9; width:100%; padding:5px 10px; }
fieldset legend {
    font-size: 12pt;
    color: var(--fontColor);
    background-color: var(--bgColorBody2);
}

.leyendsOverBackground {
    font-size:var(--fontSize12px);
    color: var(--fontColor);
}

.div-filters { margin-bottom:10px; display:inline-flex; }
.div-filters i { margin-right: 10px; color:#c1c1c1; }
#ContentPlaceHolderCuerpo_s0path1_ctl00, #ContentPlaceHolderCuerpo_s0path1_ctl01 { display: none; }
.HeaderStyle, .HeaderStyle a { background-color: #295C10 !important}


.col-sm-3 {
    max-width: var(--leftMenuMaxWidth);
    background-color: #f5f5f5;
} /* CONTENEDOR PRINCIPAL PARTE IZQUIERDA (MENU)*/


@media (max-width: 575px) {
    .col-sm-3 { max-width: 100% !important; display: inline-table; }    
    .wrapper { height: auto !important; }
}
body, html, form {
    height: 100%;
    background-color: var(--bgColorBody);
    font-weight: var(--fontWeight);
    /*font-size: var(--fontSize12px);*/
}

.enhancedBorder {
    border: var(--borderSections);
}
.container-fluid {
    height: 100%;
}
.wrapper { height: calc(100% - 60px); }
.navbar {
    height: 100%;
    min-height: 0px;
    background-color: var(--bgColorBody);
    border: var(--borderSections);
}
.navbar-collapse { flex-direction: column; }
.h2, h2 { font-size:1.5rem;}
.sidebar { position: sticky; top:0; }
/*.nav-crumb { position: sticky; top:0; z-index:900; }*/
.form-cls { box-shadow: 10px 10px 5px 0px rgba(173,173,173,0.75); border:1px solid #c1c1c1; margin-top:120px; }
.input-group-text:not(.igt-right) { width:130px; text-overflow: ellipsis; display: block; overflow: hidden; }
.sidebar_wave_y, .sidebar_wave { display: none; }
.btn-link-white {
    color: var(--fontColorBrandInverse);
    width: 100%;
    text-decoration: none !important;
}
    .btn-link-white:hover {
        color: var(--fontColorBrandInverse);
    }


.btn-link-white:hover > span { text-decoration:underline; }
.navbar-light .navbar-toggler { color: white; border-color: white; position: absolute; right: 10px;top: -50px; border:0; opacity:0.8; }
.navbar-light .navbar-toggler:hover { opacity:1; }
.divTableRowCenter { text-align:center; }
.nopad { padding:0 !important; }
.col-md-6.nopad:first-of-type { padding-right: 5px !important;}
.col-md-6.nopad:last-of-type {
    padding-left: 5px !important;
}
.fullwd { max-width:100% !important;}
.form-title td { padding: 10px; }
.form-title {
    margin-top: 10px;
    margin-bottom: 5px;
    background-color: var(--bgColorBodyBlancoGris);
    border: var(--borderSectionsBlack);
}


    .form-title .cs10px564b47 {
        font-size: var(--fontSize16px);
    }

.gp-table-row {
    display: table-row !important;
}
.form-control { border: 1px solid #ced4da !important;}

    .form-control:disabled {
        background: var(--bgDisabled);
        color: var(--fontColorGridItem) !important;
    }

    .form-control:read-only {
        background: var(--bgColorGreyDark) !important;
        color: var(--fontColor) !important;
    }

.form-controlMandatory {
    color: var(--fontColorMandatoryWhite);
    font-weight: bolder;
    font-size: var(--fontSizeGridFooter);
}

.form-controlW200{
    width:200px !important;    
}

.form-control-alert:disabled {
    background: var(--bgDisabled);
    color: var(--fontColorMandatoryWhite) !important;
    font-weight: var(--fontWeight);    
    font-size: x-large !important;
}

.form-control-alert:read-only {
    background: var(--bgColorGreyDark) !important;
    color: var(--fontColorMandatoryWhite) !important;
    font-weight: var(--fontWeight);    
    font-size: x-large !important;
}

    .item_nav_container {
        width: 75px;
        float: left;
        z-index: 999;
        position: inherit;
    }

/* ## Estilo de caja de usuario */
.nav-crumb { position:relative; }
.usr_info { float:right; }
.usr_name, .usr_itembox { display: inline-flex; background-color:#f1f1f1; color:#666; cursor:pointer; border-radius:3px;
            font-size: 10pt; border: 1px solid #c1c1c1; float:left; 
}
.usr_name:hover { background-color:#fafafa; }
.usr_name i:nth-of-type(1) { color: var(--primaryColor); }
.usr_name:hover > i:nth-of-type(1) { color: var(--primaryColor); }
.usr_name i:nth-of-type(2) { color: var(--primaryColor); }
.usr_name span:first-of-type { margin-left:5px; margin-right: 5px; padding-top:2px; }
.usr_name span:first-of-type { max-width:100%; white-space:nowrap; text-overflow:ellipsis; display:block;}
.mg-0 { margin:0; }
.pd-0 { padding:0; }
.usr_name_fix {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    text-align:right;
}
.row_flex {
    display: flex;
    flex-direction: row-reverse;
}
.usr_box {
    background-color: #f1f1f1;
    cursor: default;
    border-radius: 3px;
    font-size: var(--fontSize10pt);
    border: 1px solid #c1c1c1;
    padding: 1px 7px 1px 3px;
    color: var(--fontColorGreyInverse);
}
    .usr_box i:nth-of-type(1) {        
        color: var(--fontColorBrand);
    }
.flex-position { position: absolute;}
.usr_icon{ float:left; padding-right:5px; }
.col-crumb { white-space: nowrap; overflow: hidden; padding-right:0; height:30px; }
.usr_itembox { margin-right: 7px; color:#999; }
.usr_itembox:hover { color: #444; }
.usr_itembox:hover a { color: var(--primaryColor); }

    .usr_itembox a {
        height: 24px;
        color: var(--fontColorGreyInverse);
    }
.col-itembox { max-width:72px; padding:0 !important; }
.item-home a:hover {
    color: var(--primaryColor);
    opacity: 1;
}
.usr_popup { position: absolute; top:32px; right:0px; background-color:white; border: 1px solid var(--primaryColor); border-radius:5px;
             overflow: hidden; min-width: 175px; box-shadow: 5px 5px 2px 0px rgba(173,173,173,0.75); z-index:1001;
             display: none; 
}
.usr_popup ul, .usr_popup li { margin:0; padding:0; list-style: none; }
.usr_popup li { padding: 4px 5px; display: inline-flex; width: 100%; cursor: default; }
.usr_popup li > a { display: inline-flex; width:100%; }
.usr_popup li:nth-of-type(2) { background-color: #f1f1f1; cursor: pointer; border-top:1px solid #c1c1c1; }
.usr_popup li:nth-of-type(3) { background-color: #f1f1f1; cursor: pointer; border-top:1px solid #c1c1c1; }
.usr_popup i { font-size: 12pt; color: #999 !important; padding-top:2px; margin-right: 10px;  }
.usr_popup_back { width: 100%; height: 100%; position: fixed; top:0; left: 0; z-index:990; cursor: default; display:none; }
.usr_popup li a { text-decoration: none; color:#000; }
.usr_popup li a span { padding:0 !important; margin:0 !important; }
.usr_popup li a:hover > span { text-decoration:underline; }

.mb-3 > input[type=image] {
    padding: 5px 3px;
    background-color: var(--fillColor);
    border: 1px solid #c1c1c1;
    border-left: 0;
}
.chk-form {    
    padding: 5px 10px;
    background-color: var(--fillColor);
    border: 1px solid #c1c1c1;
    border-left-color: rgb(193, 193, 193);
    border-left-style: solid;
    border-left-width: 1px;
    border-left: 0;
}

.downloadicon-form {
    min-width: 40px;
    padding: 5px 10px;
    background-color: var(--secondaryColor);
    border: 1px solid #c1c1c1;
    border-left-color: rgb(193, 193, 193);
    border-left-style: solid;
    border-left-width: 1px;    
}

.displayRegExp { display: none; }
.btn-group-mg { margin-bottom:10px !important; margin-top:10px; }
.btn { margin-right:5px; margin-top:5px;}
.form-header-row { margin-top: -20px; }
.fixed-col-50 { padding-left:10px; }
    .fixed-col-50 span {
        color: var(--fontColorGrey);
        font-weight: var(--fontWeight);
    }
.tipo_doc { float:right;}

.pnlInfo {
    border-left: 6px solid var(--primaryColor);
    margin-bottom: 5px;
}

.pnlInfo2 {
    width: 100%;
    margin-bottom: 5px;
    background-color: var(--bgPrimaryBlack);
    color: var(--fontColorWhite);
    border: var(--borderSectionsBlack);
}

.tablePrecargaNew td {
    vertical-align: middle;
}

.tablePrecargaNew input {
    padding: 8px;
    border: 1px solid #ced4da;
}

.btn-group input{
    margin-right: 0px !important;
}

.pnlInfo td:first-of-type {
    padding: 3px 0px 5px 15px;
}

.pnlFilters {
    height: auto;
    visibility: visible;
    padding-top: 20px;
    filter: invert(--invertCalendarIcon);
}

.btnCollapsableFilters {
    cursor: pointer;
}

.pnlInfo td:first-of-type { padding: 3px 0px 5px 15px; }
.pd-10 { padding-left:10px;}
.spn_format {
    padding: 5px 8px;
    background-color: var(--secondaryColor);
    border: 1px solid #c1c1c1;
    border-left-color: rgb(193, 193, 193);
    border-left-style: solid;
    border-left-width: 1px;
    border-left: 0;
}

/* Tabla de información */
.info-table { background-color: #E8F2FF; border:1px solid #CCE1FF; padding: 7px 25px; margin-bottom: 15px; }
.centered-table > table { margin: 0 auto; }
.centered-table {
    margin-top: 70px;
}

/* Legend */
fieldset { border:0; border-top: 1px solid #c1c1c1; }
legend { width: auto; padding-right: 15px; }

/* validadores */
.popupLeft {
    left: -200px !important;
}
.gf_notification { width:300px; margin-left:10px; }

/* static buttons */
.static-buttons { float:right; }
    .static-buttons.sta {
        position: fixed;
        float: none !important;
        bottom: 10px;
        right: 10px;
        background-color: #f9f9f9;
        padding: 0px 15px;
        box-shadow: 0 4px 2px -2px #d1d1d1;
    }
.static-container { 
    height:50px;
}

/* breadcrum */
.usr_separator { color:#c1c1c1; }
.item-passw { margin-left:5px; }
.area-info {
    position: absolute;
    top: 10px;
    left: 275px;
    padding-left: 10px;
    font-size: var(--fontSize10pt)
}

    .area-info > span {
        float: left;
        width: 100%;
        color: var(--fontColorGrey);        
    }

.d-flex { display: inline-flex;}
.area-sep {
    background-color: var(--primaryColor);
    height: 32px;
    width: 6px;
    position: absolute;
    top: 5px;
    left: -10px;
}

/* Internet explorer FIX*/
@media all and (-ms-high-contrast: active), (-ms-high-contrast: none) and (max-width: 575px) {
    _: -ms-fullscreen, :root .options_bar {
        position: absolute !important;        
        bottom: 0px;
        left:50%;
        transform: translate(-50%,0);
    }
    _:-ms-fullscreen, :root .navbar-collapse {
        padding-bottom:50px !important;
    }
}
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
    .ie-fix .navbar {
        height: 100%;
    }
}

/* Fin general estilo */

/* Inicio style cetelem estilo*/

/* ## Estilos de las paginas y controles de Cetelem */
.divTableBody {
    display: table;
    width: 100%;
    position: relative;
}

.divTableRowLight {
    display: table-row;
    background-color: var(--bgColorBodyBlancoGris);
    padding: 2px 4px;
    position: relative;
}

    .divTableRowLight:hover {
        background-color: #f9f9f9;
    }

.divTableCell {
    display: block;
    width: 100%;
}

.divTableRowLight .divTableCell:nth-of-type(2) {
    width: 50px;
    text-align: center;
    position: absolute;
    right: -10px;
    top: -2px;
}

.divTableRowLight .divTableCell {
    padding: 2px 4px;
}

.pnlSection {
    border: 1px solid #c1c1c1;
    margin-bottom: 5px;
}

.options_bar {
    position: absolute;
    bottom: -5px;
    padding-top: 5px;
    left: 5px;
    width: 100%;
    background-color: var(--bgColorMenuGrad2);
    z-index: 996;
    color: var(--fontColor);    
}

.btn-link-white i {
    font-size: 12pt;
    margin-top: 3px;
    margin-right: 10px;
    margin-left: 5px;
    text-decoration: none;
}

.btn-link-white {
    font-size: 10pt;
    display: inline-flex;
}


.bth-link-white:hover span {
    text-decoration: underline !important;
}

.imgCellLogo img {
    width: 100%;
    max-width: 500px;
    margin: 0 auto;
}

.form-panel-msg > div {
    background-color: #FBFAD9;
    width: 100%;
    max-width: 500px;
    margin: 0 auto;
    margin-top: 20px;
    padding: 5px 10px;
}

.form-group-nomg {
    margin-bottom: 0;
}

.cs10pxff6600 {
    font-size: var(--fontSize10pt) !important;
}

.form-row-mg {
    margin-bottom: 1rem;
}

/* ## Estilo de tabla en usuario_list */
.HeaderStyle, .HeaderStyle a {
    font-size: 10pt !important;
    background-color: var(--primaryColor) !important;
    color: white !important;
}

.ItemStyle, .AlternatingItemStyle {
    cursor: default;
    padding-left: 10px;
    height: 50px;
    background-color: var(--fillColor) !important;
    color: var(--fontColor);
    font-size: var(--fontSize10pt);
}


.ItemStyle {
    
    background-color: var(--bgColorGridItem) !important;
    color: var(--fontColorGridItem);
    font-size: var(--fontSize10pt)    
} 

    .HeaderStyle td:first-child, .ItemStyle td:first-child, .AlternatingItemStyle td:first-child {
        padding-left: 10px !important;        
    }

.gridFloatPanel {
    visibility: inherit;
    position: absolute;
    width: 400px;
    height: 400px;
    top: 50%;
    right: 50%;
    padding: 16px;
    background: #FFFFFF;
    border: 2px solid #080808;
    z-index: 100;
    color:#000000;
}

/*grids codebehind*/
.headerstyle2 {    
    background-color: var(--secondaryColor) !important;
    color: white !important;
    font-size: var(--fontSize10pt)
}

.itemstyle2OLD, .alternatingitemstyle2OLD {
    cursor: default;
    padding-left: 10px;
    background-color: var(--fillColor) !important;
    color: var(--fontColor);
    font-size: var(--fontSize10pt)
}

.itemstyle2OLD {
    background-color: var(--bgColorGridItem) !important;
    color: var(--fontColorGridItem);
    font-size: var(--fontSize10pt)
}

.form-controlOLD {
    font-size: var(--fontSize16px);
    color: var(--fontColorGridItem);
    padding-left:10px
}

.alternatingitemstyle2OLD .itemstyle2CellOLD {
    border: 2px solid white;
}
/* ## Estilo de grids */
.GridViewContainer {
    border: 2px solid var(--primaryColor);
}

.GridViewHeaderStyle {
    white-space: nowrap;
    background-color: var(--secondaryColor) !important;
    color: white !important;
    font-size: var(--fontSize10pt)
}

    .GridViewHeaderStyle th {
        color: white !important;
        text-align: center;
    }

    .GridViewHeaderStyle a:link {
        color: white !important;
        text-decoration: underline;        
    }

.itemstyle2, .alternatingitemstyle2 {
    cursor: default;
    padding-left: 10px;
    background-color: var(--fillColor) !important;
    color: var(--fontColor);
    font-size: var(--fontSize10pt)
}

.itemstyle2 {
    background-color: var(--bgColorGridItem) !important;
    color: var(--fontColorGridItem);
    font-size: var(--fontSize10pt)
}

.itemstyle2 td{
    vertical-align: middle;
}

/* Secciones de panel */
.divContainer {
    max-width: 100%;
    border: var(--borderSections);
}

.collapse-panel {
    margin-top: 15px;
}

    .collapse-panel tr > td:first-of-type {
        font-size: var(--fontSize10pt);
        padding: 5px 0;
        background-color: var(--bgColorBodyBlancoGris);
        color: var(--fontColorGridItem);
    }

    .collapse-panel tr > td:last-of-type {
        font-size: var(--fontSize10pt);
        padding: 5px 0;
        background-color: var(--bgColorBodyBlancoGris);
        color: var(--fontColorGridItem);
    }

.table-info-dealer tr > td:first-of-type {
    padding-left: 10px;
    width: 25%;
    vertical-align: top;
    background-color: var(--bgColorMenuGrad1);
    color: var(--fontColor);
}

.table-info-dealer tr > td:last-of-type {
    padding-left: 10px;
    width: 50%;
    vertical-align: top;
    background-color: var(--bgColorGridItem);
    color: var(--fontColorGridItem);
}

.table-info-dealer {
    border: 1px solid #c1c1c1;
    width: 100%;
}

    .table-info-dealer tr:not(:first-child) {
        border-top: 1px solid #d1d1d1;
    }

/*Fin style cetelem estilo*/

/* Inicio m3 col break Estilo*/

.col-nomg {
    padding: 0;
    margin: 0;
}

@media (max-width: 1300px) and (min-width: 768px) {
    /*body { background-color: pink; }*/
    .input-group-prepend {
        width: 100%;
    }

        .input-group-prepend > .input-group-text {
            width: 100%;
        }

    .gp-table-row {
        display: flex !important;
    }

    .input-group-prepend-cell {
        width: 100%;
    }

        .input-group-prepend-cell > .input-group-text {
            width: 100%;
        }

    .input-group-text:not(.igt-right) {
        text-align: left;
    }

    .input-group-text {
        border: 1px solid #ced4da !important;
    }
}

@media (max-width: 1300px) {
    .form-header-row {
        display: none;
    }
}

@media (max-width: 768px) {
    .mb-3 {
        margin-bottom: 0 !important;
    }
}

/* Fin m3 col break Estilo*/

/* Inicio nuevos estilos prefinancing*/
.btn3 {
    display: inline-block;
    font-weight: 400;
    color: #212529;
    text-align: center;
    vertical-align: middle;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-color: transparent;
    border: 1px solid transparent;
    border-top-color: transparent;
    border-right-color: transparent;
    border-bottom-color: transparent;
    border-left-color: transparent;
    padding: .375rem .75rem;
    font-size: 1rem;
    line-height: 1.5;
    border-radius: .25rem;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}

.btn-primary3 {
    color: #fff;
    background-color: var(--primaryColor) !important;
    border-color: var(--primaryColor) !important;
}

.btn-secondary3 {
    color: #fff;
    background-color: #5a6268;
    border-color: #545b62;
}

.collapse-panel3 {
    margin-top: 15px;
}

    .collapse-panel3 tr > td:first-of-type {
        font-size: 10pt;
        padding: 5px 0;
    }

.GridViewHeaderStyle3 {
    font-size: 10pt !important;
    white-space: nowrap;
    background-color: var(--primaryColor) !important;
    color: white !important;
    font-family: verdana !important;
}

    .GridViewHeaderStyle3 th {
        color: white !important;
        text-align: center;
    }

    .GridViewHeaderStyle3 a:link {
        color: white !important;
        text-decoration: underline;
    }

.itemstyle3, .alternatingitemstyle3 {
    cursor: default;
    font-size: 10pt !important;
    padding-left: 10px;
    font-family: verdana;
}

.HeaderStyle3, .HeaderStyle3 a {
    font-size: 10pt !important;
    background-color: var(--primaryColor) !important;
    color: white !important;
}


.itemstyle3 {
    background-color: #E1EFC7 !important;
}


/* Fin nuevos estilos prefinancing*/

/* Inicio estilo progreso precargas*/

.preload-progress-step-bar {
    display: flex;
    flex-wrap: wrap;
}

.preload-progress-step-bar__item {
    flex: 1;
    display: flex;
    flex-direction: column;
    text-align: center;
}

.preload-progress-step-bar__title {
    position: relative;
    bottom: 20px;
    color: var(--primaryColor);
}


.preload-progress-step-bar__item:before {
    position: relative;
    font-size: 2rem;
    color: var(--primaryColor);
    z-index: 1;
    display: block;
    width: 3.5rem;
    height: 3.5rem;
    border: 3px solid var(--secondaryColor);
    border-radius: 50%;
    margin: 1rem auto 0;
    bottom: 20px;
}

.step-active:before {
    border: 3px solid var(--primaryColor);
    color: var(--fontColor2);
    background: linear-gradient(to right, var(--primaryColor) 50%, #ffffff 50%) left;
    background-size: 200%;
    transition: all 1s ease-out;

}

.step-active {
    transition: all 1s ease-in-out;
}

.step-active:hover:before {
    color: var(--primeryColor);
    background: none;
}

    @keyframes slideInFromLeft {
        0% {
            background-position: right;
            color: #ffffff;
        }

        100% {
            background-position: left;
            color: var(--primaryColor);
        }
    }

    .step-1:before {
    content: "1";
    animation: 0.25s ease-in slideInFromLeft;
}

.step-1:after {
    animation: 0.25s ease-in slideInFromLeft;
    animation-delay: 0.25s;
}

.step-2:before {
    content: "2";
}

.step-active.step-2:before {
    animation: 0.25s ease-in slideInFromLeft;
    animation-delay: 0.75s;
}

.step-2:after {
    animation: 0.25s ease-in slideInFromLeft;
    animation-delay: 1.25s;
}

.step-3:before {
    content: "3";
}

.step-active.step-3:before {
    animation: 0.25s ease-in slideInFromLeft;
    animation-delay: 1.75s;
}

.step-3:after {
    animation: 0.25s ease-in slideInFromLeft;
    animation-delay: 2.25s;
}

.step-4:before {
    content: "4";
}

.step-active.step-4:before {
    animation: 0.25s ease-in slideInFromLeft;
    animation-delay: 2.75s;
}


.preload-progress-step-bar__item:not(:last-child):after {
    content: "";
    position: relative;
    top: 1.5rem;
    left: 50%;
    height: 2px;
    background-color: var(--secondaryColor);
    order: -1;
}

.step-spacer-active:not(:last-child):after {
    background-color: var(--primaryColor);
}

.preload-progress-step-bar__item:not(:last-child):after {
    width: calc(100% - 3rem - calc(0.5rem * 2));
    left: calc(50% + calc(3rem / 2 + 0.5rem));
}

.step-active.preload-progress-step-bar__item:not(:last-child):after {
    background: linear-gradient(to right, var(--primaryColor) 50%, #ffffff 50%) left;
    background-size: 200%;
}

/* Fin estilo progreso precargas*/

/* Inicio estilo webpreload document*/

.webpreload-document-container {
    margin: 1rem;
}

/* Fin estilo progreso precargas*/


/* Inicio estilo veh detalle*/

.veh-detalle-container {
    margin: 1rem;
}


/* Fin estilo veh detalle*/


/* Inicio estilo pre detalle*/
.veh-predetalle-container {
    margin: 1rem;
}
/* Fin estilo pre detalle*/


element.style {
}

.cs10px564b47 {
    font-size: var(--fontSize12px);
    font-weight: var(--fontWeight);
}

.fontColorNormal {
        color: var(--fontColor);
    }

    *, ::after, ::before {
        box-sizing: border-box;
    }

.text-underlined{
    text-decoration:underline;
}

/*2FA*/
.text-secondary {
    color: var(--fontColorGrey) !important;
}

.card-body {
    background-color: var(--bgColorBody);
    border: var(--borderSections)
}
/*fin 2FA*/


/* SOBREESCRITURA ESTILOS AJAX*/
/*Bocadillo Ajax*/
.ajax__validatorcallout div, .ajax__validatorcallout td {
    background-color: var(--bgColorAmarillo);
    font-size: var(--fontSize10px);
    font-weight: var(--fontWeight);
    color: var(--fontColorAlertRed2);
}

.ajax__validatorcallout_popup_table {
    margin: 0px -30px;
}

.card-header {
    background-color: var(--bgColorGreyDark);
    color: var(--fontColor);
}

.alertGreenCodeBehind {
    color: var(--fontColorAlertGreen) !important;
    font-weight: bolder;
}

.alertRedCodeBehind {
    color: var(--fontColorAlertRed2) !important;
    font-weight: bolder;
}

.alertIconGreyScale {
    filter: var(--greyScaled);
}

/* FIN SOBREESCRITURA ESTILOS AJAX*/
/* Inicio estilo para ajaxToolkit:TabContainer horizontal (Wholesale_veh_detalles, alertas/pendiente.aspx) */
#TabsDetalleVehiculo {
    margin: 0.5rem;
    width: 99% !important;
}

.tab-container-branded .ajax__tab {
    padding: 0.5rem;
    font-size: 1rem;
    border: solid #999999;
    border-width: 1px 1px 1px 1px;
    height: auto !important;
    background-color: white;
    color: black;
    border-radius: 3px 3px 0px 0px;
    padding-bottom: 15px;
    margin-top: 10px !important
}

.tab-container-branded .ajax__tab_active {
    background-color: var(--bgPrimaryBlack);
    color: white;
    border-width: 1px 1px 0px 1px;
    padding-top: 10px;
    margin-top: 0px !important;
    padding-bottom: 25px;
}

.tab-container-branded .ajax__tab * {
    background-image: none !important;
}

.tab-container-branded .ajax__tab:hover {
    background-color: var(--secondaryColor);
    color: white;
    transition: 0.2s ease-in all;
}

.tab-container-branded .ajax__tab:hover a:has(a.ajax__tab_disabled) {
        background-color: white !important;
    }

.gridInputDate {
    width: 50px;
    margin-left: -30px;
    color: white;
}

.ajax__tab_xp .ajax__tab_body {
    background-color: var(--bgColorBody)
}
    /* Fin  TabContainer */
/* Fin  TabContainer */
.step-active:hover {
    color: var(--secondaryColor);
    transition: all .5s ease-in-out;
}

/* Fin estilo progreso precargas*/

/* Inicio Estilos añadidos en Precarga Masiva */

.rowEnabledDefaulBackground {
    background-color: var(--fontColorWhite)
}

.rowErrorBackground {
    background-color: #E5A6A6;
}

.rowDefaultBackground {
    background-color: var(--fillColor);
}

.rowCorrectBackground {
    background-color: #A6E5A6;
}

#ContentPlaceHolderCuerpo_panelMain .glyphicon {
    font-size: 15px;
}

 #ContentPlaceHolderCuerpo_panelMain *:hover > .glyphicon {
    color: var(--secondaryColor);
}

.modalHeader {
    background-color: var(--secondaryColor);
    color: white;
    border-bottom: none !important;
}

.modalBody {
    background-color: var(--bgColorBody)
}

.modalFooter {
    background-color: var(--secondaryColor);
    border-top: none !important;
}

.buttonBNP {
    background-color: #008859 !important;
}

.linkPreload {
    display: inline !important;
}

.popover {
    background-color: var(--secondaryColor);
    border: 1px solid gray;
}

    .popover .arrow:after {
        border: 1px solid var(--primaryColor);
    }

.popover-content {
    background-color: var(--secondaryColor);
}

.popover-body {
    color: var(--fontColor2) !important;
}

::-webkit-scrollbar {
    width: 2px;
    height: 10px;
}

/* Track */
::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 5px;
}

/* Handle */
::-webkit-scrollbar-thumb {
    background: #888;
    border-radius: 5px;
}

    /* Handle on hover */
    ::-webkit-scrollbar-thumb:hover {
        background: #555;
    }

#btnEjecutar:disabled {
    opacity: 0.2;
}

[tooltip]:hover:after {
    opacity: 1;
    transition: all 0.1s ease 0.5s;
    visibility: visible;
}

[tooltip]:after {
    content: attr(tooltip);
    position: absolute;
    bottom: -1.6em;
    left: 100%;
    padding: 8px;
    white-space: nowrap;
    color: white;
    border-radius: 5px;
    background-color: #96C56E;
    opacity: 0;
    z-index: 99999;
    visibility: hidden;
}

[tooltip] {
    position: relative;
}

.filaMenuBotones {
    height: 70px;
    width: 100%;
}

.modal-header-confirmation {
    background-color: #E5A6A6;
    color: white;
}


.modal-body-confirmation {
    text-align: center;
}

.modal-footer-confirmation {
    color: white;
    border-bottom: none !important;
    justify-content: center;
}

modal-footer-confirmation > * {
    width:25%
}

.massive-preload-menu-options {
    width: 50%;
    margin: auto;
    margin-top: 8%;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
}

.list-item-editar-borrador {
    background-color: var(--primaryColor);
    color: white;
}

.list-item-editar-borrador:hover {
    background-color: var(--secondaryColor);
    transition: 0.25s;
}

.list-item-borrar-borrador {
    width: 12%;
    background-color: #E5A6A6;
}

.list-item-borrar-borrador:hover {
    background-color: #E5A6A6;
    transition: 0.25s;
}

.list-item-borrar-borrador:hover > .glyphicon-trash {
    background-color: var(--primaryColor)
}

/* Estilos añadidos en Precarga Masiva*/

/* Inicio Estilos añadidos en Precargas Retornadas: En la rama de trabajo RITM0142335-SPRIN6 no hay mejora de accesibilidad así que se separan los estilos */

.btn-destacar-alerta {
    background-color: #f8d7da;
    color: red;
    border-color: inherit;
}

@media(min-width: 576px) {
    .modal-precargas-retornadas {
        max-width: 70%;
    }

    #modalComfirmUnblockReturnedPreload .modal-dialog {
        max-width: 50%;
    }
}

/* Fin Estilos añadidos en Precargas Retornadas*/

/* Estilos añadidos en Precarga Masiva*/
.fontColor3 {
    color: var(--fontColor3) !important;
}

.cursor-pointer{
    cursor:pointer;
}

.cursor-default {
    cursor:default;
}

.cursor-default a:any-link {
    cursor: default;
}

.font16px {
    font-size: var(--fontSize16px) !important;    
}
/* Fin Estilos añadidos en Precargas Retornadas*/

/* Inicio añadidos en Prorrogs masivas */

#ContentPlaceHolderCuerpo_panelProrogationRequest .form-row {
    margin-bottom: 1.5rem;
}

#ContentPlaceHolderCuerpo_panelProrogationRequest {
    overflow-x: hidden !important;
}

/* Fin estilos añadidos en Prorrogs masivas */

/* Estilos PDF */
.print_area {
    visibility: hidden;
}

.double-column-header {
    display: block;
    width: 100%;
    border-bottom: 1px solid black;
}

.double-column-wrapper {
    display: flex
}

.first-double-column {
    width: 50%;
}

.second-double-column {
    width: 50%;
    border-left: 1px solid black;
}

.columna-compartida {
    width: 125px;
}

/* Fin Estilos PDF */

/* Estilos Peticiones prorrogas */

.columna-peticion-dias-input {
    max-width: 10px;
    width: 10px;
}

.peticion-prorroga-dias-input {
    max-width:3rem;
    text-align: center;
}
/* Fin Estilos Peticiones prorrogas */

/* Inicio Estilos Precarga Paso 3 reajuste de visualización de elementos */

#ContentPlaceHolderCuerpo_dtlstimportadoritem td {
    width: 120px !important;
    max-width: 120px !important;
    padding: 0.5rem 0.2rem !important;
    margin: 0px !important;
    text-align: center;
    white-space: normal !important;
    word-wrap: break-word;
}

#ContentPlaceHolderCuerpo_dtlstimportadoritem {
    border-collapse: separate !important;
    box-sizing: border-box !important;
}

    #ContentPlaceHolderCuerpo_dtlstimportadoritem td {
        width: 120px !important;
        max-width: 120px !important;
        padding: 0.5rem 0.2rem !important;
        margin: 0px !important;
        text-align: center;
        white-space: normal !important;
    }

    #ContentPlaceHolderCuerpo_dtlstimportadoritem .cs10px564b47 {
        word-break: break-word;
    }

.PreloadValidationPanels {
    max-width: 2500px !important;
}

/* Los estilos son casi repetidos a los de arriba pero es necesario hacer esto debido debido a diferencias entre servidor y entorno de desarrollo de los IDs de etiquetas*/

#ctl00_ContentPlaceHolderCuerpo_dtlstimportadoritem td {
    width: 120px !important;
    max-width: 120px !important;
    padding: 0.5rem 0.2rem !important;
    margin: 0px !important;
    text-align: center;
    white-space: normal !important;
}

#ctl00_ContentPlaceHolderCuerpo_dtlstimportadoritem {
    border-collapse: separate !important;
    box-sizing: border-box !important;
}

    #ctl00_ContentPlaceHolderCuerpo_dtlstimportadoritem td {
        width: 120px !important;
        max-width: 120px !important;
        padding: 0.5rem 0.2rem !important;
        margin: 0px !important;
        text-align: center;
        white-space: normal !important;
    }

    #ctl00_ContentPlaceHolderCuerpo_dtlstimportadoritem .cs10px564b47 {
        word-break: break-word;
    }

/* Fin Estilos Peticiones prorrogas */

/*Estilos modulo de COMMENTS*/

.backgroundStandard {
    background: var(--bgColorBody) !important;
    color: var(--fontColor3) !important;
}

    .backgroundStandard:disabled {
        background: var(--bgColorBody) !important;
        color: var(--fontColor3) !important;
    }

    .backgroundStandard:read-only {
        background: var(--bgColorBody) !important;
        color: var(--fontColor3) !important;
    }


/*Tarjeta conversacion + ultimo mensaje*/
.circuloInicialTexto {
    width: 60px;
    height: 60px;
    background-color: var(--bgPrimaryWhite);
    color: var(--fontColorInverse);
    border: solid 2px var(--fontColorInverse);
    border-radius: 50%;
    text-align: center;
    position: absolute;
    top: -10px;
    left: -15px;
}

.circuloSystemaTexto {
    width: 60px;
    height: 60px;
    background-color: var(--bgColorGreyDark);
    color: var(--fontColor);
    border: solid 2px var(--bgColorGreyDark);
    border-radius: 50%;
    text-align: center;
    position: absolute;
    top: -10px;
    left: -15px;
}

    .circuloInicialTexto .centerwrapper {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -45%);
    }

.TextoMensajePadre {
    border-left: solid 5px #C0C0C0;
    background-color: var(--bgColorMenuGrad2);
    font-size: var(--fontSize10px);
    border-right: solid 1px grey;
    border-top: solid 1px grey;
    border-bottom: solid 1px grey;
    padding: 5px;
    display: block;
    width: 100%;
    color: var(--fontColor);
}

.tarjetaMensajeNoLeido {
    background-color: var(--bgtarjetaverde);
    padding-top: 0.6rem
}

.iconoMensajeNoLeido {
    margin: -5px 0px 0px 80px;
}


.iconoCambioEstadoMensaje {
    float: right;
    margin-top: -5px;
}

.tarjetaMensajeLeido {
    background-color: var(--bgColorBodyBlanco);
    padding-top: 0.6rem
}

.TipoConversacion {
    font-size: 1.25rem;
    color: var(--fontColor3);
}

.TituloConversacion {
    font-size: 1.25rem;
    color: var(--fontColor3);
}

.CardConversacionTitulo {
    width: 50%;
    margin: 0px 10px 10px 50px
}

.CardConversacionEstado{
        width: 35%;
        font-size: 0.9rem;
        color: var(--fontColor3);
        margin: 2px 10px 10px 10px;
    }

.CardConversacionMarcarLeidos {
    width: 15%;
    min-width: 250px;
    margin: 2px 50px 10px 10px
}

.usuarioMensaje {
    min-width: 500px;
    color: var(--fontColorGridItem);
    font-weight: var(--fontWeight);
}


.btn-link-ColorBrand {
    color: var(--fontColorBrand);
}

.btn-link-ColorBrand:hover {
    color: var(--fontColorBrand);
}


.btn-link-ColorBrandInverse {
    color: var(--fontColorBrandInverse);
}

.btn-link-ColorBrandInverse:hover {
    color: var(--fontColorBrandInverse);
}


.btn-link-ColorBrand2 {
    color: var(--fontColorBrand2);
}


.btn-link-ColorBrand2:hover {
    color: var(--fontColorBrand2);
}


.btn-responder-mensaje {
    float: right;
    margin: -10px 0px 0px 0px;
    font-size: 1.8rem
}

/*FIN Tarjeta conversacion + ultimo mensaje*/

/*Alerta Mensaje*/
.icon-MessageAlert {
    font-size: 30px;
    margin-right: 10px;
    color: var(--fontColorBrandInverse) !important;
}

.icon-NoMessageAlert {
    font-size: 30px;
    margin-right: 10px;
    color: var(--fontColorGrey2) !important;
}


.circuloNumMensajes {
    width: 15px;
    height: 15px;
    min-width: 15px;
    min-height: 15px;
    background-color: var(--fontColorMandatoryWhite);
    color: var(--fontColorInverse);
    border: solid 2px var(--fontColorMandatoryWhite);
    border-radius: 50%;
    text-align: center;
    position: relative;
    left: 10px;
}


    .circuloNumMensajes .centerwrapper {
        position: absolute;
        top: 20%;
        left: 45%;
        transform: translate(-50%, -45%);        
    }

/*fin Alerta Mensaje*/

.cardPaddinCompact {
    padding-top: 0.5rem;
    padding-bottom: 0.2rem;
}

.btn-quitarPadre {
    position: relative;
    float: right;
    left: 0px;
    top: -20px;
    text-decoration: none;
    color: var(--fontColor);
    height: 30px;
    margin-bottom: -15px;
}

.texto-nuevoComentario {
    height: 100px !important;
    border: 0px !important;
}

.texto-nuevoComentario:focus.texto-nuevoComentario:focus-visible, .texto-nuevoComentario:focus-within {
    box-shadow: 0 0 0 0rem !important;     
}

.checkboxFiltros input {
    height: 25px !important;
    width: 25px !important;
    margin: 7px;
}

.checkboxFiltros ~span {
    top: -7px;
    position: relative;
    font-size: var(--fontSize16px);
    color: var(--fontColorGrey) !important;
}


/*FIN modulo de COMMENTS*/

/* Aviso Template Precarga Ficheros */

.templateWarningIcon{
    position: relative;
    top: 8px;
}

/* FIN Aviso Template Precarga Ficheros */



.sectionHeader {
    padding-right: 10px;
    padding-left: 10px;
}


    .sectionHeader span {
        width: 100% !important;
        background-color: var(--bgPrimaryBlack) !important;
        color: var(--fontColorWhite) !important;
    }

.borderPrimary {
    border: solid 2px var(--fontColorBrand2)
}