/**
 * Reveal Table for Elementor — frontend styles.
 *
 * Only structural rules live here. Everything visual is driven by Elementor
 * style controls, which write either direct declarations or the custom
 * properties declared below.
 */

.wps-rt {
	--wps-rt-collapsed-h: 300px;
	--wps-rt-fade-h: 120px;
	--wps-rt-fade-color: #ffffff;
	--wps-rt-duration: 400ms;
	--wps-rt-icon-gap: 8px;

	position: relative;
}

.wps-rt__frame {
	position: relative;
	overflow: hidden;
}

/* Vertical clipping lives here. */
.wps-rt__viewport {
	position: relative;
}

/* Horizontal scrolling lives on its own element so the two overflow axes
   do not force each other into scroll containers. */
.wps-rt__scroller {
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}

.wps-rt__table {
	width: 100%;
	border-collapse: collapse;
	margin: 0;
}

/* Break only words that genuinely cannot fit, rather than splitting every
   long-ish label across lines. */
.wps-rt__table th,
.wps-rt__table td {
	overflow-wrap: break-word;
}

/* Wide-table mode: let the table take its natural width and scroll sideways
   instead of crushing every column to fit the container. */
.wps-rt--wide-scroll .wps-rt__table {
	width: max-content;
	min-width: 100%;
}

.wps-rt--wide-scroll .wps-rt__table th,
.wps-rt--wide-scroll .wps-rt__table td {
	white-space: nowrap;
}

.wps-rt__table td {
	padding: 10px 12px;
	vertical-align: middle;
}

.wps-rt__fade {
	display: none;
	position: absolute;
	right: 0;
	bottom: 0;
	left: 0;
	height: var(--wps-rt-fade-h);
	background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, var(--wps-rt-fade-color) 100%);
	pointer-events: none;
}

.wps-rt__actions {
	text-align: center;
}

/* The button and the clipping only exist once the script has taken over, so a
   visitor without JavaScript gets the whole table rather than a truncated one. */
.wps-rt__toggle {
	display: none;
}

.wps-rt--js .wps-rt__toggle {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--wps-rt-icon-gap);
	padding: 12px 24px;
	border: none;
	background: none;
	font: inherit;
	color: inherit;
	cursor: pointer;
}

.wps-rt--js .wps-rt__toggle--icon-before {
	flex-direction: row;
}

.wps-rt--js .wps-rt__toggle--icon-after {
	flex-direction: row-reverse;
}

.wps-rt__toggle-icon {
	display: inline-flex;
	align-items: center;
	line-height: 1;
}

.wps-rt__toggle-icon svg {
	width: 1em;
	height: 1em;
	fill: currentColor;
}

/* Clipping stays on for the whole animation, otherwise rows spill out of the
   viewport while max-height is still growing. */
.wps-rt--js .wps-rt__viewport {
	overflow: hidden;
	transition: max-height var(--wps-rt-duration) ease;
}

.wps-rt--js.wps-rt--collapsed .wps-rt__viewport {
	max-height: var(--wps-rt-collapsed-h);
}

.wps-rt--js.wps-rt--collapsed .wps-rt__fade {
	display: block;
}

/* Editor-only message when the file is missing or unreadable. */
.wps-rt-notice {
	padding: 16px 20px;
	border: 1px dashed #c3c4c7;
	border-radius: 4px;
	background-color: #f6f7f7;
	color: #50575e;
	font-size: 13px;
	line-height: 1.6;
	text-align: center;
}

@media (prefers-reduced-motion: reduce) {
	.wps-rt--js .wps-rt__viewport,
	.wps-rt__table tbody tr,
	.wps-rt__toggle {
		transition: none !important;
	}
}
