/* styles.css - $CSS_VERSION = '178' */
/* General Link Styles */
a {
text-decoration: none;
color: #4A5E6D;
}
a:hover {
color: #6B8E23;
}
/* Header Styles */
.header-container {
    display: flex;
    justify-content: space-between;
    align-items: flex-end; /* Bottom-align nav relative to h1 */
    margin-bottom: 10px;
}
.header-container h1 {
    font-size: 1.5em; /* Reduced size */
    font-family: Arial, sans-serif; /* Different font for heading */
    font-weight: 400; /* Not bold */
    color: #333;
    margin: 0;
    white-space: nowrap; /* Prevent wrapping */
}
h1 {
    font-family: Tahoma, Arial, sans-serif;
    font-size: 1.5em;
    font-weight: bold;
    color: #333;
    margin: 0;
    padding-bottom: 10px;
}
/* Navigation Styles */
.nav-container {
    margin: 0;
}
.nav-container nav ul {
    list-style-type: none;
    padding: 0;
    margin: 0;
    display: flex;
    justify-content: center;
    align-items: flex-end; /* Bottom-align the links */
    background-color: #f8f9fa; /* Light background for nav */
    border-radius: 8px; /* Rounded corners */
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); /* Subtle shadow for depth */
    flex-wrap: nowrap; /* Keep on one line */
}
.nav-container nav ul li {
    margin: 0 10px; /* Adjusted for tighter spacing */
}
.nav-container nav ul li:not(:has(a)):not(.music-wrapper) {
    padding: 10px 15px;
}
.nav-container nav ul li a {
    font-family: Tahoma, Arial, sans-serif;
    font-size: 0.9em; /* Smaller font for nav links */
    font-weight: 400;
    text-decoration: none;
    color: #333; /* Updated for consistency */
    padding: 10px 15px;
    display: block;
    border-radius: 5px;
    transition: background-color 0.3s, color 0.3s; /* Smooth hover transition */
}
.nav-container nav ul li a:hover {
    background-color: #007bff; /* Blue background on hover */
    color: white; /* White text on hover */
}
.music-wrapper {
    position: relative;
}
.music-icon {
    cursor: pointer;
    font-size: 1.2em;
}

