﻿.sph-program-card > div {
    height: 100%;
}

.sph-program-card .card {
    min-height: 13rem;
    height: 100%;
}

.sph-program-card .sph-program-card-type {
    min-height: 2rem;
    max-height: 4rem;
}

.sph-program-card .sph-program-card-set-auto {
    height: 2rem;
    width: 2rem;
}

.sph-program-card .sph-icon-24 {
    width: 24px;
    height: 24px;
}

.sph-program-card .sph-program-card-fertilizer {
    display: flex;
    padding: 8px;
    justify-content: center;
    align-items: center;
    gap: 10px;
    border-radius: 100px;
    background: var(--Warning-200, #FBF2CB);
    width: 32px;
    height: 32px;
}

    .sph-program-card .sph-program-card-fertilizer > img {
        width: 16px;
        height: 16px;
    }

.sph-program-card .sph-program-card-conditioner-badge {
    display: flex;
    padding: 8px;
    justify-content: center;
    align-items: center;
    gap: 10px;
    border-radius: 100px;
    background: var(--Secondary-500, #0FBAED);
    width: 32px;
    height: 32px;
}

    .sph-program-card .sph-program-card-conditioner-badge > img {
        width: 16px;
        height: 16px;
    }

.sph-program-card .sph-program-card-name {
    max-width: 20rem;
}

.sph-program-card .sph-program-card-set-auto-icon {
    background-color: #283370;
    mask: var(--icon-url) no-repeat center / contain;
    -webkit-mask: var(--icon-url) no-repeat center / contain;
    transition: background-color 0.2s ease;
}

.sph-program-card .sph-program-card-set-auto:hover
.sph-program-card-set-auto-icon {
    background-color: #fff;
    transition: background-color 0.2s ease;
}

.sph-program-card .sph-switch-loading-target.sph-switch-loading.sph-switch-loading-checked::after {
    right: 6px;
    left: auto;
}

.sph-program-card .sph-switch-loading-target.sph-switch-loading.sph-switch-loading-unchecked::after {
    left: 6px;
    right: auto;
}
