/*!
 * bb/index.css
 * (c) 2021 newfire.com
 */
@import "../lib/object.css";
@import "../lib/User.css";
@import "./Event.css";
@import "./File.css";
@import "./Post.css";
@import "./Page.css";
@import "../index.css";

:root{
  --color: #7DA826;
  --background-color: white;
  --background: white;
}

body {
  color: gray;
  background: var(--background);
  max-width: 700;
  left: 0; right: 0;
  margin: auto;
}

h1, h2, h3 {
  font-weight: unset;
}

menubar{
  display: block;
  //background: url(/images/patternTruchet.svg) var(--color) 0px 0px / auto 80px;
  background: url(/bb/images/background.svg) var(--color);
  text-align: right;
}

apps-menu{
  float: left;
  display: inline-block;
}
apps-menu img{
  height: 32;
}

menu1 {
  display: block;
  //margin: 6;
  //float: right;
  padding: 0 35 0 0;
}
menu1 >*{
  display: inline-block;
  margin: 4;
  //border-radius: 10px;
  vertical-align: middle;
}
menu1 >mi{
  margin: 7 0;
  color: white;
}

mi {
  display: inline-block;
  text-transform: uppercase;
  padding: 1;
}
mi[open=true]{
  background: rgba(255, 255, 255, .2);
}



profile{
  position: absolute;
  top: 0;
  right: 0;
  margin: 3;
  //color: white;
  //background: var(--color);
}

app{
  display: flex;
  margin: 20 2 2 2;
}

app >app-menu mi{
  display: none;
}

app.public mi#join{
  color: white;
  background: silver !important;
  display: block;
}
app.public mi#enter{
  display: block;
}

app.nonmember mi#subscribe{
  display: block;
  background: orange !important;
  color: white;
}

app.member mi#forum,
app.member mi#groups,
app.member mi#lectures,
app.member mi#archive,
app.member mi#search {
  display: block;
}

app.admin >app-menu >admin > mi{
  display: block;
}

app-menu {
  //display: inline-block;
}

app-menu mi{
  display: block;
  border-radius: 1em;
  margin: 4;
  color: gray;
  background: rgba(0, 0, 0, .07) !important;
  box-shadow: var(--box-shadow);
  font-size: small;
}

app-menu mi[open=true]{
  color: white;
  background: var(--color) !important;
}
app-menu mi:hover{
  filter: brightness(1.1);
}
app-menu mi img{
  border-radius: 1em;
  width: 21;
  height: 21;
  padding: 2;
}

app-body{
  display: inline-block;
  flex-grow: 1;
  margin: 2;
}

app-body > obj[klass=User],
app-body > form > obj[klass=User] {
  width: 320;
  display: inline-block;
  border-radius: 5px;
  box-shadow: var(--box-shadow);
}

/* hide omenu */
app:not([class~=member]) omenu {
  display: none;
}


footer {
  color: silver;
  font-size: smaller;
  margin: 10 0;
}

@media screen and (max-width: 600px) {
  /* vertical menu label for non-member */
  app:not(.member) app-menu{
    min-width: 30; /* firefox width too narrow */
  }
  app:not(.member) app-menu mi {
    writing-mode: vertical-lr;
    text-orientation: upright;
  }
  app:not(.member) app-menu mi img{
    vertical-align: unset;
  }
}

/* notification box */
zoom,
box {
  max-width: 350;
  border: 1px solid silver;
  border-radius: 10px;
  display: inline-block;
  margin: 20;
  padding: 8;
}

zoom {
  max-width: 300;
  text-align: left;
}
zoom img {
  width: 50;
  margin-right: 15;
  float: left;
}

app:not([class~=member]) searchbox >form,
app:not([class~=member]) searchbox >button {
  display: none;
}

searchbox >result >obj{
  margin-bottom: 50 !important;
}