.left-column {
    flex: 1;
    padding: 10px;
    background-color: #fcfcfe;
    flex-direction: column;
    justify-content: space-between; /* To space out the two sections */
}

.technical-text-section,
.editorial-versions-section {
display: flex;
flex-direction: column;
position: relative;

}

.technical-text-section {
height: 40%;
padding-bottom: 20px;
border-bottom: 1px solid #000000; /* Add this line for the border */

}

.editorial-versions-section {
height: 60%;
padding-top: 20px;
}


.technical-text-input,
.editorial-version-output {
flex: 1; /* To make the textareas take the available space */
padding: 10px;
resize: vertical; /* To allow vertical resizing */
border: 1px solid #ccc;
border-radius: 3px;
font-size: 1em;
margin-top: 10px;
background: #ddd;
height: 100%; /* To make the textareas take the available space */
resize: vertical; /* To allow vertical resizing */
position: relative; /* Relative to the parent */
z-index: 1;
resize: none; 
}

.tooltip-btn{
  border: 1px solid #2a2a2a; /* Add a border, change color as needed */
  border-radius: 50%; /* Make the border round */
  cursor: pointer;
  float: right;
  margin-left: 10px;
  padding: 2px; /* Add padding to create space around the image */
  display: flex; /* Use flex to center the image */
  align-items: center; /* Vertical alignment */
  justify-content: center; /* Horizontal alignment */
  height: 20px;
  width: 20px;
  font-weight: bold;
  font-family: Georgia, 'Times New Roman', Times, serif;

}

.editorial-copy-btn {
  position: absolute; /* Absolute position inside the relative parent */
  bottom: 10px; /* Position from the bottom */
  right: 10px; /* Position from the right */
  z-index: 2; /* Stack order above editorial-version-output */
  background: none;
  border: none;
  border-radius: 50%; /* Make the border round */
  cursor: pointer;
  padding: 2px; /* Add padding to create space around the image */
  display: flex; /* Use flex to center the image */
  align-items: center; /* Vertical alignment */
  justify-content: center; /* Horizontal alignment */
}

.editorial-copy-btn img {
  width: 20px;
  height: 20px;
}
  
.editorial-versions-select {
  width: 100%;
  padding: 5px;
  margin-top: 10px;
  border: 1px solid #afaeae;
  appearance: none; /* Removes default browser styling */
}


.tech-buttons {
  display: flex;
  justify-content: space-between; /* Adds space between the buttons */
  padding-top: 10px;
  border: none;
}

.tech-buttons button {
  /* Style the buttons as needed */
  color: #fff;
  font-weight: bold;
  cursor: pointer;
  transition: var(--primary-button-transition);
  padding: 10px;
  border-radius: 3px;
  border: none;
  font-size: 1em;
  min-width: 100px;
}

.tech-buttons button:disabled{
  background-color: var(--primary-button-disabled-color); 
  cursor: not-allowed; 
}

.tech-start-btn {
  /* Style the buttons as needed */
  background: var(--primary-button-color);
}

.tech-reset-btn {
  /* Style the buttons as needed */
  background: var(--secondary-button-color);
  font-weight: normal;
}


.tech-start-btn:not(:disabled):hover {
  /* Hover effect for the buttons */
  background: var(--primary-button-hover-color);
}

.tech-reset-btn:not(:disabled):hover {
  /* Hover effect for the buttons */
  background: var(--secondary-button-hover-color);
}

.content-header-container {
  display: flex;         /* Make it a flex container */
  justify-content: space-between; /* Align children horizontally with space between */
  align-items: center;   /* Center children vertically */
}


.tooltip-container {
  position: relative; /* Set the position context for the tooltip */
  display: flex;
  align-items: center;
}

.guide-tooltip {
  visibility: hidden;
  background-color: #555;
  color: #fff;
  text-align: center;
  padding: 5px;
  border-radius: 5px;
  position: absolute;
  z-index: 10;
  font-size: 12px;
  top: 110%; /* Position tooltip at the bottom of the container */
  right: 10px;
  width: 300px;
  word-wrap: break-word;
  line-height: 1.5;
}



.guide-tooltip.show {
  visibility: visible;
}

.editorial-copy-tooltip {
  visibility: hidden;
  background-color: #555;
  color: #fff;
  text-align: center;
  padding: 5px;
  border-radius: 5px;
  position: absolute;
  z-index: 1;
  font-size: 12px;
  top: -35px;
  right: 40px; 
}

.editorial-copy-tooltip.show {
  visibility: visible;
}