
.matrix-border {
    border: 1px solid #008000;
    min-width: 0;
}

.matrix-text-area {
    width:100%;
    padding:8px;
    box-sizing:border-box;
    resize:vertical;
    min-height: 5em;
}

.matrix-input {
    width:100%;
    padding:8px;
    box-sizing:border-box;
    margin-bottom: .8em;
    margin-top: .2em;
}

.matrix-legend {
    margin-right: 2em;
    padding-left: .3em;
    padding-right: .3em;
}

.matrix-tiny {
    color: #008000;
    font-size: .8rem;
}

.cm-editor {
    width: 0;
    min-width: 100%;
    overflow: hidden;
}

.cm-scroller {
    overflow: auto !important;
}

.search-file {
    color: #7eb6ff;
    cursor: pointer;
}

.search-file:hover {
    color: #a3cbff;
    text-decoration: underline;
}

.centered-airesponse-modal {
  position: fixed;
  top: 10%;
  left: 50%;
  transform: translateX(-50%);
  width: 80ch;
  z-index: 1000;
  background-color: #1a1a1a;
  padding: 0.3em;
}

.centered-finder-modal {
  position: fixed;
  top: 20%;
  left: 50%;
  transform: translateX(-50%);
  width: 500px;
  z-index: 1000;
  background-color: #1a1a1a;
  padding: 0.3em;
}

.centered-librarian-modal {
  position: fixed;
  top: 20%;
  left: 50%;
  transform: translateX(-50%);
  width: 75ch;
  z-index: 1000;
  background-color: #1a1a1a;
  padding: 0.3em;
}

.centered-settings-modal {
  position: fixed;
  top: 20%;
  left: 50%;
  transform: translateX(-50%);
  width: 1000px;
  z-index: 1000;
  background-color: #1a1a1a;
  padding: 0.3em;
}

/*
If we decide to turn off the outline
.centered-airesponse-modal:focus,
.centered-librarian-modal:focus {
  outline: none;
}
*/

.centered-diff-modal {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 90%;
    max-width: 1400px;
    max-height: 90vh;
    z-index: 1000;
    background-color: #1a1a1a;
    padding: 0.3em;
}

.centered-diff-modal .d2h-code-linenumber {
    position: static;
}

.centered-airesponse-modal:focus,
.centered-librarian-modal:focus,
.centered-diff-modal:focus {
  outline: 1px solid #808080;
}

.centered-login-modal {
  position: fixed;
  top: 20%;
  left: 50%;
  transform: translateX(-50%);
  width: 400px;
  z-index: 1000;
  background-color: #1a1a1a;
  padding: 0.3em;
}


.modal-background {
    background-color: rgba(10,10,10,0.40);
}

#response {
    overflow-wrap: break-word;
    word-break: break-word;
    min-width: 0;
    max-width: 100%;
}

#response pre {
    max-width: 100%;
    width: 100%;
    overflow-x: auto;
    font-size: .75em;
    box-sizing: border-box;
}

#response pre code {
    display: block;
}
