/**
  * @license
  * Sensemaker v0.2.0
  * (c) 2021 Fabric Labs
  * License: MIT
  */

/* Core Styles */
:root {
  --primary-color: #336699;
  --sidebar-black: rgb(27, 28, 29);
  /* Define a variable */
}

#main-content #input-controls {
  position: absolute;
}

@media (min-width: 961px) {
  .desktop-only {
    display: block;
  }
}

@media (max-width: 960px) {
  .desktop-only {
    display: none;
  }
}

@media (min-width: 821px) {
  .mobile-only {
    display: none;
  }

  .sidebar.pusher {
    padding-right: 340px;
  }
}

@media (max-width: 820px) {
  #main-content {
    margin-left: 0 !important;
    left: 1em !important;
    right: 1em !important;
    bottom: 1em !important;
    top: 1em !important;
  }

  #main-content .fluid.ui.segment {
    /* inset: 1em !important; */
  }

  /* #main-content #input-controls {
    left: 1.25em !important;
  } */
  #main-content {
    left: 1.25em !important;
  }

  .mobile-only {
    display: block;
  }

  /* .ui.sidebar {
    display: none !important;
  } */

  .sidebar.pusher {
    padding-right: 2em !important;
    width: 100%;
  }

  .ui.visible.wide.left.sidebar~.pusher {
    transform: translate3d(0px, 0, 0) !important;
    padding-right: 2em !important;
    width: 100%;
  }
}

.fade-in {
  opacity: 0;
  animation: fadeIn 1.5s forwards;
}

@keyframes fadeIn {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

.fade-out {
  opacity: 1;
  animation: fadeOut 1.5s forwards;
}

@keyframes fadeOut {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

/* .splash {
  margin-top: 2rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
} */
.decline-invitation-form {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.reset-password-form {
  max-width: 400px;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.signup-form {
  max-width: 500px;
  display: flex;
  flex-direction: column;
}

#signup-form .signup-form-group .field{
  width: 100%;
}

.signup-form-group {
  display: flex;
  flex-direction: row;
  justify-content: center;
}

.dashboard-header {
  display: flex;
  flex-direction: row;
  align-items: center;
  padding-top: 0.5em;
  padding-bottom: 0.5em;
}

.dashboard-header .dashboard-help {
  color: white;
  position: absolute;
  top: 15px;
  right: 15px;
}

#feedback-button {
  position: fixed;
  bottom: 50px;
  right: 25px;
  cursor: pointer;
  background-color: #fff;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
}

@keyframes jiggle {
  0% {
    transform: rotate(-5deg);
  }
  50% {
    transform: rotate(5deg);
  }
  100% {
    transform: rotate(-5deg);
  }
}

.jiggle-animation {
  animation: jiggle 0.5s ease infinite;
}

@keyframes backgroundFade {
  0% {
      background-color: white;
  }
  50% {
      background-color: var(--primary-color);
  }
  100% {
      background-color: white;
  }
}

.notify-active {
  animation: backgroundFade 3s ease-in-out infinite;
}


body {
  background: #fff;
}

h1,
h2,
h3 {
  text-transform: uppercase;
}

.right.floated {
  float: right;
}

.clearfix {
  clear: both;
  display: block;
}

.uppercase {
  text-transform: uppercase;
}

.ui.grid {
  margin-top: 0;
}

.center-elements-row {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  align-content: center;
}

.center-elements-column {
  display: flex;
  flex-direction: column;
  align-items: center;
  align-content: center;
}

/* Sidebars */
sensemaker-dashboard #main-sidebar {
  overflow: hidden;
  height: 100vh;
  min-width: 90px;
  max-width: 90px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  position: relative;
  /* border-right: 1px solid grey; */
  z-index: 1000;
}

sensemaker-dashboard #collapse-sidebar {
  z-index: 500;
  position: fixed;
  left: 90px;
  top: 0;
  bottom: 0;
  background-color: #1b1c1d;
  border-right: 1px solid rgba(255, 255, 255, 0.1);
}

.left.sidebar.menu .label {
  vertical-align: text-top;
}

#main-sidebar .expand-icon{
  position: absolute;
  top: 30%;
  right: 5%;
  display: none;
}

#main-sidebar .expand-menu:hover .expand-icon{
  display: block;
}

@media (max-width: 1440px) and (max-height: 800px) {
  sensemaker-dashboard #main-sidebar {
    min-width: 100px;
    max-width: 100px;
  }
}

.col-center {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.icon-label {
  font-size: 0.9em;
  margin-top: 0.3em;
}

.collapse-sidebar-arrow {
  width: 20px;
  color: white;
  position: sticky;
  top: 50%;
  left: 90%;
  z-index: 1000;
}

.expand-sidebar-arrow {
  width: 20px;
  height: 60vh;
  color: white;
  position: absolute;
  top: 20%;
  left: 80%;
  z-index: 1000;
  display: flex;
  align-items: center;
}

@media (max-width: 1440px) and (max-height: 800px) {
  .expand-sidebar-arrow {
    left: 87%
  }
}

.expand-sidebar-arrow #expand-sidebar-icon {
  display: none;
}

