.audio-transcript {
    margin-top: 20px;
    padding: 15px;
    background: #f9f9f9;
    border: 1px solid #ddd;
    border-radius: 5px;
}

.audio-transcript h3 {
    margin: 0 0 10px;
    font-size: 1.2em;
}

.audio-transcript p {
    margin: 0;
    line-height: 1.6;
}
/* Style the toggle button */
.toggle-transcript {
   
    color: #fff !important;
    border: none;
    padding: 8px;
    font-size: 16px;
    cursor: pointer;
	background-color: #73C1B9;
    padding-bottom: 0px;
	padding-top: 0px;
	border-radius: 6px;
	margin-bottom: 10px;
}
.toggle-transcript:focus{
	outline: none;
}
/* Style the transcript content */
.transcript-content {
    margin-top: 10px;
    padding: 10px;
   
    border-radius: 4px;
}

/* Add a smooth transition to the transcript content */
.transcript-content {
    transition: all 0.3s ease;
}

.transcript-content {
    max-height: 0; /* Initially collapsed */
    opacity: 0; /* Fully transparent */
    overflow: hidden; /* Hide overflowing content */
    transition: max-height 0.5s ease-out, opacity 0.5s ease-out;
    padding: 0 10px; /* Adjust to suit your layout */
}
.toggle-transcript.visible {
  margin-top: 20px;
  transition: margin-top 0.3s ease; /* Adjust the duration and timing function as needed */
}

.transcript-content.visible {
    max-height: 500px; /* Adjust to suit your content */
    opacity: 1; /* Fully visible */
    padding: 10px 10px; /* Add spacing when visible */
}
/* Style for WebKit-based browsers (Chrome, Edge, Safari) */
.transcript-content::-webkit-scrollbar {
    width: 10px; /* Width of the scrollbar */
}

.transcript-content::-webkit-scrollbar-track {
    background: #f1f1f1; /* Background color of the scrollbar track */
    border-radius: 5px; /* Rounded edges for the track */
}

.transcript-content::-webkit-scrollbar-thumb {
    background: #024959; /* Color of the scrollbar thumb */
    border-radius: 5px; /* Rounded edges for the thumb */
}

.transcript-content::-webkit-scrollbar-thumb:hover {
    background: #036c7b; /* Darker color when hovered */
}

/* Firefox-specific scrollbar styles */
.transcript-content {
    scrollbar-width: thin; /* Thin scrollbar */
    scrollbar-color: #024959 #f1f1f1; /* Thumb color and track color */
}
.transcript-content h3{
	font-size: 1rem !important;
}