/* Body */
body {
font-family: Tahoma, Arial, sans-serif;
font-size: 10pt;
background-color: #E8E3D9;
overflow-x: hidden;
padding: 0 5px;
color: #333;
}
/* Search Controls */
#search-controls {
margin: 5px 0;
padding: 5px;
display: flex;
flex-direction: column;
gap: 10px;
width: 100%;
box-sizing: border-box;
background-color: #E0D5C6;
margin-left: auto;
margin-right: auto;
}
.search-table {
width: 100%;
border-collapse: collapse;
background-color: #E0D5C6;
}
.search-table tr {
border-bottom: none;
}
.search-table td {
padding: 5px;
vertical-align: middle;
border: none;
}
.search-table td:first-child {
font-weight: bold;
width: 20%;
text-align: right;
padding-right: 10px;
vertical-align: bottom;
}
.search-table td:last-child {
width: 80%;
}
.search-table form, .search-table div {
margin: 0;
padding: 0;
display: inline-block;
width: 100%;
}
.search-table button {
padding: 5px 10px;
background-color: #6B8E23;
color: #333333;
border: none;
border-radius: 3px;
cursor: pointer;
}
.search-table button:hover {
background-color: #4A5E6D;
}
.search-table select, .search-table input {
padding: 5px;
border: none;
border-radius: 3px;
background-color: #E0D5C6;
font-family: Tahoma, Arial, sans-serif;
font-size: 10pt;
cursor: pointer;
}
.search-table select:hover, .search-table input:hover {
background-color: #C4B5A5;
}
/* Search Container */
#search-container {
display: flex;
align-items: center;
gap: 10px;
flex-wrap: wrap;
justify-content: center;
max-width: 800px;
margin: 0 auto;
}
.search-label {
font-weight: bold;
font-size: 10pt;
color: #333;
}
#study-search {
flex: 1;
padding: 5px;
border: none;
border-radius: 3px;
font-family: Tahoma, Arial, sans-serif;
font-size: 10pt;
background-color: #E0D5C6;
}
#study-search:focus {
outline: none;
}
#filter-row {
display: flex;
flex-wrap: wrap;
gap: 10px;
align-items: center;
}
#year-filter-container, #study-type-filter-container {
display: flex;
align-items: center;
gap: 5px;
}
#year-filter-container label, #study-type-filter-container label {
font-weight: bold;
font-size: 10pt;
color: #333;
}
#year-filter {
padding: 5px;
border: none;
border-radius: 3px;
background-color: #E0D5C6;
font-family: Tahoma, Arial, sans-serif;
font-size: 10pt;
min-width: 100px;
}
#study-type-filter-container input[type="checkbox"] {
margin-left: 10px;
}
#search-submit-btn {
padding: 8px 20px;
width: 100px;
background-color: #6B8E23;
color: #333333;
border: none;
border-radius: 3px;
font-family: Tahoma, Arial, sans-serif;
font-size: 10pt;
}
#search-submit-btn:hover {
background-color: #E2D6C4;
color: #333333;
}
/* Alphabet Bar */
#alphabet-bar {
margin: 10px 0;
font-size: 14pt;
display: flex;
justify-content: center;
flex-wrap: wrap;
}
.letter {
margin: 0 5px;
color: #4A5E6D;
text-decoration: none;
font-weight: normal;
cursor: pointer;
}
.letter.active {
color: #4A5E6D;
}
.letter:hover {
color: #6B8E23;
}
/* Columns Layout */
#columns-container {
display: flex;
gap: 10px;
margin: 0;
width: 100%;
box-sizing: border-box;
}
#columns-container > div, #column1, #column2, #column3 {
padding: 10px;
border: 1px solid #4A5E6D;
margin: 0;
height: auto;
overflow-x: hidden;
overflow-y: auto;
word-wrap: break-word;
box-sizing: border-box;
}
/* Default for index.php (3 columns) */
#column1 {
flex: 0 0 20%;
}
#column2 {
flex: 0 0 40%;
}
#column3 {
flex: 0 0 40%;
}
/* For search_studies.php (2 columns, no #column3) */
#columns-container:where(:not(:has(#column3))) #column1,
#columns-container:where(:not(:has(#column3))) #column2 {
flex: 0 0 50%;
}
#columns-container h2, #column1 h2, #column2 h2, #column3 h2 {
font-size: 1.5em;
font-weight: bold;
color: #333;
margin-bottom: 10px;
}
#column1-content {
padding: 0;
}
/* Filters Box */
#filters-box {
margin: 10px 0;
padding: 10px;
border: 3px solid #4A5E6D;
display: flex;
flex-direction: column;
gap: 10px;
width: 100%;
box-sizing: border-box;
background-color: #A89F94;
}
#remove-all-btn {
margin-bottom: 5px;
padding: 5px 10px;
background-color: #6B8E23;
color: #333333;
border: none;
align-self: flex-start;
cursor: pointer;
}
#remove-all-btn:hover {
background-color: #4A5E6D;
}
#filters-content {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 5px;
}
.filter {
padding: 5px 10px;
border: 1px solid #4A5E6D;
background-color: #E2D6C4;
border-radius: 3px;
box-sizing: border-box;
font-weight: bold;
display: flex;
justify-content: space-between;
align-items: center;
color: #333;
}
.filter-text {
text-align: left;
}
.filter-controls {
display: flex;
align-items: center;
gap: 5px;
}
.toggle-state {
padding: 5px;
color: #4A5E6D;
font-weight: normal;
cursor: pointer;
}
.remove-filter {
padding: 5px;
color: #333333;
font-weight: normal;
background-color: #6B8E23;
cursor: pointer;
}
.toggle-state.on {
background-color: #E2D6C4;
color: #333333;
}
.toggle-state.off {
background-color: #C4B5A5;
color: #333333;
}
.toggle-state:hover {
opacity: 0.8;
}
.remove-filter:hover {
opacity: 0.8;
}
/* Study Rows and Sorting */
.total-results {
font-size: 12px;
color: #4A5E6D;
margin-bottom: 5px;
}
.sub-headers {
display: flex;
padding: 5px 0;
font-size: 14px;
font-weight: bold;
}
.sort-subheader {
display: flex;
align-items: center;
cursor: pointer;
}
.sort-subheader.date {
width: 100px;
}
.sort-subheader.title {
flex: 1;
}
.sort-subheader:hover {
background-color: #F5DEB3;
}
.sort-subheader .sort-indicator::after {
content: '';
margin-left: 3px;
}
.sort-subheader.asc .sort-indicator::after {
content: '↑';
}
.sort-subheader.desc .sort-indicator::after {
content: '↓';
}
.study-row {
display: flex;
align-items: flex-start;
margin-bottom: 5px;
}
.study-date {
width: 100px;
flex-shrink: 0;
}
.study-title {
flex: 1;
padding-left: 10px;
color: #333;
text-decoration: none;
cursor: pointer;
}
.study-link {
text-decoration: underline;
color: #4A5E6D;
}
.study-link:hover {
color: #6B8E23;
}
.keyword-row {
width: 100%;
margin-bottom: 4px;
}
.keyword-row span {
display: block;
padding: 2px 10px;
color: #333;
cursor: pointer;
}
.keyword-row span:hover {
background-color: #C4B5A5;
}
/* Pagination */
.pagination {
margin-top: 10px;
display: flex;
align-items: center;
gap: 10px;
}
.pagination button {
padding: 5px 10px;
background-color: #6B8E23;
color: #333333;
border: none;
border-radius: 3px;
font-family: Tahoma, Arial, sans-serif;
font-size: 10pt;
cursor: pointer;
}
.pagination button:disabled {
background-color: #C0C0C0;
cursor: not-allowed;
}
.pagination button:hover:not(:disabled) {
background-color: #4A5E6D;
}
.pagination button.hidden {
display: none;
}
.pagination span {
font-size: 14px;
}
/* Study Details */
.date-product {
margin-bottom: 0.5em;
}
.date-product .product {
margin-left: 32px;
}
.synopsis-section {
margin-left: 20px;
margin-bottom: 0.5em;
text-align: left;
}
.synopsis-item {
margin-bottom: 0.5em;
}
.synopsis-label {
font-weight: bold;
}
.conclusion-section {
padding-left: 0;
margin: 0 0 0.5em 0;
text-align: left;
}
.conclusion-section strong {
margin-left: -20px;
display: inline-block;
}
#column3 p.conclusion-section {
padding-left: 0 !important;
margin: 0 0 0.5em 0 !important;
text-align: left !important;
display: block !important;
}
#column3 p.conclusion-section strong {
margin-left: -20px !important;
display: inline-block !important;
}
.link-section {
margin-bottom: 0.5em;
}
.summary-grok {
margin-top: 0.5em;
margin-bottom: 0.5em;
}
/* Color Classes for Study Rows */
.color-0 { background-color: #E0D5C6; }
.color-1 { background-color: #C4B5A5; }
.color-2 { background-color: #A89F94; }
.color-3 { background-color: #C0C0C0; }
.color-4 { background-color: #D3D3D3; }
.color-5 { background-color: #E2D6C4; }
.color-6 { background-color: #D2B48C; }
.color-7 { background-color: #F5DEB3; }
/* Error Styling */
.error {
background-color: #E2D6C4;
color: #333333;
padding: 10px;
border-radius: 4px;
text-align: center;
}
/* Disclaimer */
.disclaimer-container {
max-width: 800px;
margin: 20px auto;
padding: 20px;
background-color: #E0D5C6;
border-radius: 5px;
border-left: 4px solid #4A5E6D;
font-family: Tahoma, Arial, sans-serif;
}
.disclaimer-title {
color: #2c3e50;
font-size: 18px;
margin-bottom: 10px;
font-weight: bold;
}
.disclaimer-text {
color: #555;
line-height: 1.6;
font-size: 14px;
}
.highlight {
font-weight: bold;
color: #333;
}
/* Contact Page */
.contact-container {
max-width: 800px;
margin: 0 auto;
padding: 20px;
background-color: #E0D5C6;
color: #333;
padding-bottom: 60px;
}
p.intro {
font-size: 1.1em;
margin-bottom: 20px;
color: #4A5E6D;
}
form {
background: #E2D6C4;
border-radius: 8px;
box-shadow: 0 2px 5px rgba(0,0,0,0.1);
}
label {
display: block;
margin: 10px 0 5px;
font-weight: bold;
color: #2c3e50;
}
input[type="text"],
input[type="email"],
input[type="number"],
textarea {
width: 100%;
padding: 8px;
margin-bottom: 15px;
border: none;
border-radius: 4px;
box-sizing: border-box;
font-size: 1em;
background: #E0D5C6;
}
textarea {
height: 100px;
resize: vertical;
}
input[type="submit"] {
background: #6B8E23;
color: #333333;
padding: 10px 20px;
border: none;
border-radius: 4px;
font-size: 1em;
cursor: pointer;
}
input[type="submit"]:hover {
background: #4A5E6D;
}
.feedback {
margin-top: 15px;
padding: 10px;
border-radius: 4px;
text-align: center;
}
.success {
background: #E0D5C6;
color: #333333;
}
.error {
background: #E2D6C4;
color: #333333;
}
/* FAQ and General Content */
.content-container {
max-width: 800px;
margin: 20px auto;
padding: 20px;
background: #E0D5C6;
box-shadow: 0 0 10px rgba(0,0,0,0.1);
padding-bottom: 60px;
}
h2 {
color: #4A5E6D;
font-family: Tahoma, Arial, sans-serif;
font-size: 1.5em;
margin-bottom: 15px;
}
h3 {
color: #6B8E23;
font-family: Tahoma, Arial, sans-serif;
font-size: 1.2em;
margin: 10px 0;
}
#column3 h3 {
font-size: 1.1em;
margin-bottom: 0.3em;
color: #000;
}
/* Source Filter Container */
#source-filter-container {
margin: 10px 0;
font-size: 14px;
display: flex;
align-items: center;
gap: 5px;
}
#source-filter-container label {
color: #4A5E6D;
font-weight: bold;
}
#source-filter-container select {
padding: 5px;
border: none;
border-radius: 3px;
background-color: #E0D5C6;
color: #333;
cursor: pointer;
}
#source-filter-container select:hover {
background-color: #C4B5A5;
}
/* Text Selectability and Interactivity */
*, body, div, span, p, h1, h2, h3, a,
.study-title, .keyword-row, .keyword-row span, .filter, .filter-text,
#column1-content, #column2-content, #column3-content, #filters-content,
.synopsis-section, .date-product, .summary-grok, .conclusion-section, .link-section, .study-link {
user-select: text;
-webkit-user-select: text;
-moz-user-select: text;
-ms-user-select: text;
pointer-events: auto;
touch-action: auto;
}
#columns-container, .filter, #filters-content {
user-select: text;
}
/* External Page Styles /
/ Body and Container */
.external-page body {
font-family: Tahoma, Arial, sans-serif;
font-size: 10pt;
margin: 10px;
background-color: #E8ECEF;
color: #333;
}
.external-page .container {
max-width: 1200px;
margin: 0 auto;
}
/* Table General Styles */
.external-page table {
width: 100%;
max-width: 1200px;
border-collapse: collapse;
margin-top: 10px;
table-layout: fixed;
}
.external-page th,
.external-page td {
border: 1px solid #4A5E6D;
padding: 8px;
text-align: left;
vertical-align: top;
font-family: Tahoma, Arial, sans-serif;
font-size: 10pt;
white-space: normal;
word-wrap: break-word;
min-height: 60px;
}
.external-page #studiesTable th {
background-color: #E0D5C6;
font-family: Tahoma, Arial, sans-serif;
font-weight: bold;
font-size: 10pt;
white-space: nowrap;
}
.external-page #studiesTable th.number-column {
width: 5%;
}
.external-page #studiesTable th.date-column {
width: 7.5%;
}
.external-page #studiesTable th.title-column {
width: 20%;
}
.external-page #studiesTable th.conclusion-table-column {
width: 25%;
}
.external-page #studiesTable th.hs-summary-column {
width: 20%;
}
.external-page #studiesTable th.summary-table-column {
width: 22.5%;
}
/* Column-Specific Styles */
.external-page #studiesTable td.number-column {
text-align: center;
line-height: 1.2;
padding-top: 6px;
}
.external-page #studiesTable th.number-column {
text-align: center;
}
.external-page #studiesTable td.date-column {
line-height: 1.2;
padding-top: 6px;
}
.external-page #studiesTable td.title-column {
line-height: 1.2;
padding-top: 6px;
}
.external-page #studiesTable td.title-column .source {
font-style: italic;
color: #4A5E6D;
}
.external-page #studiesTable td.conclusion-table-column, .external-page #studiesTable td.summary-table-column, .external-page #studiesTable td.hs-summary-column {
max-height: none;
overflow: visible;
text-overflow: unset;
position: relative;
}
.external-page #studiesTable td.conclusion-table-column .conclusion-text {
margin: 0;
padding: 0;
}
.external-page #studiesTable td.summary-table-column:hover {
background-color: #F5DEB3;
}
.external-page #studiesTable td.td.summary-table-column.full-text {
max-height: none;
overflow: visible;
text-overflow: unset;
}
.external-page #studiesTable .toggle-link {
display: inline-block;
font-size: 1.2em;
font-weight: bold;
color: #000;
background-color: #E2D6C4;
border: 1px solid #000;
padding: 4px 8px;
border-radius: 3px;
margin-left: 5px;
text-decoration: none;
cursor: pointer;
}
.external-page #studiesTable .toggle-link.less {
font-size: 0.9em;
padding: 2px 6px;
}
.external-page #studiesTable .toggle-link:hover {
background-color: #C4B5A5;
}
/* Search Controls */
.external-page #search-controls {
background-color: #F5F5F5;
}
.external-page #search-controls select#yearFilter, .external-page #search-controls select#subcategoryFilter {
padding: 5px;
border: none;
border-radius: 3px;
background-color: #E0D5C6;
font-family: Tahoma, Arial, sans-serif;
font-size: 10pt;
height: auto;
max-height: 100px;
overflow-y: auto;
cursor: pointer;
}
.external-page #search-controls select#yearFilter:hover, .external-page #search-controls select#subcategoryFilter:hover {
background-color: #C4B5A5;
}
.external-page #search-controls select#yearFilter.has-selection:hover, .external-page #search-controls select#subcategoryFilter.has-selection:hover {
background-color: #4A5E6D;
}
.external-page #search-controls #year-filter-container span {
margin: 0 5px;
}
/* Pagination */
.external-page .pagination {
justify-content: center;
align-items: baseline;
}
.external-page .pagination button {
margin: 0 10px;
padding: 8px 12px;
background-color: #6B8E23;
color: #333333;
border: none;
border-radius: 3px;
font-family: Tahoma, Arial, sans-serif;
font-size: 10pt;
cursor: pointer;
}
.external-page .pagination button:hover {
background-color: #4A5E6D;
}
.external-page .pagination button.hidden {
display: none;
}
.external-page .pagination input#pageInput {
width: 60px;
}
/* Row Colors */
.external-page tr.color-0 {
background-color: #E0D5C6;
}
.external-page tr.color-1 {
background-color: #C4B5A5;
}
/* Responsive Styles */
@media screen and (max-width: 600px) {
.external-page .date-column,
.external-page .number-column {
font-size: 9pt;
}
.external-page #studiesTable th,
.external-page #studiesTable td {
font-size: 9pt;
}
.external-page #filter-row {
flex-direction: column;
align-items: flex-start;
}
.external-page #year-filter-container,
.external-page #study-type-filter-container {
width: 100%;
}
.external-page #search-submit-btn {
width: 100%;
}
.external-page #year-filter-container {
display: flex;
flex-direction: column;
align-items: flex-start;
}
.external-page #year-filter-container select {
width: 100%;
margin-bottom: 5px;
}
.external-page #year-filter-container span {
margin: 5px 0;
}
}

