/* ==========================================================================
   UMBC Accessible Table Block
   ========================================================================== */

.umbc-table-block {
	margin: 2rem 0;
	border: none !important;
	background: none !important;
}

/* Optional heading above the table */
.umbc-table-block__heading {
	font-size: 1.5rem;
	font-weight: 800;
	color: #2d2d2d;
	margin: 0 0 0.75rem;
	line-height: 1.2;
}

/* Visually-hidden caption / summary (screen-reader only) */
.umbc-table-block__sr-caption {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

/* Visible caption below the heading (optional) */
.umbc-table-block__caption--visible {
	font-size: 0.9375rem;
	color: #636466;
	margin: 0 0 0.5rem;
	font-style: italic;
}

/* ── CSS custom properties — overridden inline by PHP when editor fields are set ── */
.umbc-table-block {
	--tbl-border-width:              var(--tbl-border-width-override,              1px);
	--tbl-border-color:              var(--tbl-border-color-override,              #d0d0d0);
	--tbl-radius:                    var(--tbl-radius-override,                    var(--umbc-radius-sm, 4px));
	--tbl-font-size:                 var(--tbl-font-size-override,                 0.875rem);
	--tbl-note-size:                 var(--tbl-note-size-override,                 0.75rem);
	--tbl-cell-pad-v:                0.5rem;
	--tbl-cell-pad-h:                0.875rem;

	/* Header */
	--tbl-header-bg:                 var(--tbl-header-bg-override,                 #2d2d2d);
	--tbl-header-color:              var(--tbl-header-color-override,              #ffffff);
	--tbl-header-border-bottom-w:    var(--tbl-header-border-bottom-w-override,    2px);
	--tbl-header-border-color:       var(--tbl-header-border-color-override,       #fbce07);
	--tbl-header-col-divider:        var(--tbl-header-col-divider-override,        rgba(255,255,255,0.2));

	/* Body */
	--tbl-body-bg:                   var(--tbl-body-bg-override,                   #ffffff);
	--tbl-row-header-bg:             var(--tbl-row-header-bg-override,             #f0f0f0);
	--tbl-stripe-bg:                 var(--tbl-stripe-bg-override,                 #f5f5f5);
	--tbl-hover-bg:                  var(--tbl-hover-bg-override,                  #eef7f7);
}

/* Scroll wrapper — lets wide tables scroll on mobile without breaking layout.
   overflow:hidden is required so the table's square corners don't bleed
   outside the wrapper's border-radius. */
.umbc-table-block__scroll-wrap {
	overflow-x: auto;
	overflow-y: hidden; /* clips table corners to the wrapper radius */
	-webkit-overflow-scrolling: touch;
	border: var(--tbl-border-width) solid var(--tbl-border-color);
	border-radius: var(--tbl-radius);
}

/* ── Table ── */
.umbc-table-block__table {
	width: 100%;
	border-collapse: collapse;
	background: var(--tbl-body-bg);
	font-size: var(--tbl-font-size) !important;
	line-height: 1.5;
	min-width: 480px;
}

/* ── Head ── */
.umbc-table-block__table thead {
	background: var(--tbl-header-bg);
	color: var(--tbl-header-color);
}

.umbc-table-block__table thead th {
	padding: var(--tbl-cell-pad-v) var(--tbl-cell-pad-h);
	text-align: left;
	font-weight: 700;
	font-size: var(--tbl-font-size) !important;
	letter-spacing: 0.01em;
	border-bottom: var(--tbl-header-border-bottom-w) solid var(--tbl-header-border-color);
	border-right: var(--tbl-border-width) solid var(--tbl-header-col-divider);
	white-space: nowrap;
}

.umbc-table-block__table thead th:last-child {
	border-right: none;
}

/* ── Body ── */
.umbc-table-block__table tbody tr {
	border-bottom: var(--tbl-border-width) solid var(--tbl-border-color);
	transition: background 0.15s ease;
}

.umbc-table-block__table tbody tr:last-child {
	border-bottom: none;
}

/* Striped rows */
.umbc-table-block--striped .umbc-table-block__table tbody tr:nth-child(odd) {
	background: var(--tbl-stripe-bg);
}

.umbc-table-block__table tbody tr:hover {
	background: var(--tbl-hover-bg);
}

.umbc-table-block__table tbody td,
.umbc-table-block__table tbody th {
	padding: var(--tbl-cell-pad-v) var(--tbl-cell-pad-h);
	vertical-align: top;
	color: #2d2d2d;
	font-size: var(--tbl-font-size) !important;
	border-right: var(--tbl-border-width) solid var(--tbl-border-color);
}

.umbc-table-block__table tbody td:last-child,
.umbc-table-block__table tbody th:last-child {
	border-right: none;
}

/* Row-header cells in tbody */
.umbc-table-block__table tbody th {
	font-weight: 700;
	background: var(--tbl-row-header-bg);
	white-space: nowrap;
}

/* ── Foot ── */
.umbc-table-block__table tfoot td,
.umbc-table-block__table tfoot th {
	padding: var(--tbl-cell-pad-v) var(--tbl-cell-pad-h);
	font-size: var(--tbl-font-size) !important;
	color: #636466;
	border-top: var(--tbl-border-width) solid var(--tbl-border-color);
	background: var(--tbl-stripe-bg);
}

/* ── Source / note below table ── */
.umbc-table-block__note,
.umbc-table-block__note p,
.umbc-table-block__note em,
.umbc-table-block__note i,
.umbc-table-block__note a,
.umbc-table-block__note strong {
	font-size: var(--tbl-note-size) !important;
}

.umbc-table-block__note {
	color: #636466;
	margin: 0.75rem 0 0;
	font-style: italic;
	padding: 0;
	border: none;
	background: none;
}

.umbc-table-block__note p {
	margin: 0;
}

.umbc-table-block__note a {
	color: #007176;
}

/* ── Highlight column variant ── */
.umbc-table-block--highlight-first .umbc-table-block__table td:first-child,
.umbc-table-block--highlight-first .umbc-table-block__table th:first-child {
	font-weight: 700;
}

/* ── Gold header variant ── */
.umbc-table-block--gold-header .umbc-table-block__table thead {
	background: var(--tbl-header-bg, #fbce07);
	color: var(--tbl-header-color, #2d2d2d);
}

.umbc-table-block--gold-header {
	--tbl-header-bg:           var(--tbl-header-bg-override,           #fbce07);
	--tbl-header-color:        var(--tbl-header-color-override,        #2d2d2d);
	--tbl-header-border-color: var(--tbl-header-border-color-override, #2d2d2d);
	--tbl-header-col-divider:  var(--tbl-header-col-divider-override,  rgba(0,0,0,0.15));
}

/* ── Teal header variant ── */
.umbc-table-block--teal-header {
	--tbl-header-bg:    var(--tbl-header-bg-override,    #007176);
	--tbl-header-color: var(--tbl-header-color-override, #ffffff);
}

/* ── Compact density ── */
.umbc-table-block--compact {
	--tbl-cell-pad-v: 0.3rem;
	--tbl-cell-pad-h: 0.625rem;
}
.umbc-table-block--compact .umbc-table-block__table thead th,
.umbc-table-block--compact .umbc-table-block__table tbody td,
.umbc-table-block--compact .umbc-table-block__table tbody th {
	font-size: 0.8125rem;
}

/* ── Responsive ── */
@media (max-width: 640px) {
	.umbc-table-block__heading {
		font-size: 1.25rem;
	}
}

/* ── Empty state (editor only) ── */
.umbc-table-block__empty-state {
	padding: 2rem;
	background: #f8f8f8;
	border: 2px dashed #c8c8c8;
	border-radius: var(--umbc-radius-md, 8px);
	color: #636466;
	font-size: 0.9375rem;
	text-align: center;
}

/* =============================================================
   Dark Mode — Table Block
   Override CSS custom properties so all variant combinations
   (default, gold-header, teal-header, striped, compact) adapt
   automatically.
   ============================================================= */

[data-theme="dark"] .umbc-table-block {
	--tbl-border-color:           var(--umbc-border, #3d3d3d);
	--tbl-header-bg:              #2a2a2a;
	--tbl-header-color:           #e0e0e0;
	--tbl-header-border-color:    #fdb515;
	--tbl-header-col-divider:     rgba(255, 255, 255, 0.12);
	--tbl-body-bg:                #1e1e1e;
	--tbl-row-header-bg:          #252525;
	--tbl-stripe-bg:              #222;
	--tbl-hover-bg:               #263333;
}

/* Heading above table */
[data-theme="dark"] .umbc-table-block__heading {
	color: #e0e0e0;
}

/* Visible caption */
[data-theme="dark"] .umbc-table-block__caption--visible {
	color: #999;
}

/* Cell text */
[data-theme="dark"] .umbc-table-block__table tbody td,
[data-theme="dark"] .umbc-table-block__table tbody th {
	color: #d0d0d0;
}

/* Footer row */
[data-theme="dark"] .umbc-table-block__table tfoot td,
[data-theme="dark"] .umbc-table-block__table tfoot th {
	color: #999;
}

/* Source / note */
[data-theme="dark"] .umbc-table-block__note {
	color: #999;
}

[data-theme="dark"] .umbc-table-block__note a {
	color: #00a8af;
}

/* Gold-header variant: black text on gold — valid pair, no change needed */

/* Empty state */
[data-theme="dark"] .umbc-table-block__empty-state {
	background: var(--umbc-surface-card-alt, #232323);
	border-color: var(--umbc-border, #3d3d3d);
	color: #888;
}