/**
 * Torneo de Invierno - Plugin Public Styles
 *
 * Shared CSS custom properties, badges, cards, forms, buttons, tables,
 * utilities, and responsive helpers for the public-facing side.
 * All custom properties use the --mo-torneo-invierno- prefix.
 *
 * This file is enqueued on every "app page" (virtual pages & shortcodes).
 * Module-specific styles depend on this file.
 *
 * @package MO_Torneo_Invierno
 * @since   1.0.0
 */

/* ==========================================================================
   1. CSS Custom Properties
   ========================================================================== */

:root {
	/* --- Brand (Azul/Celeste — rebrand AFA 2026) ---
	   SYNC CONTRACT (rebrand Fase C): estos 9 brand tokens deben permanecer
	   IDÉNTICOS en plugin/assets/css/base.css y theme/assets/css/base.css.
	   Hay dos :root a propósito (orden de carga: el plugin solo encola base.css
	   en app-pages; el theme lo encola en todo el front + editor). Para futuros
	   rebrands editar AMBOS y verificar paridad con:
	     diff <(grep -E '^\s*--mo-torneo-invierno-(primary|primary-strong|secondary|accent|navy|cream|contrast|black|gold):' plugin/.../base.css) \
	          <(grep -E ... theme/.../base.css)   # → vacío */
	--mo-torneo-invierno-primary:        #375AFC;  /* cobalto — acción/marca */
	--mo-torneo-invierno-primary-strong: #166CF9;  /* azure — hover + ancla de gradiente */
	--mo-torneo-invierno-secondary:      #5B97C9;  /* acero — secundario/bordes/labels */
	--mo-torneo-invierno-accent:         #98CEF0;  /* celeste — nav, franjas, decoración */
	--mo-torneo-invierno-navy:           #003381;  /* footer, base del hero, banners */
	--mo-torneo-invierno-cream:          #EAF7FE;  /* fondos suaves (ya on-brand) */
	--mo-torneo-invierno-contrast:       #252657;  /* índigo — texto de cuerpo, títulos */
	--mo-torneo-invierno-black:          #000000;  /* contraste extremo, sombras */
	--mo-torneo-invierno-gold:           #F2B705;  /* pop acotado: estrellas footer + campeón premiación */

	/* --- Superficie / tema (DARK por defecto; tema claro = override futuro) ---
	   El fondo oscuro de toda la app lo aplica el `body` del base.css del THEME.
	   Estos tokens los consume el CSS que pinta texto/links DIRECTO sobre el fondo
	   (NO el de las cards: ahí el texto sigue oscuro). Tema claro futuro = sobrescribir
	   el background del body + estos 3 tokens bajo una clase (ej. .theme-light). */
	--mo-torneo-invierno-on-surface:       #EAF2FF;  /* texto sobre el fondo oscuro */
	--mo-torneo-invierno-on-surface-muted: #9FB3D9;  /* texto secundario sobre el fondo */
	--mo-torneo-invierno-surface-link:     #98CEF0;  /* links sobre el fondo (= celeste) */

	/* --- Neutrals --- */
	--mo-torneo-invierno-white:       #FFFFFF;
	--mo-torneo-invierno-gray-100:    #F3F4F6;
	--mo-torneo-invierno-gray-200:    #E5E7EB;
	--mo-torneo-invierno-gray-300:    #D1D5DB;
	--mo-torneo-invierno-gray-400:    #9CA3AF;
	--mo-torneo-invierno-gray-500:    #6B7280;
	--mo-torneo-invierno-gray-600:    #4B5563;
	--mo-torneo-invierno-gray-700:    #374151;

	/* --- Semantic --- */
	--mo-torneo-invierno-success:     #059669;
	--mo-torneo-invierno-warning:     #D97706;
	--mo-torneo-invierno-error:       #DC2626;
	--mo-torneo-invierno-info:        #375AFC;

	/* --- Typography --- */
	--mo-torneo-invierno-font-body:   'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI',
	                      Roboto, Oxygen, Ubuntu, Cantarell, 'Helvetica Neue', sans-serif;
	--mo-torneo-invierno-font-mono:   'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, monospace;

	/* --- Font Sizes --- */
	--mo-torneo-invierno-text-xs:     0.75rem;
	--mo-torneo-invierno-text-sm:     0.875rem;
	--mo-torneo-invierno-text-base:   1rem;
	--mo-torneo-invierno-text-lg:     1.125rem;
	--mo-torneo-invierno-text-xl:     1.25rem;
	--mo-torneo-invierno-text-2xl:    1.5rem;
	--mo-torneo-invierno-text-3xl:    2rem;

	/* --- Spacing --- */
	--mo-torneo-invierno-space-1:     0.25rem;
	--mo-torneo-invierno-space-2:     0.5rem;
	--mo-torneo-invierno-space-3:     0.75rem;
	--mo-torneo-invierno-space-4:     1rem;
	--mo-torneo-invierno-space-5:     1.25rem;
	--mo-torneo-invierno-space-6:     1.5rem;
	--mo-torneo-invierno-space-8:     2rem;
	--mo-torneo-invierno-space-10:    2.5rem;
	--mo-torneo-invierno-space-12:    3rem;
	--mo-torneo-invierno-space-16:    4rem;

	/* --- Border Radius --- */
	--mo-torneo-invierno-radius-sm:   0.25rem;
	--mo-torneo-invierno-radius-md:   0.5rem;
	--mo-torneo-invierno-radius-lg:   0.75rem;
	--mo-torneo-invierno-radius-xl:   1rem;
	--mo-torneo-invierno-radius-full: 9999px;

	/* --- Shadows --- */
	--mo-torneo-invierno-shadow-sm:   0 1px 2px 0 rgba(0, 0, 0, 0.05);
	--mo-torneo-invierno-shadow-md:   0 4px 6px -1px rgba(0, 0, 0, 0.1),
	                      0 2px 4px -2px rgba(0, 0, 0, 0.1);
	--mo-torneo-invierno-shadow-lg:   0 10px 15px -3px rgba(0, 0, 0, 0.1),
	                      0 4px 6px -4px rgba(0, 0, 0, 0.1);

	/* --- Transitions --- */
	--mo-torneo-invierno-transition-fast:   150ms ease;
	--mo-torneo-invierno-transition-normal: 250ms ease;
	--mo-torneo-invierno-transition-slow:   350ms ease;
}