/* Year dropdown styling */
#yearFilter, #year-filter {
width: 150px;
height: 80px;
border: none;
border-radius: 4px;
padding: 5px;
background-color: #E0D5C6;
font-size: 14px;
}
#yearFilter:focus, #year-filter:focus {
outline: none;
border-color: #4A5E6D;
box-shadow: 0 0 5px rgba(74, 94, 109, 0.3);
}
/* Table styling */
#studiesTable tr {
transition: background-color 0.2s;
}
#studiesTable th, #studiesTable td {
padding: 10px;
border: 1px solid #4A5E6D;
}
/* Review Studies Styles */
.review-studies table {
width: 100%;
border-collapse: collapse;
margin: 20px 0;
table-layout: fixed;
background: #fff;
box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}
.review-studies th, .review-studies td {
border: 1px solid #4A5E6D;
padding: 12px;
text-align: left;
vertical-align: middle;
font-family: Tahoma, Arial, sans-serif;
font-size: 10pt;
white-space: normal;
word-wrap: break-word;
}
.review-studies th {
background-color: #A89F94;
font-weight: 700;
white-space: nowrap;
text-align: center;
}
.review-studies #review-studies-table th.number-column,
.review-studies #review-studies-table td.number-column {
width: 2%;
min-width: 20px;
max-width: 40px;
text-align: center;
}
.review-studies #review-studies-table th.date-column,
.review-studies #review-studies-table td.date-column {
width: 8%; /* Increased from 7% to prevent wrapping */
min-width: 70px;
max-width: 90px;
text-align: center;
}
.review-studies #review-studies-table th.product-column,
.review-studies #review-studies-table td.product-column {
width: 10%;
min-width: 80px;
text-align: left;
}
.review-studies #review-studies-table th.title-column,
.review-studies #review-studies-table td.title-column {
width: 18%; /* Reduced from 19% to give space to Date */
}
.review-studies #review-studies-table th.conclusion-table-column,
.review-studies #review-studies-table td.conclusion-table-column {
width: 13%;
}
.review-studies #review-studies-table th.simple-summary-column,
.review-studies #review-studies-table td.simple-summary-column {
width: 15%;
}
.review-studies #review-studies-table th.grok-summary-column,
.review-studies #review-studies-table td.grok-summary-column {
width: 15%;
}
.review-studies #review-studies-table th.keywords-column,
.review-studies #review-studies-table td.keywords-column {
width: 10%;
}
.review-studies #review-studies-table th.status-column,
.review-studies #review-studies-table td.status-column {
width: 4%;
text-align: center !important;
}
.review-studies #review-studies-table th.action-column,
.review-studies #review-studies-table td.action-column {
width: 15%;
}
.review-studies #review-studies-table tr.status-N {
background-color: #FFFFFF;
}
.review-studies #review-studies-table tr.status-G {
background-color: #D6EAF8;
}
.review-studies #review-studies-table tr.status-A {
background-color: #D4EFDF;
}
.review-studies #review-studies-table tr.status-R {
background-color: #FADBD8;
}
.review-studies #review-studies-table tr.status-M {
background-color: #E5E7EB;
}
.review-studies #review-studies-table tr.recently-added {
background-color: #FEF9C3;
animation: fade-to-status 10s forwards;
}
.review-studies .truncate-text {
max-height: 6em;
overflow: hidden;
}
.review-studies .full-text {
display: none;
white-space: normal;
}
.review-studies .more-less {
color: blue;
text-decoration: underline;
cursor: pointer;
}
.review-studies .action-form {
display: flex;
flex-direction: column;
gap: 5px;
align-items: flex-start;
}
.review-studies .action-form .checkbox-container {
display: flex;
align-items: center;
gap: 5px;
}
.review-studies .action-form input[type="checkbox"] {
margin: 0;
cursor: pointer;
}
.review-studies .action-form .checkbox-container label {
font-size: 10pt;
color: #333;
cursor: default;
margin: 0;
}
.review-studies .action-form button {
padding: 5px 10px;
background-color: #9ACD32; /* Lighter green for better text visibility */
color: #333333;
border: none;
border-radius: 3px;
cursor: pointer;
font-family: Tahoma, Arial, sans-serif;
font-size: 10pt;
}
.review-studies .action-form button:hover {
background-color: #A89F94;
}
.review-studies .hidden {
display: none;
}
.review-studies .page-header {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 10px;
}
.review-studies .page-title {
margin: 0;
font-weight: 400;
color: white;
font-size: 1.3em;
}
.review-studies .search-table {
table-layout: fixed;
}
.review-studies #search-controls {
background-color: #A89F94;
padding: 5px;
border-radius: 5px;
margin-bottom: 20px;
}
.review-studies .search-table td {
border: 1px solid #000;
padding: 2px;
}
.review-studies .pagination button {
background-color: #6B8E23;
color: #333333;
}
.review-studies .total-studies {
font-size: 12px;
color: #4A5E6D;
margin-bottom: 5px;
}
.review-studies #submit-batch {
float: right;
padding: 10px 20px;
font-size: 16px;
background-color: #6B8E23;
color: white;
border: none;
border-radius: 3px;
cursor: pointer;
}
.review-studies #submit-batch:hover {
background-color: #4A5E6D;
}
.review-studies .refresh-instruction {
display: none;
color: red;
text-align: center;
}
.review-studies .action-column label {
display: block;
margin: 2px 0;
font-size: smaller;
}
.review-studies .scroll-box {
max-height: 300px;
overflow-y: auto;
border: 1px solid #ccc;
padding: 5px;
margin-bottom: 10px;
word-wrap: break-word;
}
.review-studies .modal {
font-size: 0.9em;
}
.review-studies .modal-buttons {
text-align: center;
}
.review-studies .page-form {
    display: inline-flex;
    align-items: center;
    margin: 0;
}
.review-studies .page-form label {
    margin-right: 5px;
}
.review-studies .page-form input {
    width: 80px;
    background-color: white;
    border: 1px solid #ccc;
    text-align: center;
    margin: 0 5px;
}
.review-studies .go-page {
    padding: 5px 10px;
    background-color: #6B8E23;
    color: #333333;
    border: 1px solid #4A5E6D;
    border-radius: 3px;
    cursor: pointer;
}
.review-studies .go-page:hover {
    background-color: #4A5E6D;
}
.review-studies .years-select select {
height: auto;
max-height: 100px;
overflow-y: auto;
}
.review-studies .product-label, .review-studies .source-label, .review-studies .years-label, .review-studies .status-label, .review-studies .title-label {
width: 5%;
text-align: right;
padding-right: 2px;
vertical-align: middle;
}
.review-studies .product-select, .review-studies .source-select, .review-studies .years-select, .review-studies .status-select {
width: 15%;
text-align: left;
padding-left: 2px;
vertical-align: middle;
}
.review-studies .title-input {
text-align: left;
padding-left: 2px;
vertical-align: middle;
}
.review-studies .search-btn-cell {
vertical-align: middle;
width: 10%;
text-align: center;
}
.review-studies .search-btn-cell button {
padding: 5px 10px;
font-size: 14px;
background-color: #A89F94;
}


