.div-day-week-disabled {
    border-radius: 8px;
    border: 1px solid var(--Grey-200, #E5E7EA);
    background: var(--Grey-100, #F6F7F9);
    cursor: pointer;
    color: var(--Grey-300, #CED2D6);
    text-align: center;
    font-family: Nunito;
    line-height: 18px;
}
.card-element-program {
    border-radius: 4px;
    background: var(--White, #FFF);
    box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.12), 0px 2px 5px 0px rgba(103, 110, 118, 0.08);
    height: 56px;
    cursor:pointer;
}
.card-element-program:hover {
    background-color: var(--Grey-200, #E5E7EA);
}

.dx-list .dx-empty-message {
    padding-top: 16px !important;
    padding-bottom: 16px !important;
}

.badge-program-start-div {
    border-radius: 4px;
    background: var(--Grey-100, #F6F7F9);
}

.modal-title-program {
    font-family: Nunito;
    font-size: 18px;
    font-weight: 600;
    line-height: 24px;
    color: var(--color-dark-blue);
}

.modal-section-title-conditioner {
    font-family: Nunito !important;
    font-size: 18px !important;
    font-weight: 500 !important;
    line-height: 24px !important;
    color: var(--color-dark-blue) !important;
}

.modal-imei-program {
    font-family: Nunito;
    font-size: 14px;
    font-weight: 400;
    line-height: 18px;
    color: var(--color-grey-atlas);
}

.modal-name-program {
    font-family: Nunito;
    font-size: 16px;
    font-weight: 600;
    line-height: 21px;
    color: var(--color-dark-blue);
}

.modal-element-subtitle-program {
    font-family: Nunito;
    font-size: 14px;
    font-weight: 400;
    line-height: 18px;
    color: var(--color-dark-blue);
}

.list-custom-program {
    max-height: 65vh;
    overflow-y: hidden !important;
}

.list-custom-program .dx-texteditor-container {
    height: auto !important;
}

.list-custom-program > .dx-scrollable-container {
    overflow-y: auto !important;
}

.modal-unit-text {
    font-family: Nunito;
    font-weight: 400;
    font-size: 16px;
    color: var(--color-dark-blue);
    margin: 0px !important;
}

#programEnabled-container .sph-switch-loading-target.sph-switch-loading.sph-switch-loading-checked::after {
    left: auto;
    right: 6px;
}

#programEnabled-container .sph-switch-loading-target.sph-switch-loading.sph-switch-loading-unchecked::after {
    right: auto;
    left: 6px;
}

#manualAuto-container .sph-switch-loading-target {
    width: 85px;
}

#manualAuto-container .sph-switch-on-off.sph-switch-auto-manual {
    width: 85px !important;
    padding: 0 8px;
}

#manualAuto-container .sph-switch-on-off.sph-switch-auto-manual::before {
    left: 4px;
    transform: translateY(-50%);
}

#manualAuto-container .sph-switch-on-off.sph-switch-auto-manual::after {
    right: 10px;
    left: auto;
    transform: translateY(-50%);
    text-align: right;
}

#manualAuto-container .sph-switch-on-off.sph-switch-auto-manual:checked::before {
    left: calc(100% - 20px);
}

#manualAuto-container .sph-switch-on-off.sph-switch-auto-manual:checked::after {
    left: 10px;
    right: 30px;
    text-align: left;
}

#manualAuto-container .sph-switch-loading-target.sph-switch-loading.sph-switch-loading-checked::after {
    left: auto;
    right: 6px;
}

#manualAuto-container .sph-switch-loading-target.sph-switch-loading.sph-switch-loading-unchecked::after {
    left: 2px;
    right: auto;
}

#manualAuto-container .sph-switch-loading-target.sph-switch-loading.sph-switch-loading-unchecked::after {
    right: auto;
    left: 6px;
}

/* Barra "ongoing" del detalle CCRR (Detail.cshtml): ancho fijo, a diferencia de la del índice
   (ProgramStatusWithWarning.cshtml), que va en flex dentro de una celda y necesita min/max-width
   en vez de un ancho fijo — por eso no comparten regla. */
.ccrr-detail-ongoing-progress {
    width: 10rem;
}

/* Nombre del actuador en la tabla desplegada de programas CCRR. Bloque con tope propio: con
   columnAutoWidth, DevExtreme mide el texto sin cortar (nowrap de text-truncate) y ensanchaba la
   columna por encima de su Width. El tope es el Width de la columna menos el padding de la celda. */
.ccrr-program-actuator-name {
    display: block;
    max-width: 9rem;
}