/* ==========================================================================
   2. Badges
   ========================================================================== */

.mo-torneo-invierno-badge {
	display: inline-flex;
	align-items: center;
	gap: var(--mo-torneo-invierno-space-1);
	padding: var(--mo-torneo-invierno-space-1) var(--mo-torneo-invierno-space-3);
	font-size: var(--mo-torneo-invierno-text-xs);
	font-weight: 600;
	line-height: 1.5;
	border-radius: var(--mo-torneo-invierno-radius-full);
	white-space: nowrap;
	vertical-align: middle;
}

/* --- Badge variants (soft backgrounds) --- */
.mo-torneo-invierno-badge--success {
	background-color: #ECFDF5;
	color: var(--mo-torneo-invierno-success);
}

.mo-torneo-invierno-badge--warning {
	background-color: #FFFBEB;
	color: var(--mo-torneo-invierno-warning);
}

.mo-torneo-invierno-badge--error {
	background-color: #FEF2F2;
	color: var(--mo-torneo-invierno-error);
}

.mo-torneo-invierno-badge--info {
	background-color: var(--mo-torneo-invierno-cream);
	color: var(--mo-torneo-invierno-info);
}

.mo-torneo-invierno-badge--secondary {
	background-color: var(--mo-torneo-invierno-gray-100);
	color: var(--mo-torneo-invierno-gray-700);
}

/* --- Solid badge variants --- */
.mo-torneo-invierno-badge--solid.mo-torneo-invierno-badge--success {
	background-color: var(--mo-torneo-invierno-success);
	color: var(--mo-torneo-invierno-white);
}

.mo-torneo-invierno-badge--solid.mo-torneo-invierno-badge--warning {
	background-color: var(--mo-torneo-invierno-warning);
	color: var(--mo-torneo-invierno-white);
}

.mo-torneo-invierno-badge--solid.mo-torneo-invierno-badge--error {
	background-color: var(--mo-torneo-invierno-error);
	color: var(--mo-torneo-invierno-white);
}

.mo-torneo-invierno-badge--solid.mo-torneo-invierno-badge--info {
	background-color: var(--mo-torneo-invierno-info);
	color: var(--mo-torneo-invierno-white);
}