/* New Studies Styles */
.new-studies {
    background-color: #ADD8E6; /* Reverted to original turquoise page background */
}
.new-studies table {
width: 100%;
border-collapse: collapse;
margin: 20px 0;
table-layout: fixed;
background: #fff;
box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}
.new-studies th, .new-studies td {
border: 1px solid #4A5E6D;
padding: 12px;
text-align: left;
vertical-align: middle;
font-family: Tahoma, Arial, sans-serif;
font-size: 10pt;
white-space: normal;
word-wrap: break-word;
}
.new-studies th {
background-color: #008080; /* Reverted to original teal for headers */
font-weight: 700;
white-space: nowrap;
text-align: center;
color: white; /* White text for contrast */
}
.new-studies #new-studies-table th.number-column,
.new-studies #new-studies-table td.number-column {
width: 5%;
min-width: 40px;
max-width: 60px;
text-align: center;
}
.new-studies #new-studies-table th.date-column,
.new-studies #new-studies-table td.date-column {
width: 10%;
min-width: 80px;
max-width: 100px;
text-align: center;
}
.new-studies #new-studies-table th.product-column,
.new-studies #new-studies-table td.product-column {
width: 15%; /* Adequate width to prevent stacking */
min-width: 120px; /* Minimum to ensure horizontal display */
text-align: left;
white-space: nowrap; /* Prevent wrapping; use ellipsis if needed for long text */
overflow: hidden;
text-align: center;
text-overflow: ellipsis;
}
.new-studies #new-studies-table th.title-column,
.new-studies #new-studies-table td.title-column {
width: 30%;
min-width: 200px;
}
.new-studies #new-studies-table th.conclusion-table-column,
.new-studies #new-studies-table td.conclusion-table-column {
width: 30%;
min-width: 200px;
}
.new-studies #new-studies-table th.action-column,
.new-studies #new-studies-table td.action-column {
width: 10%;
min-width: 80px;
}
.new-studies .truncate-text {
max-height: 6em;
overflow: hidden;
}
.new-studies .full-text {
display: none;
white-space: normal;
}
.new-studies .more-less {
color: blue;
text-decoration: underline;
cursor: pointer;
}
.new-studies button.cursor-pointer {
padding: 5px 10px;
background-color: #9ACD32; /* Lighter green for better text visibility */
color: #333333;
border: none;
border-radius: 3px;
cursor: pointer;
font-family: Tahoma, Arial, sans-serif;
font-size: 10pt;
}
.new-studies button.cursor-pointer:hover {
background-color: #A89F94;
}
.new-studies .hidden {
display: none;
}
.new-studies .action-form {
    display: flex;
    flex-direction: column;
    gap: 10px; /* Increased to 10px for a more noticeable "blank line" feel; adjust as needed */
    align-items: flex-start;
}
.new-studies #search-controls {
    background-color: #008080; /* Reverted to original teal for search controls */
    padding: 10px;
    border-radius: 5px;
    margin-bottom: 5px;
}
.new-studies .years-cell select#yearFilter {
    width: 100% !important;
    box-sizing: border-box;
    display: block;
    height: 100px !important; /* Dialed back to ~100px for ~4-5 lines; tweak to 110px if still over */
    overflow-y: auto;
    margin: 0 auto;
}

