/**
 * "Solicitar pago", la única pantalla de los sheepers que es nuestra.
 *
 * El panel del sheeper lo dibuja Ultimate Affiliate Pro con su propia hoja, y
 * se ve bien dentro de Urna: no se toca. Lo que sale sin estilo ninguno es el
 * contenido de nuestra pestaña, que es HTML pelado dentro de la caja del
 * plugin — el saldo con el mismo tamaño que el resto y el botón gris del tema.
 *
 * Los colores son los de la tienda, los mismos que lana.css: no se inventa
 * una paleta nueva para una pantalla.
 */

:root {
	--sb-sheepers-azul: #0b1f4b;
	--sb-sheepers-amarillo: #ffd200;
	--sb-sheepers-gris: #f4f6f9;
	--sb-sheepers-borde: #e3e8ef;
}

.sb-sheepers-pago {
	max-width: 42rem;
}

/* El número es lo que viene a ver: que no compita con el párrafo. */
.sb-sheepers-pago .sb-sheepers-saldo {
	font-size: 1.15rem;
	line-height: 1.5;
	margin-bottom: 0.1rem;
}

.sb-sheepers-pago .sb-sheepers-cifra {
	font-size: 2.4rem;
	line-height: 1.1;
	font-weight: 700;
	color: var(--sb-sheepers-azul);
	margin: 0 0 1rem;
}

.sb-sheepers-pago .sb-sheepers-espera,
.sb-sheepers-pago .sb-sheepers-aviso {
	font-size: 0.9rem;
	opacity: 0.8;
}

.sb-sheepers-pago .sb-sheepers-falta strong,
.sb-sheepers-pago .sb-sheepers-pedida strong {
	color: var(--sb-sheepers-azul);
}

/*
 * Los datos de cobro van en <pre> a propósito: un número de cuenta se lee de
 * un vistazo si no se reflowea. Pero el <pre> del tema no ajusta línea y en el
 * teléfono se salía de la pantalla, así que aquí sí se deja partir.
 */
.sb-sheepers-pago .sb-sheepers-datos {
	background: var(--sb-sheepers-gris);
	border: 1px solid var(--sb-sheepers-borde);
	border-radius: 6px;
	padding: 0.9rem 1rem;
	margin: 0 0 1rem;
	font-size: 0.95rem;
	line-height: 1.6;
	white-space: pre-wrap;
	word-break: break-word;
	overflow-x: auto;
}

/*
 * El botón del tema sale gris; este es el amarillo de la marca.
 *
 * Con !important, y no por pereza: la clase `.button` la pintan a la vez el
 * tema y la hoja del plugin de afiliados, y gana la que se cargue más tarde
 * según la página. Sin forzarlo, el botón salía amarillo en una pantalla y
 * gris en otra, que es peor que gris siempre.
 */
.sb-sheepers-pago .sb-sheepers-boton,
.sb-sheepers-pago .sb-sheepers-boton:hover,
.sb-sheepers-pago .sb-sheepers-boton:focus {
	background: var(--sb-sheepers-amarillo) !important;
	border: 0 !important;
	color: var(--sb-sheepers-azul) !important;
	font-weight: 700;
	padding: 0.85rem 1.6rem;
	border-radius: 4px;
}

.sb-sheepers-pago .sb-sheepers-boton:hover {
	filter: brightness(0.94);
}

/* Ya pidió: un recuadro tranquilo, no una alerta. */
.sb-sheepers-pago .sb-sheepers-pedida {
	background: var(--sb-sheepers-gris);
	border-left: 4px solid var(--sb-sheepers-amarillo);
	padding: 1rem 1.1rem;
	border-radius: 0 6px 6px 0;
}

@media (max-width: 782px) {
	.sb-sheepers-pago .sb-sheepers-cifra {
		font-size: 2rem;
	}

	/* En el teléfono, un botón que no ocupa el ancho se pulsa mal. */
	.sb-sheepers-pago .sb-sheepers-boton {
		width: 100%;
	}
}

/* =========================================================================
   La página "Sé un sheeper"
   =========================================================================
   Es la única página de venta del programa: quien llega aquí no sabe lo que
   es un sheeper y decide en diez segundos. Por eso el orden es promesa,
   tres razones, cuánto se gana, y el formulario al final con su ancla.
   ========================================================================= */

