.comment {
width: 70%;
color: blue;
background-color: Aliceblue;
border: 2px solid DarkBlue;
padding: 10px;
float: left;

}

.question {
width: 70%;
color: blue;
background-color: Aliceblue;
border: 2px solid DarkBlue;
padding: 10px;
float: left;

}

textarea {
color: green;
background-color: lavenderblush;
border: 2px solid lavender;
padding: 10px;

}

.answer {
width: 70%;
color: blue;
background-color: lavenderblush;
border: 2px solid lavender;
padding: 10px;
float: right;

}

/* Lock down the browser viewport */
html, body {
  margin: 0;
  padding: 0;
  height: 100%;
  overflow: hidden; /* Prevents global page scrolling */
}

/* Master wrapper */
.layout-container {
  display: flex;
  flex-direction: column; /* Stacks sections vertically */
  height: 100vh;          /* Spans exactly full screen height */
  width: 100%;
}

/* Fixed size for top and bottom */
.fixed-section {
  flex-shrink: 0;         /* Prevents headers/footers from squishing */
  background-color: #1e1e24;
  color: #ffffff;
  padding: 15px;
  text-align: center;
}

/* Dynamic scrollable core */
.scrollable-content {
  flex: 1;                /* Forces section to fill all remaining space */
  overflow-y: auto;       /* Activates vertical scrollbar when content overflows */
  padding: 20px;
  background-color: #f7f9fa;
  box-sizing: border-box;
}