.expand-sidebar-arrow:hover #expand-sidebar-icon {
  display: block;
}

.settings-menu-container {
  transition: transform 0.5s;
  overflow: hidden;
}

#settingsItem {
  /* transform: translateY(20px); */
  transition: transform 0.5s;
}

#logoutItem {
  opacity: 0;
  visibility: hidden;
  transform: translateY(20px);
  max-height: 0;
  /* Prevents the item from taking up space */
  transition: opacity 0.5s, visibility 0s 0.5s, transform 0.5s, max-height 0.5s;
}

.settings-menu-container:hover #logoutItem {
  display: block;
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  max-height: 78px;
  transition-delay: 0s;
}

.settings-menu-container:hover #settingsItem {
  transform: translateY(0);
}

.ui.search .prompt {
  border-radius: 4px !important;
}

.ui.search#global-search {
  font-family: 'Avant Garde Book BT' !important;
}


.ui.search .results.transition.visible {
  max-width: 100% !important;
  font-size: 1em !important;
}

.pusher {
  /* margin: 1em 0;
  height: 100%; */
  /* overflow: scroll !important; */
}

.clipped {
  display: inline-block;
  overflow: hidden;
  max-width: 20em;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.hidden {
  display: none;
}

.supersize {
  font-size: 1.2em;
}

.fabric-site {
  /* margin: 1em; */
}

.ui.segment {
  overflow-y: auto;
}

.ui.primary.action {
  margin-left: auto;
  margin-right: auto;
  margin-top: 2em;
  max-height: 36em;
  max-width: 52em;
  padding-top: 2em;
}

fabric-site,
#site {
  padding: 0 1em 0 0;
}

fabric-card.dialogue {
  width: 100%;
  font-size: 1.2em;
}

fabric-chat-bar {
  position: fixed;
  margin: 0;
  bottom: 1em;
  left: 1em;
  right: 1em;
}

fabric-chat-bar input {
  color: #fff !important;
}

fabric-chat-entry {
  color: #fff !important;
}

fabric-chat-log {
  display: block;
  overflow-y: scroll;
}

fabric-chat-view {
  display: block;
  margin-bottom: 3em;
}

fabric-console {
  width: '100%';
}

fabric-footer {
  position: fixed;
  bottom: 1em;
  left: 0;
  right: 0;
  margin: 1em 1em 0;
  padding: 0;
}

fabric-motd {
  color: #fff !important;
}

#sidebar {
  position: fixed;
  top: 0;
  left: 0;
}

#main-content .fluid.ui.segment {
  /* inset: 1em !important; */
  margin-right: 1em;
}

#site .card {
  background: rgba(0, 0, 0, 0.5);
  color: #fff;
}

#site .card .content .header {
  color: #fff;
}

#canvas {
  position: fixed;
  top: 0;
  left: 0;
}

#chat-log {
  height: 30em;
}

#console {
  position: fixed;
  top: 4em;
  left: 0;
  right: 0;
  margin: 5%;
}

#console fabric-card {
  height: 100%;
}

#settings {
  z-index: 20;
  background: #111 !important;
  position: fixed;
  top: 20%;
  bottom: 20%;
  left: 10%;
  width: 80%
}

#tray {
  position: fixed;
  top: 0;
  right: 0;
  margin: 5%;
}

#tray>i {
  cursor: pointer;
}

#modal {
  position: fixed;
  height: 20%;
  width: 60%;
  top: auto;
  bottom: auto;
  right: auto;
  left: auto;
}

#footer {
  height: 100%;
}

.dialogue .content {
  display: inline-block;
}

#footer .content {
  padding: 1em;
}

#footer form {
  position: fixed;
  bottom: 1em;
  left: 1em;
  right: 1em;
}

#overlay {
  z-index: 10;
  position: fixed;
  left: 0;
  right: 0;
  top: 15%;
  margin-left: auto;
  margin-right: auto;
  width: 90%;
  max-width: 30em;
  max-height: 60%;
  padding: 3em;
}

#overlay fabric-button.ui.button,
#overlay .button {
  text-align: left !important;
  justify-content: left;
}

.ui.labeled.icon.menu .item div {
  text-align: left;
}

.legal-contract {
  font-family: "Times New Roman", Times, serif !important;
}

.ui.inverted.menu .item:before {
  background: none !important;
}

.subtle {
  color: #ccc;
}

.case-info {
  max-height: 40vh;
  min-height: 40vh;
  width: 100% !important;
}

@media (min-height: 1200px) {
  .case-info {
    max-height: 20vh;
    min-height: 0;
  }
}

/* ChatBox CSS */

/* this is to change the TextAreaAutosize style*/
.ui.form textarea:not([rows]).prompt-bar {
  /* font-size: 1rem; */
  min-height: 0;
  overflow: hidden;
}

