@use "./fonts";
@use "./vars";

#codap-app-id {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #242424;
  background-color: #dfdfdf;

  .codap-app {
    width: 100%;
    height: 100%;

    .toolbar-container {
      display: flex;
      flex-direction: column;
      height: calc(100% - vars.$menu-bar-height);
      width: 100%;

      &.vertical-toolbar-container {
        flex-direction: row;
      }
    }
  }
}

.drop-handler {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}

#user-entry-drop-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  z-index: 5000;
  pointer-events: auto;
  background-color: #77777780;
  z-index: 200;
  &.show-highlight {
    border: 3px solid yellow;
  }
}

.document-render-error {
  margin: 20px;

  h1 {
    font-size: 1.2rem;
    font-weight: bold;
    margin-bottom: 0px;
    margin-top: 10px;
  }
  h2 {
    font-size: 1.1rem;
    font-weight: bold;
    margin-bottom: 0px;
    margin-top: 10px;
  }
}