.new-studies th {
    background-color: #008080; /* Consistent with above */
    color: white;
}
.new-studies .page-title {
font-weight: 400;
color: white;
font-size: 1.3em; /* Smaller font for New Studies heading */
}
.new-studies .clear-cache {
text-align: left;
margin-top: 10px;
}
.new-studies .search-btn-cell {
vertical-align: bottom;
}
.new-studies .search-btn-cell div {
text-align: center;
margin-top: 10px;
}
.new-studies .search-table {
table-layout: fixed;
}
.new-studies .search-table td {
width: 25%;
padding: 5px;
vertical-align: middle;
text-align: left;
}
.new-studies .search-table td:first-child {
width: 25%;
text-align: left;
}
.new-studies .query-cell strong, .new-studies .source-cell strong, .new-studies .years-cell strong {
display: block;
}
.new-studies .query-cell select, .new-studies .query-cell input {
width: 100%;
box-sizing: border-box;
}
.new-studies .source-cell select {
width: 80%;
box-sizing: border-box;
}

.new-studies .search-btn-cell button {
width: 80%;
box-sizing: border-box;
background-color: #6B8E23;
color: white;
}
.new-studies .years-cell strong {
text-align: left;
margin-left: 0;
}
.new-studies .query-cell {
width: 35%;
}
.new-studies .source-cell {
width: 20%;
text-align: center;
}
.new-studies .years-cell {
width: 25%;
text-align: center;
}
.new-studies .search-btn-cell {
width: 20%;
}
.new-studies .source-cell strong {
text-align: center;
display: block;
}
.new-studies .source-cell select {
margin: 0 auto;
display: block;
width: 80%;
}
.new-studies .years-cell strong {
text-align: center;
display: block;
}