.info-assistant-header {
  height: 1.5em;
  display: flex;
  flex-direction: row;
  align-items: center;
}

.info-icon {
  display: none;
}

.chat-feed .event:hover .controls {
  display: inline !important;
  margin-left: 0.5em;
}

.chat-feed .event .content {
  font-size: 1.2em;
}

.ui.feed>.event:last-child {
  margin-bottom: 2em;
}

.home-dropdowns {
  text-align: center;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  gap: 2em;
  margin-top: 2em;
}

.home-dropdowns .ui.dropdown {
  font-family: 'AvGardd', serif !important;
  min-width: 17.5em !important;
  font-size: 1em;
}

@media (max-width: 768px) {
  .home-dropdowns {
    flex-direction: column;
    gap: 1em !important;
  }
}

.slide-in {
  transition: max-height 0.25s ease-in;
}

.slide-out {
  height: 0;
  transition: max-height 0.25s ease-out;
}

.microphone.icon {
  cursor: pointer;
  z-index: 10;
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
  cursor: pointer;
  z-index: 10;
}

.answer-controls {
  display: flex;
  align-items: center;
  align-content: center;
}

.answer-navigation {
  margin-top: 2px;
}

.conversation-title-container {
  display: flex;
  justify-content: space-between;
  padding-right: 1em;
  flex-wrap: wrap;
  /* padding-bottom: 1.5em; */
  background-color: #fff;
  position: sticky;
  top: 0;
  z-index: 10;
  box-shadow: 0 8px 6px -4px #fff;
}

/* InformationSidebar CSS */

.info-sidebar {
  background-color: rgb(27, 28, 29);
  color: #fff;
  padding: 1rem;
  height: 100%;
}

.feedback-close {
  position: absolute;
  top: 10px;
  right: 10px;
  z-index: 1000;
  cursor: pointer;
  color: white;
}

/* Settings CSS */
.settings-user {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  align-content: center;
}

.settings-container {
  margin-top: 2em;
}

.settings-container .ui.table {
  width: 40%;
}

.ui.card.info-file-card {
  margin-top: 3em !important;
}

.document-frame {
  width: 100%;
  height: 100%;
  border-radius: 5px;
  border: none;
  margin-top: 1em;
}

/*Admin Settings*/

/*Admin Settings Inquiries*/

.growth-section-head {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  margin-top: 2rem;
  margin-bottom: 1rem;
}

@media (max-width: 1280px) {

  .settings-container .ui.table {
    width: 70%;
  }
}

@media (max-width: 768px) {
  .settings-container .ui.table {
    width: 50%;
  }

  .settings-container .ui.table .settings-row {
    display: flex !important;
    flex-direction: row !important;
    justify-content: space-between !important;
    align-items: center !important;
  }
}

/* Admin - users settings */
.account-creator {
  display: flex;
  flex-direction: row;
  justify-content: center;
}

.users-section {
  margin-top: 2em;
}

/* Conversations CSS */
.conversationItem div .editIcon {
  display: none !important;
  margin-left: 1em !important;
  cursor: pointer !important;
  color: white !important;
  position: fixed;
  left: 85%;
}

.conversationItem:hover div #editIcon {
  display: inline-block !important;
}

.conversation-title-container div #editTitleIcon {
  display: none !important;
}

.conversation-title-container:hover div #editTitleIcon {
  display: inline-block !important;
}

.conversation-line {
  display: flex;
  flex-direction: row;
  align-items: center;
  align-content: center;
}

.conversation-line-input {
  width: 90%;
  margin-right: 1em;
  margin-left: 0.5em;
}

.attach-file-area {
  border: 2px dashed #bbb;
  padding: 2em 1.5em 1.5em 1.5em;
  text-align: center;
  margin-bottom: 1.5em;
  cursor: pointer;
}

.disabled-attach {
  color: grey;
  cursor: default;
}

.file-container {
  color: var(--primary-color);
}

.matter-note {
  cursor: pointer;
}

.expandable-note {
  transition: max-height 0.4s ease-in-out !important;
}

.matter-delete-note-icon,
.matter-delete-file-icon {
  visibility: hidden !important;
}

.matter-note:hover .matter-delete-note-icon {
  visibility: visible !important;
}

.matter-delete-file-icon {
  cursor: pointer;
}

.matter-file:hover .matter-delete-file-icon {
  visibility: visible !important;
}

/* Documents Home and View */
.documents-upload-form {
  margin-bottom: 1em;
}

/* Document View */
#document-editor #section-content {
  font-family: 'Avant Garde Book BT', Arial, sans-serif !important;
  width: '100%';
}

.brand span.brand {
  /* font-size: 1.5em; */
}

.splash-page .buttons {
  margin-top: 2em;
}

.splash-page section:not(.lead) {
  font-size: 1.1em;
  margin-bottom: 4em;
  clear: both;
}

.ui.video.background {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  pointer-events: none;
}

.document-content-transition {
  transition: height 0.4s ease-out;
  overflow: hidden;
}