.mo-torneo-invierno-badge--solid.mo-torneo-invierno-badge--secondary {
	background-color: var(--mo-torneo-invierno-gray-600);
	color: var(--mo-torneo-invierno-white);
}


/* ==========================================================================
   3. Cards
   ========================================================================== */

.mo-torneo-invierno-card {
	background-color: var(--mo-torneo-invierno-white);
	border: 1px solid var(--mo-torneo-invierno-gray-200);
	border-radius: var(--mo-torneo-invierno-radius-lg);
	padding: var(--mo-torneo-invierno-space-6);
	box-shadow: var(--mo-torneo-invierno-shadow-sm);
	transition: box-shadow var(--mo-torneo-invierno-transition-normal),
	            transform var(--mo-torneo-invierno-transition-normal);
}

.mo-torneo-invierno-card:hover {
	box-shadow: var(--mo-torneo-invierno-shadow-md);
}

.mo-torneo-invierno-card--elevated {
	box-shadow: var(--mo-torneo-invierno-shadow-md);
}

.mo-torneo-invierno-card--elevated:hover {
	box-shadow: var(--mo-torneo-invierno-shadow-lg);
	transform: translateY(-2px);
}

.mo-torneo-invierno-card__header {
	margin-bottom: var(--mo-torneo-invierno-space-4);
	padding-bottom: var(--mo-torneo-invierno-space-4);
	border-bottom: 1px solid var(--mo-torneo-invierno-gray-200);
}

.mo-torneo-invierno-card__title {
	font-size: var(--mo-torneo-invierno-text-xl);
	font-weight: 700;
	color: var(--mo-torneo-invierno-contrast);
	margin: 0;
}

.mo-torneo-invierno-card__body {
	color: var(--mo-torneo-invierno-gray-700);
	line-height: 1.6;
}

.mo-torneo-invierno-card__body > *:last-child {
	margin-bottom: 0;
}

.mo-torneo-invierno-card__footer {
	margin-top: var(--mo-torneo-invierno-space-4);
	padding-top: var(--mo-torneo-invierno-space-4);
	border-top: 1px solid var(--mo-torneo-invierno-gray-200);
	display: flex;
	align-items: center;
	gap: var(--mo-torneo-invierno-space-3);
}

.mo-torneo-invierno-card__image {
	margin: calc(-1 * var(--mo-torneo-invierno-space-6));
	margin-bottom: var(--mo-torneo-invierno-space-4);
	border-radius: var(--mo-torneo-invierno-radius-lg) var(--mo-torneo-invierno-radius-lg) 0 0;
	overflow: hidden;
}

.mo-torneo-invierno-card__image img {
	width: 100%;
	height: auto;
	display: block;
}


/* ==========================================================================
   4. Forms
   ========================================================================== */

.mo-torneo-invierno-form-group {
	margin-bottom: var(--mo-torneo-invierno-space-5);
}

.mo-torneo-invierno-label {
	display: block;
	margin-bottom: var(--mo-torneo-invierno-space-2);
	font-size: var(--mo-torneo-invierno-text-sm);
	font-weight: 600;
	color: var(--mo-torneo-invierno-gray-700);
}

.mo-torneo-invierno-input,
.mo-torneo-invierno-select,
.mo-torneo-invierno-textarea {
	display: block;
	width: 100%;
	padding: var(--mo-torneo-invierno-space-3) var(--mo-torneo-invierno-space-4);
	font-family: var(--mo-torneo-invierno-font-body);
	font-size: var(--mo-torneo-invierno-text-base);
	line-height: 1.5;
	color: var(--mo-torneo-invierno-contrast);
	background-color: var(--mo-torneo-invierno-white);
	border: 1px solid var(--mo-torneo-invierno-gray-300);
	border-radius: var(--mo-torneo-invierno-radius-md);
	transition: border-color var(--mo-torneo-invierno-transition-fast),
	            box-shadow var(--mo-torneo-invierno-transition-fast);
}

.mo-torneo-invierno-input:focus,
.mo-torneo-invierno-select:focus,
.mo-torneo-invierno-textarea:focus {
	border-color: var(--mo-torneo-invierno-primary);
	box-shadow: 0 0 0 3px rgba(55, 90, 252, 0.25);
	outline: none;
}

