@charset "UTF-8";
/* CSS Document */

/* ========================================================================================== COLOR VARIABLES ================== */
:root {
    --navy: #002855;
    --lake-blue: #4DA9E9;
    --industrial-gray: #8c8c8c;
    --cream-city-brick: #F5E6C8;
    --bright-white: #FFFFFF;
	--bg-color: #F8F8F8;
	--table-zebra-color: #F3F3F3;
}

/* ========================================================================================== TABLE FORMATTING ================== */
.standard-table {
	width: 100%;
	border-collapse: collapse;
	margin: 20px 0;
	font-size: 15px;
	background: var(--bright-white);
	border: 1px solid var(--industrial-gray);
	table-layout: fixed; /* makes all columns equal width */
}

.standard-table th,
.standard-table td {
	border: 1px solid var(--industrial-gray); /* cell border */
	padding: 12px 10px;
	text-align: center; /* center text in all cells */
	vertical-align: middle; /* center text vertically */
	word-wrap: break-word; /* allows wrapping so columns stay even */
}

.standard-table th {
	background: var(--industrial-gray);
	font-weight: bold;
}

/* Zebra striping for readability */
.standard-table tbody tr:nth-child(even) {
background-color: var(--table-zebra-color);
}


/* ========================================================================================== SCROLLING TABLE ================== */
.scrolling-table {
width: 100%;
border-collapse: collapse;
margin: 20px 0;
font-size: 15px;
background: var(--bright-white);
border: 1px solid var(--industrial-gray);
table-layout: fixed;
}

.scrolling-table th,
.scrolling-table td {
border: 1px solid var(--industrial-gray);
padding: 12px 10px;
text-align: center;
vertical-align: middle;
word-wrap: break-word;
}

.scrolling-table th {
background: var(--industrial-gray);
font-weight: bold;
}

/* Zebra striping for readability */
.scrolling-table tbody tr:nth-child(even) {
background-color: var(--table-zebra-color);
}

/*.scrolling-table td:nth-child(n+2):nth-child(-n+8),
.scrolling-table th:nth-child(n+2):nth-child(-n+8) {
background-color: var(--cream-city-brick);
} */

/* Scroll wrapper */
.scrolling-table-scroll {
width: 100%;
overflow-x: auto;
-webkit-overflow-scrolling: touch; /* smooth scroll on iOS */
}

/* Optional: shadow hint for scroll */
.scrolling-table-scroll::after {
content: '';
display: block;
height: 2px;
background: linear-gradient(to right, rgba(0,0,0,0.05), rgba(0,0,0,0));
margin-top: -2px;
}

/* Table inside scroll container */
.scrolling-table {
width: max-content;   /* allow table to expand naturally beyond container */
min-width: 100%;      /* ensure it’s at least full container width */
border-collapse: collapse;
margin: 20px 0;
font-size: 15px;
background: var(--bright-white);
border: 1px solid var(--industrial-gray);
table-layout: auto;   /* auto so columns fit content */
}

/* ========================================================================================== HIGHLIGHTED TABLE ROW ================== */
.standard-table tbody tr.highlight-row td {
  background-color: var(--cream-city-brick) !important;
}