/* Generated from https://rekko.studio/api/branding — do not edit on the volume */
:root {
  --reave-primary: #000000;
  --reave-secondary: #505050;
}
.users-header {
  background: var(--reave-primary) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  width: 100% !important;
  overflow: hidden !important;
  padding-inline: 0.65rem !important;
}
#left-sidebar .users-header {
  min-width: 0 !important;
}
.navbar,
.navbar .container,
.navbar .container-fluid,
.navbar .container-lg,
.navbar .container-md,
.navbar .container-sm,
.navbar .container-xl {
  background: var(--reave-primary) !important;
}
.topnav .navbar-brand,
#title.navbar-brand,
#title.reave-header-brand {
  color: #fff !important;
}
.btn-primary {
  background-color: var(--reave-primary) !important;
  border-color: var(--reave-primary) !important;
}
.btn-primary:hover,
.btn-primary:focus {
  background-color: var(--reave-secondary) !important;
  border-color: var(--reave-secondary) !important;
}
#left-sidebar .galene-header,
.galene-header {
  display: block !important;
  flex: 1 1 auto !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
  line-height: 0 !important;
  font-size: 0 !important;
  color: transparent !important;
  overflow: hidden !important;
  text-align: center !important;
}
.galene-header .reave-wordmark,
#title.navbar-brand .reave-wordmark,
#title.reave-header-brand .reave-wordmark,
.reave-wordmark--header {
  display: block !important;
  width: auto !important;
  max-width: min(11rem, 100%) !important;
  height: auto !important;
  max-height: 1.8rem !important;
  margin-inline: auto !important;
  object-fit: contain !important;
  object-position: center center !important;
}
#title.navbar-brand,
#title.reave-header-brand {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 1 1 auto !important;
  min-height: 2rem !important;
  margin: 0 !important;
}
#header {
  display: flex !important;
  align-items: center !important;
  flex: 1 1 auto !important;
  min-width: 0 !important;
}
.topnav .reave-share-btn {
  border-radius: 0.5rem !important;
  font-size: 0.8125rem !important;
  padding: 0.35rem 0.75rem !important;
}
.reave-share-wrap {
  margin-top: 1rem !important;
  text-align: center !important;
}
.reave-share-wrap .reave-share-btn {
  width: 100% !important;
}
/* Connect lobby — hide empty chat and user sidebar until joined */
.app:has(#login-container:not(.invisible)) #left,
.app:has(#login-container:not(.invisible)) #resizer,
html.reave-meet-login #left,
html.reave-meet-login #resizer {
  display: none !important;
}
.app:has(#login-container:not(.invisible)) #left-sidebar,
html.reave-meet-login #left-sidebar {
  min-width: 0 !important;
  max-width: 0 !important;
  overflow: hidden !important;
  border: none !important;
}
.app:has(#login-container:not(.invisible)) .full-width,
html.reave-meet-login .full-width {
  width: 100vw !important;
}
.app:has(#login-container:not(.invisible)) #mainrow .coln-right,
html.reave-meet-login #mainrow .coln-right {
  flex: 1 1 100% !important;
  max-width: 100% !important;
}
.app:has(#login-container:not(.invisible)) #mutebutton,
.app:has(#login-container:not(.invisible)) #presentbutton,
.app:has(#login-container:not(.invisible)) #unpresentbutton,
html.reave-meet-login #mutebutton,
html.reave-meet-login #presentbutton,
html.reave-meet-login #unpresentbutton {
  display: none !important;
}
.app:has(#login-container:not(.invisible)) #sidebarCollapse,
html.reave-meet-login #sidebarCollapse {
  display: none !important;
}
.app:has(#login-container:not(.invisible)) .header-title,
html.reave-meet-login .header-title:not(.reave-header-brand) {
  flex: 1 1 auto !important;
  text-align: center !important;
  font-size: 1rem !important;
  font-weight: 600 !important;
  margin: 0 !important;
  padding-inline: 0.5rem !important;
}
.app:has(#login-container:not(.invisible)) .login-container,
html.reave-meet-login .login-container {
  background: #eef1f5 !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 1.5rem !important;
  overflow: auto !important;
}
.app:has(#login-container:not(.invisible)) .login-box,
html.reave-meet-login .login-box {
  margin: 0 auto !important;
  width: min(22rem, 100%) !important;
  height: auto !important;
  padding: 1.75rem !important;
  border-radius: 0.75rem !important;
  border: 1px solid #dde3ea !important;
  box-shadow: 0 10px 36px rgba(15, 23, 42, 0.08) !important;
  background: #fff !important;
}
.app:has(#login-container:not(.invisible)) .login-box h2,
html.reave-meet-login .login-box h2 {
  margin-bottom: 1.25rem !important;
}
.app:has(#login-container:not(.invisible)) #header,
html.reave-meet-login #header {
  justify-content: center !important;
  width: 100% !important;
}
.app:has(#login-container:not(.invisible)) #title.reave-header-brand,
html.reave-meet-login #title.reave-header-brand {
  justify-content: center !important;
}
.app:has(#login-container:not(.invisible)) #peers,
.app:has(#login-container:not(.invisible)) #video-container,
.app:has(#login-container:not(.invisible)) #expand-video,
html.reave-meet-login #peers,
html.reave-meet-login #video-container,
html.reave-meet-login #expand-video {
  display: none !important;
  visibility: hidden !important;
}
html.reave-meet-login nav.topnav {
  position: relative !important;
  justify-content: center !important;
}
html.reave-meet-login #header {
  position: absolute !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  width: auto !important;
  flex: 0 1 auto !important;
}
html.reave-meet-login .nav-menu {
  position: absolute !important;
  right: 0.75rem !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
}