.mo-torneo-invierno-input::placeholder,
.mo-torneo-invierno-textarea::placeholder {
	color: var(--mo-torneo-invierno-gray-400);
}

.mo-torneo-invierno-input--error {
	border-color: var(--mo-torneo-invierno-error);
}

.mo-torneo-invierno-input--error:focus {
	box-shadow: 0 0 0 3px rgba(220, 38, 38, 0.15);
}

.mo-torneo-invierno-form-help {
	margin-top: var(--mo-torneo-invierno-space-1);
	font-size: var(--mo-torneo-invierno-text-xs);
	color: var(--mo-torneo-invierno-gray-500);
}

.mo-torneo-invierno-form-error {
	margin-top: var(--mo-torneo-invierno-space-1);
	font-size: var(--mo-torneo-invierno-text-xs);
	color: var(--mo-torneo-invierno-error);
}

.mo-torneo-invierno-form-actions {
	display: flex;
	flex-wrap: wrap;
	gap: var(--mo-torneo-invierno-space-3);
	margin-top: var(--mo-torneo-invierno-space-6);
}


/* ==========================================================================
   5. Buttons
   ========================================================================== */

.mo-torneo-invierno-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--mo-torneo-invierno-space-2);
	padding: var(--mo-torneo-invierno-space-3) var(--mo-torneo-invierno-space-6);
	font-family: var(--mo-torneo-invierno-font-body);
	font-size: var(--mo-torneo-invierno-text-base);
	font-weight: 600;
	line-height: 1.5;
	text-decoration: none;
	border: 2px solid transparent;
	border-radius: var(--mo-torneo-invierno-radius-md);
	cursor: pointer;
	transition: background-color var(--mo-torneo-invierno-transition-fast),
	            color var(--mo-torneo-invierno-transition-fast),
	            border-color var(--mo-torneo-invierno-transition-fast),
	            box-shadow var(--mo-torneo-invierno-transition-fast);
	white-space: nowrap;
	user-select: none;
}

.mo-torneo-invierno-btn:focus-visible {
	outline: 2px solid var(--mo-torneo-invierno-primary);
	outline-offset: 2px;
}

.mo-torneo-invierno-btn--primary {
	background-color: var(--mo-torneo-invierno-primary);
	color: var(--mo-torneo-invierno-white);
	border-color: var(--mo-torneo-invierno-primary);
}

.mo-torneo-invierno-btn--primary:hover {
	background-color: var(--mo-torneo-invierno-primary-strong);
	border-color: var(--mo-torneo-invierno-primary-strong);
	color: var(--mo-torneo-invierno-white);
}

.mo-torneo-invierno-btn--secondary {
	background-color: var(--mo-torneo-invierno-white);
	color: var(--mo-torneo-invierno-primary);
	border-color: var(--mo-torneo-invierno-primary);
}

.mo-torneo-invierno-btn--secondary:hover {
	background-color: var(--mo-torneo-invierno-cream);
	color: var(--mo-torneo-invierno-primary);
}

.mo-torneo-invierno-btn--ghost {
	background-color: transparent;
	color: var(--mo-torneo-invierno-primary);
	border-color: transparent;
}

.mo-torneo-invierno-btn--ghost:hover {
	background-color: var(--mo-torneo-invierno-cream);
}

.mo-torneo-invierno-btn--danger {
	background-color: var(--mo-torneo-invierno-error);
	color: var(--mo-torneo-invierno-white);
	border-color: var(--mo-torneo-invierno-error);
}

.mo-torneo-invierno-btn--danger:hover {
	background-color: #B91C1C;
	border-color: #B91C1C;
	color: var(--mo-torneo-invierno-white);
}

.mo-torneo-invierno-btn--sm {
	padding: var(--mo-torneo-invierno-space-2) var(--mo-torneo-invierno-space-4);
	font-size: var(--mo-torneo-invierno-text-sm);
}

.mo-torneo-invierno-btn--lg {
	padding: var(--mo-torneo-invierno-space-4) var(--mo-torneo-invierno-space-8);
	font-size: var(--mo-torneo-invierno-text-lg);
}

.mo-torneo-invierno-btn--block {
	display: flex;
	width: 100%;
}

.mo-torneo-invierno-btn:disabled,
.mo-torneo-invierno-btn--disabled {
	opacity: 0.5;
	cursor: not-allowed;
	pointer-events: none;
}