.sb-sheepers-portada {
	max-width: 62rem;
	margin: 0 auto;
}

/* --- la promesa ------------------------------------------------------- */

.sb-sheepers-hero {
	background: var(--sb-sheepers-azul);
	color: #fff;
	border-radius: 10px;
	padding: 2.6rem 2rem;
	text-align: center;
	margin-bottom: 2rem;
}

.sb-sheepers-hero__titulo {
	color: var(--sb-sheepers-amarillo);
	margin: 0 0 0.9rem;
	font-size: 2.1rem;
	line-height: 1.2;
}

.sb-sheepers-hero__texto {
	margin: 0 auto 1.6rem;
	max-width: 36rem;
	font-size: 1.05rem;
	line-height: 1.6;
	color: #e8edf6;
}

.sb-sheepers-hero__texto strong {
	color: #fff;
}

/* El botón repetido abajo es el mismo: una sola pinta para "apuntarse". */
.sb-sheepers-cta,
.sb-sheepers-cta:hover,
.sb-sheepers-cta:focus {
	display: inline-block;
	background: var(--sb-sheepers-amarillo);
	color: var(--sb-sheepers-azul);
	font-weight: 700;
	font-size: 1.05rem;
	padding: 0.9rem 2.2rem;
	border-radius: 999px;
	text-decoration: none;
}

.sb-sheepers-cta:hover {
	filter: brightness(0.94);
}

/* --- tres razones ----------------------------------------------------- */

.sb-sheepers-ventajas {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1rem;
	margin-bottom: 2.4rem;
}

.sb-sheepers-ventaja {
	background: var(--sb-sheepers-gris);
	border: 1px solid var(--sb-sheepers-borde);
	border-radius: 8px;
	padding: 1.4rem 1.2rem;
	text-align: center;
}

.sb-sheepers-ventaja__icono {
	font-size: 1.8rem;
	line-height: 1;
	display: block;
	margin-bottom: 0.6rem;
}

.sb-sheepers-ventaja h3 {
	font-size: 1.05rem;
	margin: 0 0 0.4rem;
	color: var(--sb-sheepers-azul);
}

.sb-sheepers-ventaja p {
	margin: 0;
	font-size: 0.92rem;
	line-height: 1.5;
}

/* --- la escalera de porcentajes --------------------------------------- */

.sb-sheepers-niveles__titulo {
	text-align: center;
	color: var(--sb-sheepers-azul);
	margin: 0 0 0.3rem;
}

.sb-sheepers-niveles__intro {
	text-align: center;
	margin: 0 0 1.4rem;
}

.sb-sheepers-escalera {
	list-style: none;
	margin: 0 0 1.2rem;
	padding: 0;
}

/*
 * Cada escalón se va metiendo hacia dentro: la idea de "un nivel más abajo"
 * se entiende antes mirándola que leyéndola.
 */
.sb-sheepers-escalon {
	display: flex;
	align-items: center;
	gap: 1rem;
	background: #fff;
	border: 1px solid var(--sb-sheepers-borde);
	border-left: 6px solid var(--sb-sheepers-amarillo);
	border-radius: 6px;
	padding: 0.85rem 1.1rem;
	margin-bottom: 0.5rem;
}

