/**
 * Orbitalia Dynamic Table — base styles.
 *
 * Variables CSS para que Elementor pueda sobreescribir sin pelearse con specificity.
 */

.orbitalia-table__title {
	margin: 0 0 16px;
	line-height: 1.2;
}

.orbitalia-table-wrapper {
	width: 100%;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}

.orbitalia-table-wrapper:focus-visible {
	outline: 2px solid currentColor;
	outline-offset: 2px;
}

.orbitalia-table {
	width: 100%;
	border-collapse: collapse;
	background: var(--orbitalia-table-bg, transparent);
	/* Sin border-radius por defecto. overflow:hidden clipa los fondos de
	 * celda a las esquinas cuando el control de radius lo define. */
	overflow: hidden;
}

/* Reset de bordes: ningún borde por defecto en NINGÚN elemento de la tabla
 * (incluye el borde superior sobre la cabecera y los verticales internos que
 * inyecta el tema). Scope con .orbitalia-table-wrapper para ganar specificity
 * a los estilos de tabla del tema. Los controles Elementor (cabecera/filas)
 * los reañaden con más specificity si se configuran. */
.orbitalia-table-wrapper .orbitalia-table,
.orbitalia-table-wrapper .orbitalia-table thead,
.orbitalia-table-wrapper .orbitalia-table tbody,
.orbitalia-table-wrapper .orbitalia-table tfoot,
.orbitalia-table-wrapper .orbitalia-table tr,
.orbitalia-table-wrapper .orbitalia-table th,
.orbitalia-table-wrapper .orbitalia-table td {
	border: 0;
}

.orbitalia-table th,
.orbitalia-table td {
	padding: 16px 20px;
	text-align: left;
	vertical-align: middle;
}

.orbitalia-table thead th {
	font-size: 0.85em;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	font-weight: 600;
	background: #f5f1ec;
}

/* Sin alternancia de fondo por defecto: anula también el striping que algunos
 * temas aplican a tbody tr:nth-child(). Se activa con "Filas alternas" en el
 * panel (clase .orbitalia-table--alt), que tiene más specificity. */
.orbitalia-table-wrapper .orbitalia-table tbody tr {
	background: transparent;
}

.orbitalia-table--alt tbody tr:nth-child(even):not(.orbitalia-table__row--highlighted) {
	background: #fafafa;
}

/* Specificity por encima del reset de tbody tr para que el verde sobreviva. */
.orbitalia-table-wrapper .orbitalia-table tbody tr.orbitalia-table__row--highlighted {
	background: #e8f4ee;
	font-weight: 600;
}

/* ---- Anti-tema -----------------------------------------------------------
 * Algunos temas estilan <th>/<td> con alta specificity o !important: un borde
 * superior gris sobre la cabecera (border-top en los th, que con
 * border-collapse se ve como borde superior de la tabla) y zebra striping en
 * el FONDO de los td (no del tr). El reset normal de arriba no los vence.
 *
 * Se usa !important SOLO en propiedades que ningún control Elementor gestiona,
 * para no romper los controles de borde de cabecera (border-bottom de th) ni
 * de filas (border-top en el tr). Los fondos de fila (Cuerpo / Filas alternas
 * / Fila destacada) viven en el <tr> y se ven a través del td transparente. */
.orbitalia-table-wrapper .orbitalia-table thead th {
	border-top-width: 0 !important;
	border-inline-width: 0 !important;
}

.orbitalia-table-wrapper .orbitalia-table tbody td {
	border-inline-width: 0 !important;
	background-color: transparent !important;
}

/* Caption */
.orbitalia-table__caption {
	caption-side: top;
	padding: 8px 12px;
	font-style: italic;
	color: inherit;
}

.orbitalia-table__caption--bottom {
	caption-side: bottom;
}

.orbitalia-table__caption--visually-hidden {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

/* Placeholder (Elementor editor mode)
 * Sigue convención del plugin base: misma clase del widget con modifier --empty.
 */
.orbitalia-table.orbitalia-table--empty {
	display: block;
	width: 100%;
	padding: 24px;
	border: 1px dashed #c5c5c5;
	border-radius: 4px;
	color: #777;
	font-size: 14px;
	text-align: center;
	background: #fafafa;
}

/* -------------------------------------------------------------------------
 * Responsive: stack mode
 * ----------------------------------------------------------------------- */

@media (max-width: 640px) {
	.orbitalia-table--stack {
		display: block;
		border-radius: 0;
	}

	.orbitalia-table--stack thead {
		position: absolute;
		width: 1px;
		height: 1px;
		padding: 0;
		margin: -1px;
		overflow: hidden;
		clip: rect(0, 0, 0, 0);
		white-space: nowrap;
		border: 0;
	}

	.orbitalia-table--stack tbody,
	.orbitalia-table--stack tbody tr {
		display: block;
		width: 100%;
	}

	.orbitalia-table--stack tbody tr {
		margin-bottom: 16px;
		border: 1px solid #ececec;
		border-radius: 8px;
		padding: 8px;
		overflow: hidden;
	}

	.orbitalia-table--stack tbody tr + tr {
		border-top: 1px solid #ececec;
	}

	.orbitalia-table--stack td {
		display: flex;
		justify-content: space-between;
		align-items: baseline;
		gap: 12px;
		padding: 8px 12px;
		text-align: right;
	}

	.orbitalia-table--has-stack-labels td::before {
		content: attr(data-label);
		font-weight: 600;
		text-align: left;
		flex: 0 0 auto;
		color: inherit;
		opacity: 0.75;
		text-transform: uppercase;
		font-size: 0.8em;
		letter-spacing: 0.04em;
	}

	.orbitalia-table--has-stack-labels td:not([data-label])::before {
		content: none;
	}
}
