:root[data-theme="dark"] {
    --bg: linear-gradient(
            to bottom right,
            #373737 0%,
            #252628 23%,
            #000309 100%
    );
    --text-color: #FBFBFB;
    --text-color-2: rgb(251 251 251 / 50%);
    --shadow-soft: 0 4px 12px rgb(0 0 0 / 10%);

    /* Display */

    /* Theme switcher */
    --sun-bg: #1B6A9C;
    --moon-bg: #003661;

    /* Keypad */
    --buttons-bg: linear-gradient(
            to top right,
            rgb(0 34 53) 0%,
            rgb(19 63 100) 58%,
            rgb(23 73 105) 85%,
            rgb(28 79 106 / 90%) 90%
    );
    --button-bg: rgb(9 23 37 / 60%);
    --button-bg-dark: rgb(11 32 51 / 80%);
    --button-bg-section: #0E2C43;
    --button-bg-hover: #0B2030;
}

/* Скрыть светлые иконки в тёмной теме */
html[data-theme="dark"] .calculator__history--light,
html[data-theme="dark"] .calculator__icon--light {
    display: none;
}

html[data-theme="dark"] .calculator__history--dark,
html[data-theme="dark"] .calculator__icon--dark {
    display: inline-block;
}
