/**
 * LinoCrochet: estilos base compartidos (botones, utilidades, mensajes).
 * Dependencia de todos los demas archivos.
 */

/* ---------- Botones (estándar del plugin) ---------- */

/* Los temas (Astra, etc.) pintan sus propios colores en button:hover y
   button:focus, y se cuelan (azules) si algún estado no define los suyos.
   Por eso cada estado fija fondo, borde y color explícitos, y el selector
   incluye el tipo "button" para ganar en especificidad.

   Botones tipo píldora neutra: paginación y filtros rápidos. */

button.lino-paginacion__boton,
button.lino-filtro-rapido__pastilla {
	background: #fff;
	border: 1px solid #e5e0d8;
	border-radius: 999px;
	color: #4f4636;
	cursor: pointer;
	box-shadow: none;
	text-transform: none;
	transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

button.lino-paginacion__boton:focus,
button.lino-filtro-rapido__pastilla:focus {
	background: #fff;
	border-color: #e5e0d8;
	color: #4f4636;
	box-shadow: none;
	outline: none;
}

/* Después de :focus para que, con el botón enfocado, el hover se vea igual. */
button.lino-paginacion__boton:hover,
button.lino-filtro-rapido__pastilla:hover {
	background: #fdf8e7;
	border-color: #c9a227;
	color: #2f2a1e;
	box-shadow: none;
}

button.lino-paginacion__boton:focus-visible,
button.lino-filtro-rapido__pastilla:focus-visible {
	outline: 2px solid #c9a227;
	outline-offset: 2px;
}

/* Estado seleccionado: al final para ganarle a hover y focus. */
button.lino-paginacion__boton.es-actual,
button.lino-filtro-rapido__pastilla.es-activa {
	background: #c9a227;
	border-color: #c9a227;
	color: #fff;
	font-weight: 600;
}

button.lino-paginacion__boton.es-actual {
	cursor: default;
}

/* ---------- Enlaces (anula Astra) ---------- */

/* El tema declara `a:hover, a:focus { color: var(--ast-global-color-1); }`.
   Ese token no es de la marca y se cuela en tarjetas, nombres y CTAs.
   `body a` gana en especificidad; los botones del plugin (dorado / blanco /
   WhatsApp) siguen pintando el suyo porque traen más clases. */
body a:hover,
body a:focus {
	color: #a67b5b;
}

body a:focus-visible {
	outline: 2px solid #c9a227;
	outline-offset: 2px;
}

/* ---------- Utilidades ---------- */

/* Texto solo para lectores de pantalla (por si el tema no trae la clase). */
.lino-grilla .screen-reader-text {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
}

/* ---------- Mensajes ---------- */

.lino-aviso {
	padding: 12px 16px;
	border: 1px dashed #c9a227;
	border-radius: 8px;
	background: #fdf8e7;
	color: #6b5a12;
	font-size: 0.9rem;
}

.lino-vacio {
	text-align: center;
	opacity: 0.7;
}