.sb-sheepers-escalon--2 { margin-left: 1.5rem; border-left-color: #ffdf4d; }
.sb-sheepers-escalon--3 { margin-left: 3rem;   border-left-color: #ffe980; }
.sb-sheepers-escalon--4 { margin-left: 4.5rem; border-left-color: #fff2b3; }

.sb-sheepers-escalon__pct {
	font-size: 1.6rem;
	font-weight: 700;
	color: var(--sb-sheepers-azul);
	min-width: 4.2rem;
}

.sb-sheepers-escalon__txt {
	line-height: 1.45;
}

.sb-sheepers-ejemplo {
	background: var(--sb-sheepers-gris);
	border-radius: 6px;
	padding: 1rem 1.1rem;
	margin-bottom: 1.2rem;
	line-height: 1.6;
}

.sb-sheepers-lider {
	display: flex;
	align-items: center;
	gap: 1.1rem;
	background: var(--sb-sheepers-azul);
	color: #fff;
	border-radius: 8px;
	padding: 1.2rem 1.3rem;
	margin-bottom: 2rem;
}

.sb-sheepers-lider__sello {
	background: var(--sb-sheepers-amarillo);
	color: var(--sb-sheepers-azul);
	font-weight: 700;
	font-size: 1.3rem;
	border-radius: 999px;
	padding: 0.7rem 1rem;
	white-space: nowrap;
}

.sb-sheepers-lider p {
	margin: 0;
	line-height: 1.55;
}

/* --- la letra chica, que no se esconde -------------------------------- */

.sb-sheepers-letra-chica {
	font-size: 0.88rem;
	line-height: 1.6;
	opacity: 0.85;
	margin-bottom: 2rem;
}

.sb-sheepers-letra-chica p {
	margin: 0 0 0.4rem;
}

/* --- el formulario ----------------------------------------------------- */

.sb-sheepers-formulario {
	background: var(--sb-sheepers-gris);
	border: 1px solid var(--sb-sheepers-borde);
	border-radius: 10px;
	padding: 1.8rem 1.6rem 2rem;
}

.sb-sheepers-formulario h3 {
	text-align: center;
	color: var(--sb-sheepers-azul);
	margin: 0 0 1.2rem;
}

/*
 * El boton del formulario, con la misma pinta que el de arriba.
 *
 * Va por el `id` a proposito. El plugin trae lo suyo con `!important` y un
 * selector mas largo:
 *
 *   ultimate-affiliate-pro/assets/css/templates.min.css
 *     .uap-register-14 .uap-submit-form input[type="submit"] { color:#fff !important }
 *
 * Con `!important` en los dos lados gana el que pese mas, y ese pesaba mas
 * que `.sb-sheepers-formulario .uap-form-element-submit`. Resultado: letra
 * BLANCA sobre el amarillo de la marca, 1,45:1, el boton "Unete gratis" sin
 * texto legible desde que existe la pagina. Un `id` pesa mas que cualquier
 * cantidad de clases, asi que esto lo zanja. No se usa `.uap-register-14`
 * porque ese numero es la plantilla elegida y cambia si el cliente la cambia.
 */
.sb-sheepers-formulario input#uap_submit_bttn,
.sb-sheepers-formulario input#uap_submit_bttn:hover,
.sb-sheepers-formulario input#uap_submit_bttn:focus,
.sb-sheepers-formulario .uap-form-element-submit,
.sb-sheepers-formulario .uap-form-element-submit:hover,
.sb-sheepers-formulario .uap-form-element-submit:focus {
	background: var(--sb-sheepers-amarillo) !important;
	border: 0 !important;
	color: var(--sb-sheepers-azul) !important;
	font-weight: 700 !important;
	border-radius: 999px !important;
	padding: 0.85rem 2rem !important;
}

/*
 * El boton "Se un sheeper" que el plugin ensena en el panel a quien todavia
 * no lo es. Viene blanco sobre su rosa #f16186: 3,09:1. Un sheeper aprobado
 * no lo ve nunca -- por eso tardo en aparecer --, pero si lo ve cualquier
 * cliente con cuenta que entre a esa pagina. El rosa un paso mas oscuro da
 * 5,19:1 y sigue siendo el mismo boton.
 */
.uap-become-affiliate-bttn,
.uap-become-affiliate-bttn:hover,
.uap-become-affiliate-bttn:focus {
	background: #c92f5c !important;
	color: #fff !important;
}

/*
 * El boton "Entrar" que el plugin pone al lado de "Unete gratis", para quien
 * ya es sheeper. Venia con letra gris #666 sobre su azul claro #3ba1da:
 * 1,99:1, otro boton que no se lee. Viene asi del plugin, no lo rompimos
 * nosotros.
 *
 * Se oscurece el azul a #17699a y la letra va en blanco: 5,96:1. Se oscurece
 * el fondo en vez de poner la letra negra para que siga leyendose como un
 * boton secundario al lado del amarillo, y no como un aviso.
 */
.sb-sheepers-formulario .uap-login-link {
	background: #17699a !important;
}

.sb-sheepers-formulario .uap-login-link a,
.sb-sheepers-formulario .uap-login-link a:hover,
.sb-sheepers-formulario .uap-login-link a:focus {
	color: #fff !important;
}

/* =========================================================================
   Dentro del panel: las dos cifras y el enlace
   ========================================================================= */

.sb-sheepers-cifras {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 1rem;
	margin: 0 0 1.6rem;
}

.sb-sheepers-tarjeta {
	border-radius: 10px;
	padding: 1.3rem 1.3rem 1.1rem;
	display: flex;
	flex-direction: column;
	gap: 0.25rem;
}

.sb-sheepers-tarjeta--puedes {
	background: var(--sb-sheepers-azul);
	color: #fff;
}

.sb-sheepers-tarjeta--espera {
	background: var(--sb-sheepers-gris);
	border: 1px solid var(--sb-sheepers-borde);
	color: var(--sb-sheepers-azul);
}

.sb-sheepers-tarjeta__rotulo {
	font-size: 0.9rem;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	opacity: 0.85;
}

.sb-sheepers-tarjeta__cifra {
	font-size: 2.3rem;
	font-weight: 700;
	line-height: 1.1;
}

.sb-sheepers-tarjeta--puedes .sb-sheepers-tarjeta__cifra {
	color: var(--sb-sheepers-amarillo);
}

.sb-sheepers-tarjeta__pie {
	font-size: 0.86rem;
	line-height: 1.45;
	opacity: 0.9;
}

/*
 * Fuera el bloque "Tracking details" del plugin, que repite el enlace.
 *
 * Esa caja (templates/public/account_page-generate_links.php:22-50) enseña
 * otra vez el enlace de la tienda, suelto y sin boton de copiar. Con las dos
 * cajas nuevas delante, el sheeper se encuentra con TRES enlaces en la misma
 * pantalla y uno de ellos repetido: justo la confusion que el cliente pidio
 * evitar el 27/10/2026. El codigo de seguimiento que lleva dentro es el
 * nombre de usuario, que ya sale en la cabecera del panel.
 *
 * Se esconde, no se borra: la plantilla es del plugin y no se toca (regla 1).
 * El selector cuelga de una clase de esa caja concreta, no de "la primera
 * caja de la pestaña", para que un cambio de orden del plugin no deje
 * escondida otra cosa.
 */
.uap-ap-wrap .uap-profile-box-wrapper:has(.uap-account-affiliatelinks-tab1) {
	display: none;
}

/* --- los dos enlaces --------------------------------------------------- */

/*
 * Desde el 27/10/2026 son dos: uno para invitar sheepers y otro para vender.
 * Cada uno va en su propia caja con borde, porque confundirlos es justo el
 * error que hay que evitar: el de invitar lleva a apuntarse, el de vender a
 * la tienda. En el telefono van uno debajo del otro, que es como se leen.
 */
.sb-sheepers-enlaces {
	display: grid;
	gap: 1.2rem;
}

@media (min-width: 992px) {
	.sb-sheepers-enlaces {
		grid-template-columns: 1fr 1fr;
	}
}

.sb-sheepers-enlace {
	margin: 0;
	padding: 1.1rem 1.2rem 1.2rem;
	border: 1px solid #e3e3e3;
	border-left: 6px solid var(--sb-sheepers-amarillo);
	border-radius: 10px;
	background: #fff;
}

/* El de invitar se marca en azul, para que no se mezclen de un vistazo. */
.sb-sheepers-enlace--invitar {
	border-left-color: var(--sb-sheepers-azul);
}

.sb-sheepers-enlace__titulo {
	margin: 0 0 0.4rem;
	font-size: 1.08rem;
	font-weight: 700;
}

.sb-sheepers-enlace__intro {
	margin: 0 0 0.6rem;
}

.sb-sheepers-enlace__caja {
	display: flex;
	gap: 0.5rem;
	margin-bottom: 0.9rem;
}

.sb-sheepers-enlace__campo {
	flex: 1 1 auto;
	min-width: 0;
	border: 1px solid var(--sb-sheepers-borde);
	border-radius: 6px;
	padding: 0.7rem 0.8rem;
	font-size: 0.95rem;
	background: #fff;
}

.sb-sheepers-enlace__copiar,
.sb-sheepers-enlace__copiar:hover,
.sb-sheepers-enlace__copiar:focus {
	background: var(--sb-sheepers-azul) !important;
	color: #fff !important;
	border: 0 !important;
	border-radius: 6px;
	padding: 0.7rem 1.3rem;
	font-weight: 700;
	cursor: pointer;
	white-space: nowrap;
}

.sb-sheepers-enlace__copiar--ok,
.sb-sheepers-enlace__copiar--ok:hover {
	background: #1e8e3e !important;
}

.sb-sheepers-enlace__compartir {
	display: flex;
	gap: 0.6rem;
	flex-wrap: wrap;
	margin-bottom: 0.8rem;
}

/*
 * El `!important` del color no es pereza, es necesario, y tiene historia.
 *
 * Estos botones llevan su propio fondo de color. Sin `!important`, el color
 * de la letra se lo decide la ultima regla de enlaces que gane, y han ganado
 * dos distintas: el tema los pintaba del amarillo de la marca sobre el verde
 * de WhatsApp (1,47:1, ilegible desde siempre), y el 27/10/2026 nuestro
 * propio enlaces.css los pinto de azul sobre el azul de Facebook (1,71:1).
 *
 * El color de la letra de un boton con fondo fijo no es negociable: se clava
 * aqui, al lado del fondo que lo justifica, y asi ninguna regla de enlaces
 * -- ni de hoy ni de dentro de un ano -- vuelve a borrarle el texto.
 */
.sb-sheepers-compartir,
.sb-sheepers-compartir:hover,
.sb-sheepers-compartir:focus {
	display: inline-block;
	color: #fff !important;
	text-decoration: none;
	border-radius: 6px;
	padding: 0.6rem 1.1rem;
	font-weight: 600;
	font-size: 0.93rem;
}

/*
 * Los verdes y azules de marca, UN PASO MAS OSCUROS. Los oficiales son
 * #25d366 y #1877f2, y con letra blanca encima dan 1,98:1 y 4,23:1: ninguno
 * llega al 4,5:1 que pide la norma. Estos dan 5,44:1 y 5,65:1 y se siguen
 * reconociendo de lejos como "el de WhatsApp" y "el de Facebook".
 */
.sb-sheepers-compartir--wa { background: #0f7a36; }
.sb-sheepers-compartir--fb { background: #1465c7; }
.sb-sheepers-compartir:hover { filter: brightness(0.93); }

.sb-sheepers-enlace__nota {
	font-size: 0.88rem;
	line-height: 1.55;
	opacity: 0.85;
	margin: 0;
}

/* --- el aviso de "tu solicitud está en revisión" ----------------------- */

.sb-sheepers-espera {
	background: #fff6d6;
	border: 1px solid var(--sb-sheepers-amarillo);
	border-left: 6px solid var(--sb-sheepers-amarillo);
	border-radius: 6px;
	padding: 1rem 1.2rem;
	margin: 0 0 1.6rem;
	line-height: 1.55;
}

/* --- el aviso de borrador de las condiciones --------------------------- */
/*
 * Ya no se usa: el 26/10/2026 el contador del cliente aprobó las condiciones
 * y el recuadro se quitó de la página (scripts/sheepers-condiciones.php). Se
 * deja el estilo porque vuelve a hacer falta en cuanto haya otro texto sin
 * revisar, y porque son ocho líneas.
 */

.sb-sheepers-borrador {
	background: #fff6d6;
	border: 1px solid var(--sb-sheepers-amarillo);
	border-left: 6px solid var(--sb-sheepers-amarillo);
	border-radius: 6px;
	padding: 1rem 1.2rem;
	margin: 0 0 1.6rem;
	line-height: 1.55;
}

/* =========================================================================
   Teléfono
   ========================================================================= */

@media (max-width: 782px) {
	.sb-sheepers-hero {
		padding: 2rem 1.2rem;
	}

	.sb-sheepers-hero__titulo {
		font-size: 1.6rem;
	}

	.sb-sheepers-ventajas,
	.sb-sheepers-cifras {
		grid-template-columns: 1fr;
	}

	/*
	 * La sangría de los escalones se quita: a 390 px se come el ancho y el
	 * texto queda en una columna de tres palabras. El color del borde sigue
	 * contando la misma historia.
	 */
	.sb-sheepers-escalon--2,
	.sb-sheepers-escalon--3,
	.sb-sheepers-escalon--4 {
		margin-left: 0;
	}

	.sb-sheepers-escalon {
		gap: 0.7rem;
		padding: 0.75rem 0.9rem;
	}

	.sb-sheepers-escalon__pct {
		font-size: 1.35rem;
		min-width: 3.4rem;
	}

	.sb-sheepers-lider {
		flex-direction: column;
		text-align: center;
		gap: 0.8rem;
	}

	/* El enlace y su botón, uno encima del otro: en línea no caben. */
	.sb-sheepers-enlace__caja {
		flex-direction: column;
	}

	.sb-sheepers-enlace__copiar {
		width: 100%;
	}

	.sb-sheepers-compartir {
		flex: 1 1 100%;
		text-align: center;
	}

	.sb-sheepers-cta {
		display: block;
	}
}

/* =========================================================================
   El ranking de sheepers del mes
   =========================================================================
   Sin importes y sin correos, a propósito: sale en una página pública. Lo
   que motiva es el puesto, no cuánto gana el de arriba.
   ========================================================================= */

.sb-sheepers-ranking {
	margin: 0 0 1.8rem;
}

.sb-sheepers-ranking__titulo {
	color: var(--sb-sheepers-azul);
	margin: 0 0 0.2rem;
}

.sb-sheepers-ranking__mes {
	margin: 0 0 1rem;
	font-size: 0.92rem;
	opacity: 0.85;
}

.sb-sheepers-ranking__vacio {
	background: var(--sb-sheepers-gris);
	border: 1px dashed var(--sb-sheepers-borde);
	border-radius: 8px;
	padding: 1.1rem 1.2rem;
	margin: 0;
	text-align: center;
}

.sb-sheepers-ranking__lista {
	list-style: none;
	margin: 0;
	padding: 0;
	counter-reset: none;
}

.sb-sheepers-ranking__fila {
	display: flex;
	align-items: center;
	gap: 0.9rem;
	background: #fff;
	border: 1px solid var(--sb-sheepers-borde);
	border-radius: 6px;
	padding: 0.65rem 0.9rem;
	margin-bottom: 0.4rem;
}

/* Los tres primeros, con el amarillo de la casa y en degradado. */
.sb-sheepers-ranking__fila:nth-child(1) .sb-sheepers-ranking__puesto { background: var(--sb-sheepers-amarillo); }
.sb-sheepers-ranking__fila:nth-child(2) .sb-sheepers-ranking__puesto { background: #ffe066; }
.sb-sheepers-ranking__fila:nth-child(3) .sb-sheepers-ranking__puesto { background: #ffeeaa; }

.sb-sheepers-ranking__puesto {
	flex: 0 0 auto;
	width: 2rem;
	height: 2rem;
	line-height: 2rem;
	text-align: center;
	border-radius: 999px;
	background: var(--sb-sheepers-gris);
	color: var(--sb-sheepers-azul);
	font-weight: 700;
}

.sb-sheepers-ranking__nombre {
	flex: 1 1 auto;
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.sb-sheepers-ranking__ventas {
	flex: 0 0 auto;
	font-weight: 700;
	color: var(--sb-sheepers-azul);
	font-size: 0.95rem;
}

/* El que está mirando, marcado: encontrarse en la lista es medio incentivo. */
.sb-sheepers-ranking__fila--yo {
	border-color: var(--sb-sheepers-azul);
	box-shadow: inset 4px 0 0 var(--sb-sheepers-azul);
}

.sb-sheepers-ranking-bloque {
	margin-bottom: 2rem;
}

@media (max-width: 782px) {
	.sb-sheepers-ranking__fila {
		gap: 0.6rem;
		padding: 0.6rem 0.7rem;
	}

	.sb-sheepers-ranking__ventas {
		font-size: 0.86rem;
	}
}

/*
 * La tarjeta "saldo disponible" del plugin, fuera.
 *
 * No es capricho de diseño: ESA CIFRA MIENTE. El plugin suma todo lo
 * verificado y sin pagar, sin mirar los 7 días de gracia, así que enseña más
 * de lo que el sheeper puede pedir de verdad. Al lado está la nuestra, que sí
 * los descuenta. Dos números distintos para lo mismo, en la misma pantalla,
 * es una pregunta al dueño cada semana.
 *
 * Se oculta la tarjeta, no el dato: el total ganado sigue arriba, en la
 * cabecera del panel.
 */
.uap-account-overview-tab6 {
	display: none !important;
}

/* ===========================================================================
   Los errores del formulario de apuntarse (27/10/2026)
   ===========================================================================
   El plugin recoge los errores y no los pinta en la parte publica -- solo los
   pinta en el escritorio --, asi que el alta fallaba en silencio. Los imprime
   sheepbuster-core/includes/sheepers-registro.php y se visten aqui. */

.sb-registro-errores {
	margin: 0 0 20px;
	padding: 14px 18px;
	border: 1px solid #f6c9c8;
	border-left: 4px solid var(--sb-rojo, #d12d2a);
	border-radius: 8px;
	background: #fdeceb;
	color: #a8302e;
}

.sb-registro-errores__titulo {
	margin: 0 0 6px;
	font-weight: 700;
	font-size: 15px;
}

.sb-registro-errores ul {
	margin: 0;
	padding-left: 20px;
}

.sb-registro-errores li {
	margin: 2px 0;
	font-size: 14px;
	line-height: 1.5;
}

/* ===========================================================================
   "Mi red": esconder las columnas que van vacias a proposito (27/10/2026)
   ===========================================================================
   El plugin le enseña al sheeper el CORREO y el DINERO de cada persona de su
   red (templates/public/account_page-mlm.php:77 y :79). Eso lo vacia
   sheepbuster-core/includes/sheepers-red.php con el filtro que el propio
   plugin ofrece, pero la plantilla sigue pintando las celdas: quedarian dos
   columnas en blanco con su titulo, que parece que algo se rompio.

   La plantilla no se toca (regla 1), asi que se esconden aqui. Son la 2 (el
   correo) y la 4 (el importe) de esa tabla y solo de esa. */

.uap-ap-wrap .uap-account-table th:nth-child(2),
.uap-ap-wrap .uap-account-table td:nth-child(2),
.uap-ap-wrap .uap-account-table th:nth-child(4),
.uap-ap-wrap .uap-account-table td:nth-child(4) {
	display: none;
}

/* En el celular, la tabla de "Mi red" con su rotulo delante.
 *
 * El tema convierte las tablas en fichas apiladas y esconde los <th>, dando
 * por hecho que cada celda lleva su data-title. La del plugin no lo lleva, asi
 * que a 390 quedaba "ana_sheeper" y debajo un "1" suelto, sin decir que ese 1
 * es el nivel. Se le pone el rotulo delante a mano: son dos columnas y no van
 * a cambiar. */
@media (max-width: 767px) {
	.uap-ap-wrap .uap-account-table,
	.uap-ap-wrap .uap-account-table tbody,
	.uap-ap-wrap .uap-account-table tr,
	.uap-ap-wrap .uap-account-table td {
		display: block;
		width: auto;
	}

	/* La fila de titulos, en fichas apiladas, queda como una tarjeta vacia
	   arriba del todo. */
	.uap-ap-wrap .uap-account-table thead {
		display: none;
	}

	.uap-ap-wrap .uap-account-table tr {
		margin: 0 0 10px;
		padding: 10px 14px;
		border: 1px solid var(--sb-borde, #e3e6f0);
		border-radius: 10px;
		background: #fff;
	}

	.uap-ap-wrap .uap-account-table td {
		padding: 3px 0;
		border: 0;
	}

	.uap-ap-wrap .uap-account-table td:nth-child(1) {
		font-weight: 700;
		font-size: 15px;
		color: var(--sb-navy, #1b1f3b);
	}

	.uap-ap-wrap .uap-account-table td:nth-child(3)::before {
		content: "Nivel ";
		color: var(--sb-gris, #6b7280);
		font-weight: 600;
	}

	.uap-ap-wrap .uap-account-table td:nth-child(3) {
		font-size: 14px;
		color: var(--sb-gris, #6b7280);
	}
}
