/* color definitions */
body {background-color:#BBB}
#titleBar {background-color:darkblue; color:white}
body[aid] #titleBar {background-color:green}
body[aid] .dialog:hover, body[aid] .dialog.modal {--bgCaption:green; --fgCaption:white }
.btnAudio {background-color:green; color:white}
body[data-muted='1'] .btnAudio {background-color:red}

#frmWho {background-color:#666}
#whoList > * {color:#BBB}
#whoList > *[online] {color:white}
#whoList > *[self] {color:yellow}

#logon {background-color:green; color:white}
#logonError {color:yellow}

/***************************
** chatbox
****************************/
#frmChat    {--bgColor:#F0F0F0; --fgColor:#222}

.chatMsg[data-type=msg] ctime { color:#222}
.chatMsg[data-type=msg] cname { color:var(--fgColor)}
.chatMsg[data-type=msg] ctext { background-color:white; color:var(--fgColor); border-color:var(--fgColor)}
.chatMsg[data-type=msg]:nth-child(odd)  {--fgColor:#060}
.chatMsg[data-type=msg]:nth-child(odd)  ctext {--bgColor:#FCFFFC}
.chatMsg[data-type=msg]:nth-child(even) {--fgColor:#22A}
.chatMsg[data-type=msg]:nth-child(even) ctext {--bgColor:#FEFEFF}

.chatMsg[data-type=good]  { --bgColor:green; --fgColor:white }
.chatMsg[data-type=bad]    { --bgColor:orangered; --fgColor:white }
.chatMsg[data-type=error] { --bgColor:red; --fgColor:white }

/***************************
** bingo
****************************/
#frmBingo > .tile { border-width:1vmin; border-style:solid }
#frmBingo > .title { background-color:lightyellow; color:black; border-color:lightyellow}
#frmBingo > .title[data-status='1'] { background-color:green; color:white; border-color:green}
#frmBingo > .tile:hover { border-color:lime }
#frmBingo > .tile:focus { border-color:red}
.btnBingo {background-color:#F0F0F0; border-color:#F0F0F0 }
.btnBingo .miniBingo {--bgOff:lightgrey; --bgOn:grey}
.btnBingo[data-status='1'] {background-color:gold; border-color:gold}
.btnBingo[data-status='1'] .miniBingo {--bgOff:lightyellow; --bgOn:green}
.btnBingo[data-status='1'] .miniBingo > *:nth-child(13) {background-color:gold}

#frmAdmin .audioTitle {background-color:#F0F0F0}
#frmAdmin .audioTitle[data-status='2'] {background-color:#CCC}
#frmAdmin .audioTitle[data-status='1'] {background-color:#EEB}