/**
 * Estilos específicos para el menú lateral de empleados
 */
.infobar-wrapper.employer-wrapper {
    min-width: 285px !important;
    width: 285px !important;
}
.infobar-wrapper.employer-wrapper .infobar #widgetarea .widget form #options {
    height: calc(100% - 84px) !important;
}
.infobar-wrapper.employer-wrapper .infobar #widgetarea .widget form #options .widget-body .grupo-input {
    height: 97%;
    /*overflow: hidden;*/
}
.block-employers .js-employers-content {
    height: 100%;
    overflow-y: auto;
}
.block-employers .employers-list {
    padding: 0;
    margin: 0;
}
.block-employers .block-filter {
    padding-bottom: 10px;
    position: relative;
}
.block-employers .block-filter input {
    float: left;
    width: 100%;
}
.block-employers .employer-item {
    border-top:1px solid #CCC;
    padding: 5px;
    float: left;
    width: 100%;
    display: flex;
}
.block-employers .employer-item .employer-item-avatar,
.block-employers .employer-item .employer-item-info {
    float: left;
    display: flex;
    justify-content: center;
    align-content: center;
    flex-direction: column;
}
.block-employers .employer-item .employer-item-avatar {
    padding-right: 10px;
}
.block-employers .employer-item .header-avatar {
    height: 70px;
    width: 70px;
    object-fit: cover;
}
.block-employers .employer-item .employer-item-name,
.block-employers .employer-item .employer-item-status {
    text-align: left;
}
.block-employers .employer-item .employer-item-field,
.block-employers .employer-item .employer-item-name,
.block-employers .employer-item .employer-next-vacationday,
.block-employers .employer-item .employer-item-name a {
    color: rgba(27, 34, 44, 0.72);
    /*font-size: 1em;*/
}
.block-employers .employer-item .employer-item-field,
.block-employers .employer-item .employer-item-status,
.block-employers .employer-item .employer-next-vacationday {
    font-size: 0.85em; /*10px*/
}
.block-employers .employer-item .employer-item-name img,
.block-employers .employer-item .employer-item-field img {
    height: 20px;
    width: 20px;
    border: 1px solid darkgray;
}


/**
 * Estilos específicos para el modal de Happiness y BreakType del dashboard
 */
.js-modal-dashboard-stop .css-field {
    text-align: center;
    height: auto;
    /*overflow: hidden;*/
}
.js-modal-dashboard-stop .css-field input {
    display: none;
}
.js-modal-dashboard-stop .css-field .tooltip-inner {
    max-width: none;
    white-space: nowrap;
}
.js-modal-dashboard-stop .css-field .block-icon img,
.js-modal-dashboard-stop .css-field .block-icon span {
    opacity: 0.4;
}
.js-modal-dashboard-stop .css-field .block-icon.selected img,
.js-modal-dashboard-stop .css-field .block-icon.selected span {
    opacity: 1;
}
.js-modal-dashboard-stop .css-field .block-icon.selected.block-icon-break img,
.js-modal-dashboard-stop .css-field .block-icon.selected.block-icon-break span {
    border: 1px solid #000;
}
.js-modal-dashboard-stop .css-field .block-icon span {
    font-size: 28px;
}
.js-modal-dashboard-stop .css-field .block-icon.selected span {
    color: #000; /*#b1b1b1;*/
}
.js-modal-dashboard-stop .css-field .block-icon span.image {
    background-size: 75%;
    background-position: center center;
    height: 128px;
    width: 100%;
    background-repeat: no-repeat;
}


/**
 * Estilos específicos para la sección de la Gráfica correspondiente a un resultado clave
 */
#tabChart #chart-key-result {
    height: 320px;
}