/* import bulmin variable */
@import "bulmin/_variable";
/* import components style */
@import "bulmin/_utility";
@import "bulmin/_navbar";
@import "bulmin/_badge";
@import "bulmin/_sidebar";
@import "bulmin/_widget";
/* import bulma */
@import "_bulma";

.light-mode{
    background-color: $light-background;
    body{
        font: $base-font;
        color: $light-color-font;
    }
}
.dark-mode{
    background-color: $dark-background;
    body{
        font: $base-font;
        color: $dark-color-font;
    }
    .footer{
        &.is-force-black-dark-mode{
            background-color: $dark-background; 
            color: $dark-color-font;
        }
    }
    .box{
        &.is-force-black-dark-mode{
            background-color: $dark-sidebar; 
            color: $dark-color-font;
        }
        .title{
            color: $dark-color-font;    
        }
        .breadcrumb{
            ul{
                li{
                    a{
                        color: $dark-color-font;
                        &:hover{
                            color: rgb(184, 181, 181);
                        }
                    }
                }
            }
        }
    }
    .table{
        background-color: unset;
        color: $dark-color-font;
        th{
            color: $dark-color-font;
        }
        &.is-striped tbody tr:not(.is-selected):nth-child(even), 
        &.is-striped.is-hoverable tbody tr:hover,
        &.is-striped.is-hoverable tbody tr:not(.is-selected):nth-child(even){
            background-color: $dark-background;
        }
    }
}