﻿/* reset everything to the default box model */

*, :before, :after {
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
}

/* set a border-box model only to elements that need it */

.form-control, /* if this class is applied to a Kendo UI widget, its layout may change */
.container,
.container-fluid,
.row,
.col-xs-1, .col-sm-1, .col-md-1, .col-lg-1,
.col-xs-2, .col-sm-2, .col-md-2, .col-lg-2,
.col-xs-3, .col-sm-3, .col-md-3, .col-lg-3,
.col-xs-4, .col-sm-4, .col-md-4, .col-lg-4,
.col-xs-5, .col-sm-5, .col-md-5, .col-lg-5,
.col-xs-6, .col-sm-6, .col-md-6, .col-lg-6,
.col-xs-7, .col-sm-7, .col-md-7, .col-lg-7,
.col-xs-8, .col-sm-8, .col-md-8, .col-lg-8,
.col-xs-9, .col-sm-9, .col-md-9, .col-lg-9,
.col-xs-10, .col-sm-10, .col-md-10, .col-lg-10,
.col-xs-11, .col-sm-11, .col-md-11, .col-lg-11,
.col-xs-12, .col-sm-12, .col-md-12, .col-lg-12 {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

body {
    text-transform: uppercase;
    /*font-size:12px;*/
    /*line-height:1.1;*/
    /*padding-top: 50px;*/
    /*padding-bottom: 20px;*/
}

.no-mayusculas {
    text-transform: none !important;
}

/* Set padding to keep content from hitting the edges */
.body-content {
    padding-left: 15px;
    padding-right: 15px;
    /*font-size: small;*/
}

/* Override the default bootstrap behavior where horizontal description lists 
   will truncate terms that are too long to fit in the left column 
*/
.dl-horizontal dt {
    white-space: normal;
}

/* Set width on the form input elements since they're 100% wide by default */
/*input,
select,
textarea {
    max-width: 280px;
}*/


.navbar-inverse {
    background-color: #500079;
}

    /*.navbar-inverse .navbar-brand {
        color: white;
    }*/
    /*.navbar-inverse .navbar-brand:hover, .navbar-inverse .navbar-brand:focus {
        color: #500079;
        background-color: white;
    }*/

    .navbar-inverse .navbar-nav > li > a {
        color: white;
    }



        .navbar-inverse .navbar-nav > li > a:hover, .navbar-inverse .navbar-nav > li > a:focus {
            color: #500079;
            background-color: white;
        }

a.navbar-brand {
    padding-top: 0;
    padding-bottom: 0;
}

    a.navbar-brand img {
        height: 46px;
    }

/*.form-control.k-widget { padding: 0; width: 100%; height: auto; }

.form-control.k-widget:not(.k-autocomplete) { border-width: 0; }*/

.k-autocomplete, .k-combobox, .k-datepicker, .k-timepicker, .k-datetimepicker, .k-colorpicker, .k-numerictextbox, .k-dropdown, .k-selectbox, .k-textbox, .k-toolbar .k-split-button {
    width: 100%;
}

/*.toast-middle-full-width {
  top: 100px;
  right: 0;
  width: 100%;
}


.toast-top-full-width{
    top:30%;
    min-height:300px;
    height:300px;
}*/

.navbar {
    padding-left: 30px;
    padding-right: 30px;
    font-size: 11px;
}


h1 {
    font-family: 'Roboto', sans-serif;
    font-weight: 900;
    font-size: 28px;
    color: #500079;
}


.select2-container .select2-choice {
    border: none;
    background-image: none;
}

.select2-container {
    padding: 0;
}

    .select2-container.form-control a {
        height: 32px;
    }

/* --- Reset para evitar negritas globales en Select2 --- */
/*.select2-results li > .select2-result-label { font-weight: normal; }*/

/* --- Hover global tipo dropdown-menu (gris) --- */
/*.select2-results .select2-highlighted > .select2-result-label {
  background-color: #ddd !important;
}*/
/* Evita que Select2 ponga el texto blanco al hacer hover */
/*.select2-results .select2-highlighted { color: inherit !important; }*/

/* =========================
   Variantes SOLO en resaltadas
   (li.option-resaltada.opt-variant-*)
   ========================= */

/* DANGER = exactamente tu ejemplo .destacado */
.select2-results li.option-resaltada.opt-variant-danger { color: #c00; }
.select2-results li.option-resaltada.opt-variant-danger > .select2-result-label {
  background-color: #ffcccc; /* igual que .destacado */
  font-weight: bold;
}

/* PRIMARY (azul suave) */
.select2-results li.option-resaltada.opt-variant-primary { color: #004085; }
.select2-results li.option-resaltada.opt-variant-primary > .select2-result-label {
  background-color: #cce5ff;
  font-weight: bold;
}

/* SUCCESS (verde suave) */
.select2-results li.option-resaltada.opt-variant-success { color: #155724; }
.select2-results li.option-resaltada.opt-variant-success > .select2-result-label {
  background-color: #d4edda;
  font-weight: bold;
}

/* WARNING (ámbar suave) */
.select2-results li.option-resaltada.opt-variant-warning { color: #856404; }
.select2-results li.option-resaltada.opt-variant-warning > .select2-result-label {
  background-color: #fff3cd;
  font-weight: bold;
}

/* INFO (cian suave) */
.select2-results li.option-resaltada.opt-variant-info { color: #0c5460; }
.select2-results li.option-resaltada.opt-variant-info > .select2-result-label {
  background-color: #d1ecf1;
  font-weight: bold;
}

/* DEFAULT (gris claro) */
.select2-results li.option-resaltada.opt-variant-default { color: #333; }
.select2-results li.option-resaltada.opt-variant-default > .select2-result-label {
  background-color: #f5f5f5;
  font-weight: bold;
}

/* SECONDARY (gris medio) */
.select2-results li.option-resaltada.opt-variant-secondary { color: #383d41; }
.select2-results li.option-resaltada.opt-variant-secondary > .select2-result-label {
  background-color: #e2e3e5;
  font-weight: bold;
}

/* Hover global: solo fondo gris, nada de cambiar color */
/*.select2-results .select2-highlighted > .select2-result-label {
    background-color: #ddd !important;
}

.select2-results .select2-highlighted {
    color: inherit !important;*/ /* evita el texto blanco/negro por defecto de Select2 */
/*}*/

/* === Hover por variante (resaltadas): mantiene SU color original === */
/* DANGER: igual a tu .destacado (#c00) */
.select2-results li.option-resaltada.opt-variant-danger.select2-highlighted > .select2-result-label {
    color: #c00 !important;
    background-color: #ddd !important; /* solo fondo gris */
}

/* PRIMARY */
.select2-results li.option-resaltada.opt-variant-primary.select2-highlighted > .select2-result-label {
    color: #004085 !important;
    background-color: #ddd !important;
}

/* SUCCESS */
.select2-results li.option-resaltada.opt-variant-success.select2-highlighted > .select2-result-label {
    color: #155724 !important;
    background-color: #ddd !important;
}

/* WARNING */
.select2-results li.option-resaltada.opt-variant-warning.select2-highlighted > .select2-result-label {
    color: #856404 !important;
    background-color: #ddd !important;
}

/* INFO */
.select2-results li.option-resaltada.opt-variant-info.select2-highlighted > .select2-result-label {
    color: #0c5460 !important;
    background-color: #ddd !important;
}

/* DEFAULT */
.select2-results li.option-resaltada.opt-variant-default.select2-highlighted > .select2-result-label {
    color: #333 !important;
    background-color: #ddd !important;
}

/* SECONDARY */
.select2-results li.option-resaltada.opt-variant-secondary.select2-highlighted > .select2-result-label {
    color: #495057 !important;
    background-color: #ddd !important;
}


/* Para selects SIN select2, conserva tu semántica: */
option.option-resaltada { font-weight: bold; }



.footer {
    color: white;
    margin-top: -40px;
}

    .footer .accion {
        background-color: #612D77;
        padding-top: 10px;
        padding-bottom: 10px;
        cursor: pointer;
    }

        .footer .accion:hover, .footer .accion:focus {
            background-color: #500079;
        }


#wrap {
    /*min-height:565px;*/
    /*min-height:100%;*/
}

#main {
    padding-bottom: 50px;
}


body, html {
    height: 100%;
}
/*.container{
 min-height:100%;
}*/

.fa-pulse {
    -webkit-animation: fa-spin 1s infinite steps(8);
    -moz-animation: fa-spin 1s infinite steps(8);
    -o-animation: fa-spin 1s infinite steps(8);
    animation: fa-spin 1s infinite steps(8);
}

@media (min-width: 768px) {
    .navbar {
        border-radius: 0;
    }
}


label {
    font-size: 12px;
    margin-bottom: 0;
}

.form-group {
    margin-bottom: 4px;
}

input, option, textarea, select {
    text-transform: uppercase;
}

.table > tbody > tr > td.accion {
    padding: 0;
}

/*Lo nuevo en el diseño menu y tablas*/
.navbar {
    margin-bottom: 5px;
}

h1 {
    margin: 16px 0;
}

.panel-heading {
    padding-top: 5px;
    padding-bottom: 5px;
}

.panel-body {
    padding-top: 10px;
    padding-bottom: 10px;
}

.table {
    font-size: 12px;
}

.navbar-inverse .navbar-nav > li > a {
    font-weight: bold;
}

.contenido-inicio-combo {
    background-color: #ABABAB;
    padding-top: 2px;
    padding-bottom: 2px;
    margin-top: 4px;
    margin-bottom: 4px;
    height: 28px;
    color: white;
    font-size: 13px;
    font-weight: bold;
    border-color: white;
}

.contenido-inicio-etiqueta {
    background-color: #ABABAB;
    /*height:2em;*/
    font-size: small;
    padding-top: 5px;
    padding-bottom: 5px;
    font-weight: bolder;
    color: white;
    margin-top: 5px;
    margin-bottom: 5px;
    height: 25px;
}

/*Lo nuevo en el diseño menu y tablas*/


.select2-container .select2-choice .select2-arrow {
    background-color: white;
    background-image: none;
    border: none;
}

/*.k-numerictextbox .k-input*/
.ob-right {
    width: 96%;
    text-align: right;
    padding-right: 5px !important;
}

input.k-formatted-value.ob-right.k-input {
    width: 96%;
}


.caret-up {
    width: 0;
    height: 0;
    border-left: 4px solid rgba(0, 0, 0, 0);
    border-right: 4px solid rgba(0, 0, 0, 0);
    border-bottom: 4px solid;
    display: inline-block;
    margin-left: 2px;
    vertical-align: middle;
}

.dropdown-menu > li > a {
    padding: 1px 20px;
}

.form-group.has-error .k-picker-wrap {
    border: solid 1px #f56954;
    /*Borde de fecha y horas has-error help-block*/
}

.form-group.has-error .k-numeric-wrap {
    border: solid 1px #f56954;
    /*Borde de numerico has-error help-block*/
}

/* Modal con scrollbar */
.modal-dialog-overflow {
    overflow-y: initial !important;
    margin-bottom: 10px !important;
}

.modal-body-overflow {
    height: 70vh;
    overflow-y: auto;
}

    .modal-dialog-overflow::-webkit-scrollbar,
    .modal-body-overflow::-webkit-scrollbar {
        width: 5px;
        height: 5px;
        margin: 0 -5px;
    }

/* Carril */
    .modal-dialog-overflow::-webkit-scrollbar-track,
    .modal-body-overflow::-webkit-scrollbar-track {
        border-radius: 10px;
        background: transparent;
    }

/* Manejador */
    .modal-dialog-overflow::-webkit-scrollbar-thumb,
    .modal-body-overflow::-webkit-scrollbar-thumb {
        background: rgba(50, 50, 50, 0.75);
        border-radius: 10px;
    }

/* Manejador en hover */
        .modal-dialog-overflow::-webkit-scrollbar-thumb:hover,
        .modal-body-overflow::-webkit-scrollbar-thumb:hover {
            background: #500079;
            transition: linear 1s;
        }

option.option-resaltada {
    color: #d93025;
    font-weight: 600;
}

/* Nueva pantalla de carga */
.pantalla-carga {
    position: fixed;
    top: 0;
    left: 0;
    background: rgba(255,255,255,0.75);
    backdrop-filter: blur(1px);
    width: 100%;
    height: 100%;
}


    .pantalla-carga > .contenido {
        margin: auto;
        margin-top: 10em;
        text-align: center;
    }

        .pantalla-carga > .contenido > .spinner {
            position: relative;
            height: 100px;
            width: 100px;
            margin: auto;
            border: 4px solid transparent;
            border-top-color: #500079;
            border-left-color: #500079;
            border-radius: 50%;
            -webkit-animation: spin 1.5s linear infinite;
            animation: spin 1.5s linear infinite;
        }

            .pantalla-carga > .contenido > .spinner::before {
                position: absolute;
                top: 15px;
                left: 15px;
                right: 15px;
                bottom: 15px;
                content: "";
                border: 4px solid transparent;
                border-top-color: #733394;
                border-left-color: #733394;
                border-radius: 50%;
                -webkit-animation: spinBack 1s linear infinite;
                animation: spinBack 1s linear infinite;
            }

@-webkit-keyframes spin {
    from {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    to {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@keyframes spin {
    from {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    to {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@-webkit-keyframes spinBack {
    from {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    to {
        -webkit-transform: rotate(-720deg);
        transform: rotate(-720deg);
    }
}

@keyframes spinBack {
    from {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    to {
        -webkit-transform: rotate(-720deg);
        transform: rotate(-720deg);
    }
}


/* styles for validation helpers */
.field-validation-error {
    color: #b94a48;
}

.table-comprimida > tbody > tr > td {
    padding: 2px;
}

.font-bold {
    font-weight: bold;
}


/* tabla sin bordes */
.table-borderless > tbody > tr > td,
.table-borderless > tbody > tr > th,
.table-borderless > tfoot > tr > td,
.table-borderless > tfoot > tr > th,
.table-borderless > thead > tr > td,
.table-borderless > thead > tr > th {
    border: none;
}


/*
 * Component: modal
 */

@media (min-width: 768px) {
    .modal-dialog {
        width: 800px;
        margin: 30px auto;
    }
}

@media print {
    .toast {
        display: none !important;
    }
}
