/*Canopy - The next generation of stoner streaming software
Copyright (C) 2024  Rainbownapkin and the TTN Community

This program is free software: you can redistribute it and/or modify
it under the terms of the GNU Affero General Public License as
published by the Free Software Foundation, either version 3 of the
License, or (at your option) any later version.

This program is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
GNU Affero General Public License for more details.

You should have received a copy of the GNU Affero General Public License
along with this program.  If not, see <https://www.gnu.org/licenses/>.*/

:root{
    --main-font: "open-sans", sans-serif;
    --bg0: rgb(158, 158, 158);
    --bg1: rgb(70, 70, 70);
    --bg2: rgb(220, 220, 220);
    --bg1-alt0: rgb(30, 30, 30);
    --bg2-alt0: rgb(200, 200, 200);
    --bg2-alt1: rgb(180, 180, 180);

    --accent0: rgb(48, 47, 47);
    --accent0-alt0: rgb(34, 34, 34);
    --accent0-warning: firebrick;
    --accent1: rgb(245, 245, 245);
    --accent1-alt0: rgb(185, 185, 185);
    --accent2: var(--accent0-alt0);


    --userlist-color0:rgb(122, 199, 135);
    --userlist-color1:rgb(242, 104, 77);
    --userlist-color2:rgb(77, 150, 239);
    --userlist-color3:rgb(247, 241, 212);
    --userlist-color4:rgb(255, 173, 173);
    --userlist-color5:rgb(254, 151, 82);
    --userlist-color6:rgb(209, 167, 246);
}

body{
    background-color: var(--bg0);
    font-family: var(--main-font);
    color: var(--accent0);
}

a{
    text-decoration: none;
    color: var(--accent0);
}

a:hover{
    color: var(--accent0-alt0);
}

#navbar{
    background-color: var(--bg1);
}

.navbar-item{
    color: var(--accent1);
    border: hidden;
}

a:hover.navbar-item{
    color: var(--accent1-alt0);
}

.navbar-item input{
    background-color: var(--bg1-alt0);
}

.channel-guide-entry{
    background-color: var(--bg1);
    color: var(--accent1);
}

div.channel-guide-entry{
    border-radius: 0.3em;
    box-shadow: 0.2em 0.2em 0.1em var(--bg1-alt0) inset;
}

a.channel-guide-entry-item{
    color: var(--accent1);
}

a:hover.channel-guide-entry-item{
    color: var(--accent1-alt0);
}

span.channel-guide-entry-item{
    background-color: var(--bg1-alt0);
    box-shadow: 0.2em 0.2em 0.1em black inset;
    border-radius: 0.3em;
    margin: 0 0.1em 0 0.1em;
}


p.channel-guide-entry-item{
    background-color: var(--bg1-alt0);
}

a#account-settings-delete-link{
    color: var(--accent0-warning);
}

#channel-delete{
    color: var(--accent0-warning);
}

#admin-channel-list-table{
    background-color: var(--bg1);
    color: var(--accent1);
}

tr.admin-channel-list-entry{
    box-shadow: var(--accent1) 0px 1em 1px -1em, var(--accent1) 0px -1em 1px -1em;
}

td.admin-channel-list-entry-name-row{
    box-shadow: var(--accent1) 1em 0px 1px -1em, var(--accent1) -1em 0px 1px -1em;
}

a.admin-channel-list-entry-item{
    color: var(--accent1);
}

a:hover.admin-channel-list-entry-item{
    color: var(--accent1-alt0);
}

#media-panel-div{
    background-color: black;
}

#chat-panel-buffer-div{
    background-color: var(--bg2);
}

.chat-entry{
    display: flex;
    background-color: var(--bg2);
    border-bottom: 1px solid var(--bg2-alt1);
    font-size: 0.8em;
}

.chat-entry-username{
    margin: 0.2em;
}

.chat-entry-body{
    margin: 0.2em;
}

.userlist-color0{/*green0*/
     color: var(--userlist-color0);
     text-shadow: none;
}

.userlist-color1{/*red0*/
     color: var(--userlist-color1);
     text-shadow: none;
}

.userlist-color2{/*blue0*/
     color: var(--userlist-color2);
     text-shadow: none;
}

.userlist-color3{/*tan0*/
     color: var(--userlist-color3);
     text-shadow: none;
}

.userlist-color4{/*pink0*/
     color: var(--userlist-color4);
     text-shadow: none;
}

.userlist-color5{/*orange*/
     color: var(--userlist-color5);
     text-shadow: none;
}

.userlist-color6{/*violet*/
     color: var(--userlist-color6);
     text-shadow: none;
}