.mo-torneo-invierno-btn-group {
	display: flex;
	flex-wrap: wrap;
	gap: var(--mo-torneo-invierno-space-3);
}


/* ==========================================================================
   6. Tables
   ========================================================================== */

.mo-torneo-invierno-table {
	width: 100%;
	border-collapse: collapse;
	font-size: var(--mo-torneo-invierno-text-sm);
}

.mo-torneo-invierno-table th,
.mo-torneo-invierno-table td {
	padding: var(--mo-torneo-invierno-space-3) var(--mo-torneo-invierno-space-4);
	text-align: left;
	border-bottom: 1px solid var(--mo-torneo-invierno-gray-200);
}

.mo-torneo-invierno-table th {
	font-weight: 600;
	color: var(--mo-torneo-invierno-gray-700);
	background-color: var(--mo-torneo-invierno-gray-100);
}

.mo-torneo-invierno-table tbody tr:hover {
	background-color: var(--mo-torneo-invierno-cream);
}

.mo-torneo-invierno-table--striped tbody tr:nth-child(even) {
	background-color: var(--mo-torneo-invierno-gray-100);
}

.mo-torneo-invierno-table--bordered th,
.mo-torneo-invierno-table--bordered td {
	border: 1px solid var(--mo-torneo-invierno-gray-200);
}


/* ==========================================================================
   7. Notices / Alerts
   ========================================================================== */

.mo-torneo-invierno-notice {
	padding: var(--mo-torneo-invierno-space-4) var(--mo-torneo-invierno-space-5);
	border-radius: var(--mo-torneo-invierno-radius-md);
	border-left: 4px solid transparent;
	margin-bottom: var(--mo-torneo-invierno-space-4);
	font-size: var(--mo-torneo-invierno-text-sm);
	line-height: 1.6;
}

.mo-torneo-invierno-notice > *:last-child {
	margin-bottom: 0;
}

.mo-torneo-invierno-notice--info {
	background-color: var(--mo-torneo-invierno-cream);
	border-left-color: var(--mo-torneo-invierno-info);
	color: var(--mo-torneo-invierno-contrast);
}

.mo-torneo-invierno-notice--success {
	background-color: #ECFDF5;
	border-left-color: var(--mo-torneo-invierno-success);
	color: #065F46;
}

.mo-torneo-invierno-notice--warning {
	background-color: #FFFBEB;
	border-left-color: var(--mo-torneo-invierno-warning);
	color: #92400E;
}

.mo-torneo-invierno-notice--error {
	background-color: #FEF2F2;
	border-left-color: var(--mo-torneo-invierno-error);
	color: #991B1B;
}


/* ==========================================================================
   8. Toast Notification
   ========================================================================== */

.mo-torneo-invierno-toast {
	position: fixed;
	top: var(--mo-torneo-invierno-space-6);
	right: var(--mo-torneo-invierno-space-6);
	z-index: 99999;
	min-width: 280px;
	max-width: 420px;
	padding: var(--mo-torneo-invierno-space-4) var(--mo-torneo-invierno-space-5);
	border-radius: var(--mo-torneo-invierno-radius-md);
	box-shadow: var(--mo-torneo-invierno-shadow-lg);
	font-size: var(--mo-torneo-invierno-text-sm);
	font-weight: 500;
	line-height: 1.5;
	color: var(--mo-torneo-invierno-white);
	background-color: var(--mo-torneo-invierno-contrast);
	opacity: 0;
	transform: translateY(-12px);
	transition: opacity var(--mo-torneo-invierno-transition-normal),
	            transform var(--mo-torneo-invierno-transition-normal);
	pointer-events: none;
}

.mo-torneo-invierno-toast.is-visible {
	opacity: 1;
	transform: translateY(0);
	pointer-events: auto;
}

.mo-torneo-invierno-toast--success {
	background-color: var(--mo-torneo-invierno-success);
}

.mo-torneo-invierno-toast--warning {
	background-color: var(--mo-torneo-invierno-warning);
}

.mo-torneo-invierno-toast--error {
	background-color: var(--mo-torneo-invierno-error);
}

.mo-torneo-invierno-toast--info {
	background-color: var(--mo-torneo-invierno-info);
}


