@charset "utf-8";

@font-face {
    font-family: "Mono";
    src: url("https://horstmann.com/fonts/NotoSansMono-VariableFont_wdth,wght.ttf");
    font-stretch: 60%;
}

@font-face {
    font-family: "Cursive";
    src: url("https://horstmann.com/fonts/Recursive-VariableFont_CASL,CRSV,MONO,slnt,wght.ttf");
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
    font-variation-settings:
            "slnt" -10,
            "CASL" 1,
            "CRSV" 1,
            "MONO" 0;
}
.pseudo {
  font-family: "Cursive";
}

.studentFiles, .providedFiles {
  display: none;
}

.ace_editor {
  /* border: 1px solid #EEE; */
  /* TODO: If we want a border, put all editor divs inside a div with a border */
  min-width: 700px;
}

.ace_gutter {
  width: 4em !important;
}

.ace_gutter-cell {
  padding-right: 1em !important;
}

.ace_gutter-layer {
  display: inline !important;
}

.ace_hidden-cursors {
  opacity: 0
}

.ace_scrollbar {
  display: none;
}

body {
  font-family: sans-serif;
}

code, pre {
  font-family: Mono;
}

.editor {
  width: 80%;
}

#submit {
  margin: 0.8em;
}

.exercise-button {
  margin: 0.5em;
  padding: 0.5em;
}

.exercise-button.active {
  background: #FFF8C4;
}

.exercise-iframe {
  width: 100%;
  border-width: 0;
  overflow: hidden;
}

/* Shape for all buttons */
.hc-button {
  font-weight: bold;
  color: #FFFFFF;
  cursor: pointer;
  padding: 0.2em .56em;
  border-radius: 0.56em;
  position: relative;
  font-size: 75%;
  margin-left: 1em;
  margin-right: 1em;
  user-select: none;
  display: inline-block;
  text-decoration: none;
}

#buttons>hc-button {
  margin-bottom: 0.5em;
}

/* Button states */
.hc-button:focus {
  border: solid 0.2em #c0c0c0;
  border-radius: 0.56em;
}

.hc-button.hc-step.hc-disabled {
  background: #707070;
  pointer-events: none;
}

.hc-button.hc-start, .hc-button.hc-step.active {
  background: #005a70;
}

.hc-button.hc-step {
  background: #0054a8;
}

.hc-button.hc-command {
  background: #E19042;
}

.ccid, .ccurl {
  font-family: "Mono";
}

#response {
  border: solid thin red;
  padding: 0.5em;
  margin-top: 0.5em;
  margin-bottom: 0.5em;
}

#response:empty {
  border: none;
}

#abovebuttons {
  border-top: solid thin gray;
  padding-top: 0.5em;
}

#ccidBullets>li {
  padding-top: 0.35em;
  padding-bottom: 0.35em;
}

#buttonDiv {
  padding-top: 0.35em;
  padding-bottom: 0.35em;
}

#submissions td {
  background-color: #eee;
}

/* Rearrange */
.horstmann_rearrange>div {
  display: table;
  width: 100%;
}

.horstmann_rearrange .left {
  display: table-cell;
  vertical-align: top;
  overflow: hidden;
  white-space: pre-wrap;
  padding: 1.25em 0.62em 5em 0em;
  width: 50%;
}

.horstmann_rearrange .right {
  display: table-cell;
  vertical-align: top;
  padding: 1.25em 0.62em 1.25em 0.62em;
  overflow: hidden;
  width: 50%;
  white-space: pre-wrap;
}

.horstmann_rearrange .left, .horstmann_rearrange .right {
  font-family: Mono;
  user-select: none;
  -moz-user-select: none; /* Firefox */
  -webkit-touch-callout: none; /* iOS Safari */
  -webkit-user-select: none; /* Safari */
  -ms-user-select: none; /* Internet Explorer/Edge */
}

.horstmann_rearrange .tile {
  margin-top: 0.5em;
  margin-bottom: 0.5em;
  padding: 0.3em;
  overflow: hidden;
  background: #F3F3F4;
  cursor: move;
}

.horstmann_rearrange .fixed {
  background: #D3D3D3;
  margin-top: 0.6em;
  margin-bottom: 0.6em;
}

.horstmann_rearrange .dragover * {
  pointer-events: none;
}

.horstmann_rearrange .hc-bad {
  background: #F4D3DD;
}

th a {
  color: black;
  text-decoration: none;
  transition: color 0.3s;
}

th a:hover {
  color: grey;
}

th.ascending a:after {
  content: ' △';
}

th.descending a:after {
  content: ' ▽';
}