/* New Studies Styles - More/Less Enhancements */
.new-studies .truncate-text {
    max-height: 6em; /* Matches review_studies */
    overflow: hidden;
    transition: max-height 0.3s ease; /* Smooth expand/collapse */
    line-height: 1.4; /* Improves readability */
}

.new-studies .more-less {
    color: #007bff; /* Blue for consistency */
    text-decoration: underline;
    cursor: pointer;
    font-size: 0.9em; /* Slightly smaller */
    margin-left: 5px; /* Space from text */
}

.new-studies .more-less:hover {
    color: #0056b3; /* Darker blue on hover */
}

.new-studies .conclusion-table-column,
.new-studies .abstract-column { /* Add if you have abstract; adjust columns as needed */
    position: relative; /* For absolute positioning if needed */
}
/* Shared Styles for Modals and Other Elements */
#modal {
display: none;
position: fixed;
top: 5%;
left: 5%;
width: 90%;
background: white;
padding: 20px;
border: 1px solid black;
z-index: 1000;
max-height: 90vh;
overflow-y: auto;
}
#help-modal {
display: none;
position: fixed;
top: 5%;
left: 5%;
width: 90%;
background: white;
padding: 20px;
border: 1px solid black;
z-index: 1000;
max-height: 90vh;
overflow-y: auto;
}
#confirm-modal {
display: none;
position: fixed;
top: 5%;
left: 5%;
width: 90%;
background: white;
padding: 20px;
border: 1px solid black;
z-index: 1000;
max-height: 90vh;
overflow-y: auto;
}
#keywords-modal {
display: none;
position: fixed;
top: 5%;
left: 5%;
width: 90%;
background: white;
padding: 20px;
border: 1px solid black;
z-index: 1000;
max-height: 90vh;
overflow-y: auto;
}
#regrok-modal {
display: none;
position: fixed;
top: 5%;
left: 5%;
width: 90%;
background: white;
padding: 20px;
border: 1px solid black;
z-index: 1000;
max-height: 90vh;
overflow-y: auto;
}
#modal {
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
max-width: 80%;
}
#help-modal h3 {
color: #4A5E6D;
}
#confirm-modal h3 {
color: #4A5E6D;
}
#keywords-modal h3 {
color: #4A5E6D;
}
#regrok-modal h3 {
color: #4A5E6D;
}
#modal-text {
user-select: text;
}
#custom_keywords {
width: 100%;
}
#custom_keywords_regrok {
width: 100%;
}
#process-changes-btn {
padding: 10px 20px;
margin: 5px;
cursor: pointer;
}
#skip-btn {
padding: 10px 20px;
margin: 5px;
cursor: pointer;
}
#cancel-btn {
padding: 10px 20px;
margin: 5px;
cursor: pointer;
}
#process-regrok-btn {
padding: 10px 20px;
margin: 5px;
cursor: pointer;
}
#cancel-regrok-btn {
padding: 10px 20px;
margin: 5px;
cursor: pointer;
}
#update-keywords-btn {
padding: 10px 20px;
margin: 5px;
cursor: pointer;
}
#cancel-keywords-btn {
padding: 10px 20px;
margin: 5px;
cursor: pointer;
}
#close-help-btn {
padding: 10px 20px;
margin: 5px;
cursor: pointer;
}
tr.approved-row {
background-color: #d4edda; /* Light green for studies in studies table */
}
#search-btn {
padding: 12px 24px; /* Bigger button /
font-size: 18px;
display: block;
margin: 10px auto; / Center below filters */
}
.filter-group {
display: flex;
flex-direction: row;
align-items: center;
gap: 15px;
flex-wrap: wrap;
}
input[type="checkbox"] {
width: 20px;
height: 20px;
}
.music-wrapper {
position: relative;
}
.music-box {
font-size: 18px;
cursor: pointer;
width: 30px;
height: 30px;
display: flex;
align-items: center;
justify-content: center;
}