/* ==========================================================================
   9. Loading Spinner
   ========================================================================== */

.mo-torneo-invierno-spinner {
	display: inline-block;
	width: 1.5rem;
	height: 1.5rem;
	border: 2px solid var(--mo-torneo-invierno-gray-200);
	border-top-color: var(--mo-torneo-invierno-primary);
	border-radius: 50%;
	animation: mo-torneo-invierno-spin 0.6s linear infinite;
}

.mo-torneo-invierno-spinner--sm {
	width: 1rem;
	height: 1rem;
}

.mo-torneo-invierno-spinner--lg {
	width: 2.5rem;
	height: 2.5rem;
	border-width: 3px;
}

@keyframes mo-torneo-invierno-spin {
	to { transform: rotate(360deg); }
}


/* ==========================================================================
   10. Pagination
   ========================================================================== */

.mo-torneo-invierno-pagination {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: var(--mo-torneo-invierno-space-2);
	margin-top: var(--mo-torneo-invierno-space-8);
	font-size: var(--mo-torneo-invierno-text-sm);
}

.mo-torneo-invierno-pagination a,
.mo-torneo-invierno-pagination span {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 2.25rem;
	height: 2.25rem;
	padding: 0 var(--mo-torneo-invierno-space-2);
	border-radius: var(--mo-torneo-invierno-radius-md);
	text-decoration: none;
	font-weight: 500;
	transition: background-color var(--mo-torneo-invierno-transition-fast),
	            color var(--mo-torneo-invierno-transition-fast);
}

.mo-torneo-invierno-pagination a {
	color: var(--mo-torneo-invierno-gray-700);
}

.mo-torneo-invierno-pagination a:hover {
	background-color: var(--mo-torneo-invierno-cream);
	color: var(--mo-torneo-invierno-primary);
}

.mo-torneo-invierno-pagination .current {
	background-color: var(--mo-torneo-invierno-primary);
	color: var(--mo-torneo-invierno-white);
}


/* ==========================================================================
   11. Empty State
   ========================================================================== */

.mo-torneo-invierno-empty {
	text-align: center;
	padding: var(--mo-torneo-invierno-space-16) var(--mo-torneo-invierno-space-6);
	color: var(--mo-torneo-invierno-gray-500);
}

.mo-torneo-invierno-empty__icon {
	font-size: 3rem;
	margin-bottom: var(--mo-torneo-invierno-space-4);
	opacity: 0.5;
}

.mo-torneo-invierno-empty__title {
	font-size: var(--mo-torneo-invierno-text-xl);
	font-weight: 600;
	color: var(--mo-torneo-invierno-gray-700);
	margin: 0 0 var(--mo-torneo-invierno-space-2);
}

.mo-torneo-invierno-empty__text {
	font-size: var(--mo-torneo-invierno-text-base);
	margin: 0;
}


/* ==========================================================================
   12. 404 Not Found
   ========================================================================== */

.mo-torneo-invierno-not-found {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
	min-height: 60vh;
	padding: var(--mo-torneo-invierno-space-16) var(--mo-torneo-invierno-space-6);
}

.mo-torneo-invierno-not-found__code {
	font-size: 6rem;
	font-weight: 800;
	line-height: 1;
	color: var(--mo-torneo-invierno-gray-200);
	margin-bottom: var(--mo-torneo-invierno-space-4);
}

.mo-torneo-invierno-not-found__title {
	font-size: var(--mo-torneo-invierno-text-2xl);
	font-weight: 700;
	color: var(--mo-torneo-invierno-contrast);
	margin: 0 0 var(--mo-torneo-invierno-space-3);
}

.mo-torneo-invierno-not-found__text {
	font-size: var(--mo-torneo-invierno-text-base);
	color: var(--mo-torneo-invierno-gray-500);
	margin: 0 0 var(--mo-torneo-invierno-space-8);
}


/* ==========================================================================
   13. Utilities
   ========================================================================== */

/* Screen reader only */
.mo-torneo-invierno-sr-only {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border-width: 0;
}

/* Text alignment */
.mo-torneo-invierno-text-center  { text-align: center; }
.mo-torneo-invierno-text-left    { text-align: left; }
.mo-torneo-invierno-text-right   { text-align: right; }

