/* Color theme transition */
#navbar,
#pageWrapper,
#intro {
    transition: background-color 0.25s linear 0s, color 0.25s linear 0s;
}

.light1 {
    --main-color: #45a29e;
    --main-color-light: #12d3c6;
    --bg-color: #fefae0;
    --scollbar-bg: #171d24;
    --scollbar-fg: #2c3847;
    --text-color: #3c493b;
}

.dark1 {
    --main-color: #45a29e;
    --main-color-light: #66fcf1;
    --text-color: #c5c6c7;
    --bg-color: #141722;
    --scollbar-bg: #171d24;
    --scollbar-fg: #2c3847;
}

[data-theme="light"] {
    --main-color: #45a29e;
    --main-color-light: #12d3c6;
    --bg-color: #fefae0;
    --scollbar-bg: #171d24;
    --scollbar-fg: #2c3847;
    --text-color: #3c493b;


    --main-color: #4f90aa;
    --main-color-light: #89cde7;

    --main-color: #45a29e;
    --main-color-light: #12d3c6;

    /* --main-color: #45a29e;
    --main-color-light: #66fcf1; */

    --bg-color: #f7f2e8;
    --bg-color: #f5f5f5;
    --scollbar-bg: #e6e6e6;
    --scollbar-fg: #b6b6b6;
    --text-color: #4e4f53;

    /* --text-color: #413b36; */
}

[data-theme="dark"] {
    --main-color: #45a29e;
    --main-color-light: #66fcf1;
    --text-color: #c5c6c7;
    --bg-color: #0b0c10;
    --bg-color: #141722;
    --scollbar-bg: #171d24;
    --scollbar-fg: #2c3847;
}