.ntsh-outofservicemode {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 20px;
    margin-top: 30px;
}

.ntsh-timer {
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 10px;
    margin-top: 30px;

    .ntsh-timer-row {
        display: flex;
        justify-content: flex-start;
        align-items: center;
        gap: 20px;

        h4 {
            width: 85px;
        }

        input[type="time"] {
            position: relative;
            padding: 10px;
            border: 2px solid #000;
            font-weight: 500;
            transition-duration: 0.2s;
            cursor: pointer;
            font-size: 20px;

            &::-webkit-calendar-picker-indicator {
                background: transparent;
                bottom: 0;
                color: transparent;
                cursor: pointer;
                height: auto;
                left: 0;
                position: absolute;
                right: 0;
                top: 0;
                width: auto;
            }
        }

    }
}

.ntsh-autolighting {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 20px;
    margin: 30px 0px;
}


.ntsh_lightingsettings-container {
    width: 100%;

    &.disabled {
        opacity: .3;
        pointer-events: none;
    }

    h3 {
        margin-bottom: 10px;
    }

    .ntsh_lightingsettings {
        width: 100%;
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: flex-start;
        gap: 5px;

        .ntsh_lightingsettings-row {
            display: flex;
            justify-content: flex-start;
            align-items: center;
            gap: 20px;

            h4 {
                width: 120px;
            }

            input {
                position: relative;
                padding: 10px;
                border: 2px solid #000;
                font-weight: 500;
                transition-duration: 0.2s;
                cursor: pointer;
                font-size: 20px;

                &::-webkit-calendar-picker-indicator {
                    background: transparent;
                    bottom: 0;
                    color: transparent;
                    cursor: pointer;
                    height: auto;
                    left: 0;
                    position: absolute;
                    right: 0;
                    top: 0;
                    width: auto;
                }
            }
        }
    }
}

.ntsh_soundsettings {
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 5px;

    &.disabled {
        opacity: .3;
        pointer-events: none;
    }

    .ntsh_soundsettings-row {
        display: flex;
        justify-content: flex-start;
        align-items: center;
        gap: 20px;

        h4 {
            width: 120px;
        }

        input {
            padding: 10px;
            border: 2px solid #000;
            font-weight: 500;
            transition-duration: 0.2s;
            cursor: pointer;
            font-size: 20px;

            &::-webkit-calendar-picker-indicator {
                background: transparent;
                bottom: 0;
                color: transparent;
                cursor: pointer;
                height: auto;
                left: 0;
                position: absolute;
                right: 0;
                top: 0;
                width: auto;
            }
        }
    }
}

.ntsh_soundsettings-resetcontainer {
    width: 100%;
    display: flex;
    justify-content: flex-end;
    margin-bottom: 30px;

    .ntsh_soundsettings-reset {
        padding: 10px 20px;
        border: 2px solid #000;
        font-weight: 500;
        transition-duration: .2s;
        cursor: pointer;

        &:hover {
            background: #d7ccc1;
        }
    }
}