/*
    Resaltar más cuando un filtro está activa
    Al final se descarto, se prefirio poner el propio icono de telerik de filtro como una T en negro cuando el filtro esta activo
.k-grid-filter.k-state-active {
    background-color: #FF2F76;
    background-color: #0E457F;
}
*/

/** Corregir carga **/
.k-grid-content:has(> .k-loading-mask) {
    min-height: 80px !important;
}

/* El texto editable del grid debe ser negro */
.k-grid-content .k-grid-edit-row .k-edit-cell input {
    color: black !important;
}

/* Quitar el color del borde inferior */
.k-grid td.k-state-selected, .k-grid tr.k-state-selected > td {
    border-color: inherit !important;
}

/* selectpicker */
.bootstrap-select > .btn.dropdown-toggle.btn-default {
    background-color: white !important;
}

    .bootstrap-select > .btn.dropdown-toggle.btn-default.disabled {
        background-color: #eee !important;
        opacity: 1;
    }

    .bootstrap-select > .btn.dropdown-toggle.btn-default:hover {
        border: solid 1px gainsboro !important;
    }

.bootstrap-select .btn.dropdown-toggle .bs-caret .caret {
    right: 10px !important;
    border-top: 6px dashed;
    border-top: 6px solid\9;
    border-right: 6px solid transparent;
    border-left: 6px solid transparent;
}

.bootstrap-select.dropup .btn.dropdown-toggle .bs-caret .caret {
    right: 10px !important;
    border-top: 0px dashed;
    border-bottom: 6px dashed;
    border-top: 6px solid\9;
    border-right: 6px solid transparent;
    border-left: 6px solid transparent;
}

/** RESULTADOS MULTITARIFICACION **/
.k-header.k-grid-toolbar {
    border-color: white !important;
}

.k-grid-content tr > td {
    line-height: unset;
}

.k-grid-toolbar, .k-grid-header, .k-grouping-header {
    overflow: auto;
    position: sticky;
    z-index: 10;
}

.k-grid-content {
    transform: rotateX(180deg);
}

    .k-grid-content table {
        transform: rotateX(180deg);
    }

.k-header input[type=checkbox] {
    vertical-align: middle;
    margin: auto;
}

.k-header .hide-columns {
    overflow: auto;
}

    .k-header .hide-columns label {
        margin: 0px 5px 0px 0px;
    }

.k-auto-scrollable {
    overflow-x: hidden;
}

.k-animation-container, .k-animation-container .k-list-container.k-popup.k-group.k-reset.k-state-border-up, .k-list-container.k-popup.k-group.k-reset.k-state-border-down {
    /*min-width: 200px !important;*/
}

/*************************************/
.k-grid tr.k-state-selected:hover {
    background-color: rgba(255, 47, 118, .16) !important;
    color: #444444 !important;
}

.k-grid td.k-state-selected:hover, .k-grid tr.k-state-selected:hover td {
    background-color: rgba(255, 47, 118, .16) !important;
    color: #444444 !important;
}

.k-scheduler-layout .k-state-selected, .k-scheduler .k-today.k-state-selected, .k-grid tr.k-state-selected, .k-grid td.k-state-selected, .k-grid td.k-state-selected.k-state-focused, .k-marquee-color, .k-gantt .k-treelist .k-state-selected, .k-gantt .k-treelist .k-state-selected td, .k-gantt .k-treelist .k-alt.k-state-selected, .k-gantt .k-treelist .k-alt.k-state-selected > td, .k-listview > .k-state-selected, .k-state-selected.k-line {
    background-color: rgba(255, 47, 118, .16) !important;
    color: #444444 !important;
}

.k-action-buttons {
    margin: 0.5em 0em !important;
}

.k-hidden {
    display: none !important;
}

.k-filter-menu-container > .k-multiselect > .k-multiselect-wrap > .k-i-close {
    top: 5px;
}

.k-multiselect > .k-multiselect-wrap .k-select {
    padding: 0.1em 0em;
}

.k-filter-menu .k-multiselect .k-button {
    width: auto;
    margin: 1px 0 1px 1px;
}

.k-icon.k-i-filter {
    background-image: none;
    border-color: none;
    display: inline-block;
    font: normal normal normal 14px/1 FontAwesome;
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
}

/* Al activar el filtro de telerik se pone el icono de color NEGRO*/
.k-grid-filter.k-state-active .k-icon {
    background-color: transparent;
    color: #000000;
    opacity: 1;
}

/* Al marcar una casilla de la rejilla salia un cerco de color alrededor, que sobre una casilla de
   12px se ve como un borron. Es el anillo de foco del navegador -outline: auto 5px-, que toma el
   color de acento de Windows, asi que cambia de una maquina a otra: aqui sale naranja. Kendo apaga
   el outline en .k-checkbox pero no en el estado de foco, que es cuando el navegador lo pinta. */
.k-grid .k-checkbox:focus,
.k-grid .k-checkbox:focus-visible {
    outline: none;
}