.music-icon {
  cursor: pointer;
}
.search-table td {
    vertical-align: middle;
}
#filters-box {
    background-color: #A89F94;
    padding: 10px;
    border-radius: 5px;
    margin-bottom: 20px;
}
.error-message {
    position: fixed;
    top: 20px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 2000;
    background-color: #dc3545 !important;  /* Dark red */
    color: #fff !important;  /* White text */
    padding: 15px 25px !important;  /* Bigger box */
    border-radius: 5px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.2);
    min-height: 60px !important;  /* Full rectangle height */
    width: 80% !important;
    max-width: 600px;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;  /* Message left, Dismiss right */
    font-family: Arial, sans-serif;
    font-size: 14px;
    line-height: 1.4;
    border: 2px solid #a71e2a !important;  /* Darker red border */
}

.error-message .dismiss-btn {
    background: none;
    border: none;
    font-size: 24px;
    cursor: pointer;
    color: #fff !important;
}
.error-message .dismiss-btn:hover {
    color: #a71e2a  !important;
}

@keyframes pulse {
0% { transform: scale(1); opacity: 1; }
50% { transform: scale(1.1); opacity: 0.85; }
100% { transform: scale(1); opacity: 1; }
}
@keyframes fade-to-status {
0% { background-color: #FEF9C3; }
100% { background-color: inherit; }
}

/* Shared Button Styles */
.search-btn {
  color: white; /* Changed text color to white for visibility on dark backgrounds */
  padding: 0.7em 1.7em;
  font-size: 18px;
  border-radius: 0.5em;
  background: #6B8E23; /* Olive green background to match previous theme; adjust if needed */
  cursor: pointer;
  border: 1px solid #6B8E23; /* Matching border to background for a clean look */
  transition: background 0.3s; /* Simple background transition on hover, no other effects */
}

.search-btn:hover {
  background: #556B2F; /* Slightly darker olive on hover */
}

.search-btn:active {
  background: #4A5E6D; /* Even darker on active/click */
}