/* Text color */
.mo-torneo-invierno-text-primary   { color: var(--mo-torneo-invierno-primary); }
.mo-torneo-invierno-text-secondary { color: var(--mo-torneo-invierno-secondary); }
.mo-torneo-invierno-text-muted     { color: var(--mo-torneo-invierno-gray-500); }
.mo-torneo-invierno-text-contrast  { color: var(--mo-torneo-invierno-contrast); }

/* Background */
.mo-torneo-invierno-bg-primary   { background-color: var(--mo-torneo-invierno-primary); }
.mo-torneo-invierno-bg-cream     { background-color: var(--mo-torneo-invierno-cream); }
.mo-torneo-invierno-bg-contrast  { background-color: var(--mo-torneo-invierno-contrast); }

/* Spacing helpers */
.mo-torneo-invierno-mt-0  { margin-top: 0; }
.mo-torneo-invierno-mt-4  { margin-top: var(--mo-torneo-invierno-space-4); }
.mo-torneo-invierno-mt-6  { margin-top: var(--mo-torneo-invierno-space-6); }
.mo-torneo-invierno-mt-8  { margin-top: var(--mo-torneo-invierno-space-8); }
.mo-torneo-invierno-mb-0  { margin-bottom: 0; }
.mo-torneo-invierno-mb-4  { margin-bottom: var(--mo-torneo-invierno-space-4); }
.mo-torneo-invierno-mb-6  { margin-bottom: var(--mo-torneo-invierno-space-6); }
.mo-torneo-invierno-mb-8  { margin-bottom: var(--mo-torneo-invierno-space-8); }

/* Flex helpers */
.mo-torneo-invierno-flex        { display: flex; }
.mo-torneo-invierno-flex-wrap   { flex-wrap: wrap; }
.mo-torneo-invierno-flex-center { align-items: center; justify-content: center; }
.mo-torneo-invierno-gap-2       { gap: var(--mo-torneo-invierno-space-2); }
.mo-torneo-invierno-gap-4       { gap: var(--mo-torneo-invierno-space-4); }
.mo-torneo-invierno-gap-6       { gap: var(--mo-torneo-invierno-space-6); }

/* Display */
.mo-torneo-invierno-hidden { display: none !important; }

/* Divider */
.mo-torneo-invierno-divider {
	border: none;
	border-top: 1px solid var(--mo-torneo-invierno-gray-200);
	margin: var(--mo-torneo-invierno-space-6) 0;
}


/* ==========================================================================
   14. Responsive
   ========================================================================== */

@media (max-width: 768px) {
	:root {
		--mo-torneo-invierno-text-3xl: 1.75rem;
		--mo-torneo-invierno-text-2xl: 1.25rem;
	}

	.mo-torneo-invierno-card {
		padding: var(--mo-torneo-invierno-space-4);
	}

	.mo-torneo-invierno-card__image {
		margin: calc(-1 * var(--mo-torneo-invierno-space-4));
		margin-bottom: var(--mo-torneo-invierno-space-3);
	}

	.mo-torneo-invierno-btn--block-mobile {
		display: flex;
		width: 100%;
	}

	.mo-torneo-invierno-form-actions {
		flex-direction: column;
	}

	.mo-torneo-invierno-form-actions .mo-torneo-invierno-btn {
		width: 100%;
	}

	.mo-torneo-invierno-table {
		font-size: var(--mo-torneo-invierno-text-xs);
	}

	.mo-torneo-invierno-table th,
	.mo-torneo-invierno-table td {
		padding: var(--mo-torneo-invierno-space-2) var(--mo-torneo-invierno-space-3);
	}

	.mo-torneo-invierno-toast {
		left: var(--mo-torneo-invierno-space-4);
		right: var(--mo-torneo-invierno-space-4);
		min-width: 0;
		max-width: none;
	}

	.mo-torneo-invierno-pagination {
		flex-wrap: wrap;
	}
}

@media (max-width: 480px) {
	.mo-torneo-invierno-btn-group {
		flex-direction: column;
	}

	.mo-torneo-invierno-btn-group .mo-torneo-invierno-btn {
		width: 100%;
	}
}


/* ==========================================================================
   15. Reduced Motion
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
	}

	.mo-torneo-invierno-toast {
		transition: none;
	}

	.mo-torneo-invierno-card--elevated:hover {
		transform: none;
	}
}