/* El tooltip de las columnas de siniestros, que trae el detalle de cada parte, no cabe en una
   linea. Un tooltip de Bootstrap se estira hasta donde le deje el hueco que tiene por delante, y
   style-ni.css le quita el tope de 200px que trae Bootstrap -.tooltip-inner { max-width: 100%
   !important }-, asi que con la columna a la izquierda de la pantalla el texto salia en una linea
   de lado a lado. Se le pone media pantalla de tope para que parta en varias lineas.
   La clase la trae el propio tooltip por el data-template del span (TarificacionesHelper
   .GetPlantillaSiniestros): Bootstrap monta el tooltip aparte, al final del contenedor, sin nada
   que lo ate a la celda que lo abrio, asi que no hay forma de llegar a el por el arbol.
   El !important, porque el de style-ni.css lo lleva. */
.tooltip-media-pantalla .tooltip-inner {
    max-width: 50vw !important;
    /* Y de alto, el 80% de la ventana. Lo que sobra se recorta con puntos suspensivos, que los pone
       recortarTooltipSiniestros (TooltipsTarificaciones.js) sobre el contenido: -webkit-line-clamp
       solo entiende lineas, asi que el JS mide el alto que deja este max-height y lo traduce. */
    max-height: 80vh;
    overflow: hidden;
}

.tooltip-media-pantalla .tooltip-inner > div {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.k-header a.k-button span.fa {
    font-size: 30px;
}

.k-header div.btn-group.bootstrap-select {
    display: inline-flex;
    margin: 5px 2px 0px 2px;
}

/*.k-header a.k-button {
    width: 50px;
}*/

.k-icon.k-i-filter:before {
    content: "\f0b0";
}

.k-grid-filter {
    padding: .714em 0.714em 0.714em 0em;
}


.k-state-border-down span.k-state-active {
    background-color: inherit;
}

.k-grid table {
    border-collapse: collapse !important;
}

.k-grid td {
    padding: .929em .1em !important;
}

.k-grid-header th.k-header {
    padding: .786em .1em !important;
}

label.k-checkbox-label.k-no-text.label-selectall {
    padding-top: 3px !important;
}

label.k-checkbox-label.k-no-text {
    padding-bottom: 3px !important;
}

.marked-row/*:not(:first-child)*/ {
    box-shadow: inset 2px 0px 0 black, inset 0px 2px 0 black, inset -2px 0px 0 black, inset 0px -3px 0 black !important;
}

.inbox-email.marked-row:not(:first-child) {
    border: solid 2px black;
}

/*.marked-row:first-child {*/
    /*box-shadow: inset -2px 0 0 black, inset 0 -2px 0 black, inset 2px 0 0 black, inset 0 2px 0 black;
}*/

.inbox-email.marked-row:first-child {
    border: solid 2px black;
}

.k-checkbox-custom {
    display: inline;
    opacity: 0;
    width: 0;
    margin: 0;
    -webkit-appearance: none;
    overflow: hidden;
}

    .k-checkbox-custom:checked + .k-checkbox-label:before {
        content: "\2713";
        background-color: #0E457F;
        border-color: #0E457F;
        color: #ffffff;
    }

/* Scroll */
div.k-grid-header {
    padding-right: 0px !important;
}

.k-grid-header-wrap {
    border-right-width: 0px !important;
}

.k-grid-content {
    overflow-y: auto !important;
}



.k-grid .k-grid-header th.k-header .k-checkbox-label {
    /*font-size: 10px !important;*/
}

.k-grid .k-grid-header th.k-header {
    padding: 0.1em 0.15em !important;
    /*font-size: 14px !important;*/
}

.k-grid-content tr td:not(:last-child) .k-checkbox-label {
    /*font-size: 10px !important;*/
}

.k-grid-content tr td {
    padding: 0.1em 0.15em !important;
    font-size: 11px !important;
    height: 35px;
}

    .k-grid-content tr td:not(:last-child) {
        border-right-width: 1px !important;
        border-right-style: solid !important;
        border-right-color: lightgray !important;
    }

/*   Para la foto de la 1a columna en los grid de telerik */
.customer-photo {
    display: inline-block;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background-size: 32px 35px;
    background-position: center center;
    vertical-align: middle;
    line-height: 32px;
    box-shadow: inset 0 0 1px #999, inset 0 0 10px rgba(0,0,0,.2);
    margin-left: 5px;
}

.customer-name {
    display: inline-block;
    vertical-align: middle;
    line-height: 32px;
    padding-left: 3px;
}

/*  fin de la 1a columna de los grid de telerik */


/************   Estilos para hacer las líneas más estrechas y las fuentes de los grid más pequeñas...  **/
/*.k-grid tbody tr{
    font-size:10px;
}*/

.k-grid {
    /*height: 14px !important;*/
    /*color:red;*/
    font-size: 10px;
}

    .k-grid td {
        white-space: nowrap;
    }


    .k-grid .btn-xs {
        /*height: 14px !important;*/
        /*color:red;*/
        padding: 2px 6px 2px 6px !important;
    }

/* Iconos de la tabla */
.k-header .k-icon {
    background-position-y: -2px;
}

.k-i-arrow-end-left {
    background-position: 0px -112px;
}

.k-i-arrow-60-left {
    background-position: 0px -48px;
}

.k-i-arrow-60-right {
    background-position: 0px -16px;
}

.k-i-arrow-end-right {
    background-position: 0px -80px;
}

.k-i-arrow-60-down {
    background-position: 0px -32px;
}

.k-i-sort-desc-sm {
    background-position: 0px -32px;
}

.k-i-sort-asc-sm {
    background-position: 0px 0px;
}