@import "AccountCard.css";
@import "ChannelList.css";

body {
    margin: 0;
    padding: 0;
    background-color: #aa88ff;
    font-family: "gg sans", "Noto Sans", "Helvetica Neue", Helvetica,Arial, sans-serif;
    font-size: 16px;
    color: whitesmoke;
}

.App {
    display: flex;
    flex-direction: row;
    height: 100vh;

    .Sidebar {
        display: flex;
        flex-direction: column;
        width: 20%;

        .SidebarBranding {
            display: flex;
            flex-direction: row;
            justify-content: center;
            align-items: center;
            padding: 4px;
            height: 48px;
            gap: 6px;
            background-color: #333;
            font-size: 2.0rem;
            font-weight: bold;
        }

        .SidebarNavigation {
            flex: 1;
            display: flex;
            flex-direction: column;
            padding: 6px;
            background-color: #444;
        }

        .SidebarAccount {
            display: flex;
            flex-direction: row;
            align-items: center;
            padding: 6px;
            height: 60px;
            background-color: #333;
        }
    }
}