/* LMS Textarea Page Styling */

@font-face {
  font-family: "Excalifont";
  src: url("https://excalidraw.nyc3.cdn.digitaloceanspaces.com/fonts/Excalifont-Regular.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

.lms-textarea-page {
  width: 100%;
  margin: 0;
  padding: 0;
  background-color: var(--lms-bgcolor, #ffffff);
}

.lms-textarea-message {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100vh;
  padding: 2rem;
  text-align: center;
  background-color: var(--lms-bgcolor, #f5f5f5);
  color: #333;
  font-size: 1.1rem;
}

.lms-textarea-container {
  position: relative;
  width: 100%;
}

.lms-textarea-input {
  display: block;
  width: 100%;
  min-height: calc(1.5em + 1rem + 4px);
  border: none;
  padding: 0.5rem;
  font-family: "Excalifont", "Comic Sans MS", "Comic Sans", cursive;
  font-size: 18px;
  border-radius: 4px;
  line-height: 1.45;
  color: #333;
  border: 2px solid #FFFFFF;
  background-color: var(--lms-bgcolor, #F4F4F4);
  resize: none;
  overflow: hidden;
  outline: none;
}

/* Scrollbar styling for better UX */
.lms-textarea-input::-webkit-scrollbar {
  width: 8px;
}

.lms-textarea-input::-webkit-scrollbar-track {
  background: #f1f1f1;
}

.lms-textarea-input::-webkit-scrollbar-thumb {
  background: #c0c0c0;
  border-radius: 4px;
}

.lms-textarea-input::-webkit-scrollbar-thumb:hover {
  background: #999;
}