@import "../../variables/_colors.css";

/* background color for the whole web page */
.norma--new__dark-theme {
    background-color: var(--norma__bg-dark);
}

    /* norma input stylig */
    .norma--new__dark-theme .norma--input {
        background-color: var(--norma__input--bg-dark);
        color: var(--norma__tx-dark);
        border: 0.5px solid var(--norma__input--border-dark);
    }

        /* error styling for the input */
        .norma--new__dark-theme .norma--input.norma--error {
            border: 0.5px solid var(--norma--danger);
        }

            /* error msg styling */
            .norma--new__dark-theme .norma--input.norma--error ~ .norma--error-msg {
                color: var(--norma--danger);
            }

        /* styling for the focused input */
        .norma--new__dark-theme .norma--input:focus {
            border: 0.5px solid var(--norma-secondary--1);
        }

        /* input placeholder  */
        .norma--new__dark-theme .norma--input::placeholder {
            color: var(--norma__placeholder-dark);
        }

        /* disabled input  */
        .norma--new__dark-theme .norma--input:disabled {
            border: 0.5px solid var(--norma__input-disabled--border-dark);
            background-color: var(--norma__input-disabled--bg-dark);
            color: var(--norma__tx-disabled-dark);
        }

            /* disaled input placeholder */
            .norma--new__dark-theme .norma--input:disabled::placeholder {
                color: var(--norma__placeholder-dark);
            }

    /* floating label  */
    .norma--new__dark-theme .norma--floating-input > label {
        background-color: var(--norma__input--bg-dark);
        color: var(--norma__lbl-dark);
    }

    /* floating label for the disabled input */
    .norma--new__dark-theme .norma--input:disabled ~ label {
        background-color: var(--norma__input-disabled--bg-dark);
        color: var(--norma__lbl-disabled-dark);
    }


    /* #region -> modfied radzen datepicker */
    .norma--new__dark-theme .norma--input > div > .rz-calendar > .rz-calendar-button > .rz-button-icon-left {
        background-color: var(--norma__input--bg-dark) !important;
    }
/* #endregion */