

/*WIREFRAME============================================================================*/

input:disabled {
  border: 0;
  outline: 0;
  color:#303030 !important;
  background:none;
}

/*button.icon.copy {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" height="48" width="48"><path d="M12 37.95v-34h28v34Zm3-3h22v-28H15Zm-9 9V10.8h3v30.15h23.7v3Zm9-9v-28 28Z"/></svg>');
}

button.icon.copyAll {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" height="48" width="48"><path d="M13.2 36.8V4H40v32.8Zm3-3H37V7H16.2ZM6 28.4h3v-4.2H6ZM6 20h3v-4.2H6Zm15.6 24h4.2v-3h-4.2ZM6 36.8h3v-4.2H6ZM6 44h3v-3H6Zm7.2 0h4.2v-3h-4.2ZM30 44h3v-3h-3ZM6 11.6h3v-3H6Z"/></svg>');
}

button.icon.clear {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" height="48" width="48"><path d="m12.45 37.65-2.1-2.1L21.9 24 10.35 12.45l2.1-2.1L24 21.9l11.55-11.55 2.1 2.1L26.1 24l11.55 11.55-2.1 2.1L24 26.1Z"/></svg>');
}

button.icon.download {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" height="48" width="48"><path d="m24 32.35-9.65-9.65 2.15-2.15 6 6V8h3v18.55l6-6 2.15 2.15ZM8 40V29.85h3V37h26v-7.15h3V40Z"/></svg>');
}

button.icon.random {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" height="48" width="48"><path d="M19.75 21.8 7.5 9.6l2.15-2.15 12.25 12.2Zm9.3 18.7v-3h6.25l-9.2-9.15 2.1-2.15 9.3 9.2v-6.35h3V40.5Zm-19.45 0-2.1-2.15 27.9-27.9h-6.35v-3H40.5V18.9h-3v-6.3Z"/></svg>');
}*/


textarea:focus, input:focus{
  outline: none;
}

.crossword_entry {
  display: flex;
  align-items: flex-start;
  margin: 10px 0 0;
  width: 100%;
}

.crossword_number {
  padding-left: 0;
  padding-right: 0;
  height: 32px;
  line-height: 32px;
  width: 40px;
}

.crossword_clue {
  border: none;
  width: calc(100% - 40px - 200px - 60px);
  resize: none;
  min-height: 32px;
  padding: 6px 0;
}

.crossword_word {
  border: none;
  background-color: rgb(242,242,242);
  height: 32px;
  line-height: 32px;
  width: 200px;
  padding: 0 5px;
}

.crossword_delete {
  background-color: black;
  color: white;
  font-size: 14px;
  height: 32px;
  line-height: 32px;
  text-align: center;
  width: 60px;
  margin: 0;
  cursor: pointer;
}

.crossword {
  background-color: rgb(32,32,32);
  color: rgb(32, 32, 32);
  display: flex;
  flex-direction: column;
  max-width: 100%;
  overflow-x: hidden;
}

.crossword_row {
  display: grid;
  grid-auto-columns: minmax(0, 1fr);
  grid-auto-flow: column;
  overflow: hidden;
}

.crossword_square {
  border: 1px solid rgb(32,32,32);
  font-size: 16px;
  vertical-align: middle;
  text-align: center;
  user-select: none;
  position: relative;
  
  aspect-ratio: 1/1;
  
  display: flex;
  justify-content: center;
  align-items: center;
}

.crossword_square.letter {
  background-color: rgb(255,255,255);
  user-select: text;
}

.crossword_square.letter.hint {
  background-color: yellow;
}

.crossword_char {
  background: none;
  position: absolute;
  top: 0px;
  left: 0px;
  font-size: 16px;
  text-align: center;
  text-transform: uppercase;
  outline: 0;
  border: 0;
  padding: 0;
  margin: 0;
  width: 100%;
  height: 100%;
}
.crossword_char:focus {
  box-shadow: inset 0 0 0 2px red;
}

