@import "../h1treX-theming/theme.css";

/* Welcome page */

#no-param {
  --padding-top: 20vh;
  height: calc(100vh - var(--padding-top));
  width: 100vw;
  background-color: var(--background);
  font-family: 'Bahnschrift', sans-serif;
  text-align: center;
  padding-top: var(--padding-top);
  display: none;
}

#no-param * {
  margin: 1em auto;
  user-select: none;
}

input#url-input {
  width: 400px;
}

button:hover {
  cursor: pointer;
}

/* Player */

#player {
  display: none;
  height: 100vh;
  width: 100vw;
  --chat-width: 340px;
  --player-width: calc(100% - var(--chat-width))
}

#player #player-frame {
  position: absolute;
  height: 100%;
  width: var(--player-width);
}

#player #sidebar {
  position: fixed;
  top: 0;
  left: var(--player-width);
  height: 100%;
  width: var(--chat-width);
  display: block;
}

#player #sidebar #back-href {
  margin: 8px;
  font-size: 18px;
}

#player #sidebar #player-chat {
  width: 100%;
  height: calc(100% - 25px);
}