.rec-buscador,
.rec-detalle,
.rec-manual {
	max-width: 960px;
	margin: 0 auto;
	/* Separación de seguridad respecto al encabezado del tema: en
	   algunos temas/constructores de páginas, el título de la página se
	   superpone al logo del sitio cuando la plantilla no trae la franja
	   de encabezado habitual. Este margen no corrige el título en sí
	   (lo pinta el tema, fuera de este bloque), pero evita que el
	   contenido del plugin quede pegado o tapado por ese encabezado. */
	margin-top: 32px;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	color: #1a1a1a;
}

.rec-form-busqueda {
	display: flex;
	flex-wrap: wrap;
	gap: 16px;
	align-items: end;
	background: #f7f7f8;
	border: 1px solid #e2e2e4;
	border-radius: 8px;
	padding: 20px;
	margin-bottom: 24px;
}

.rec-campo {
	display: flex;
	flex-direction: column;
	gap: 6px;
	flex: 1 1 200px;
}

.rec-campo label {
	font-size: 12px;
	font-weight: 600;
	color: #0f2341;
	text-transform: uppercase;
	letter-spacing: 0.02em;
}

.rec-campo input,
.rec-campo select {
	padding: 8px 10px;
	border: 1px solid #cfcfd4;
	border-radius: 5px;
	font-size: 14px;
}

.rec-boton {
	display: inline-block;
	background: #0f2341;
	color: #fff !important;
	border: none;
	border-radius: 5px;
	padding: 10px 20px;
	font-weight: 600;
	font-size: 14px;
	cursor: pointer;
	text-decoration: none;
	text-align: center;
}

.rec-boton:hover {
	background: #b48828;
	color: #fff;
}

.rec-resultados {
	min-height: 40px;
}

.rec-tarjeta-resultado {
	border: 1px solid #e2e2e4;
	border-radius: 8px;
	padding: 16px 20px;
	margin-bottom: 12px;
	display: grid;
	grid-template-columns: 1fr auto;
	gap: 8px;
	align-items: center;
}

.rec-tarjeta-resultado h3 {
	margin: 0 0 4px;
	font-size: 15px;
	color: #0f2341;
}

.rec-tarjeta-resultado .rec-meta {
	font-size: 13px;
	color: #555;
	margin: 2px 0;
}

.rec-tarjeta-resultado .rec-antiguedad {
	font-weight: 700;
	color: #b48828;
}

.rec-paginacion {
	display: flex;
	gap: 8px;
	justify-content: center;
	margin-top: 16px;
}

.rec-paginacion button {
	border: 1px solid #cfcfd4;
	background: #fff;
	border-radius: 4px;
	padding: 6px 12px;
	cursor: pointer;
}

.rec-paginacion button[disabled] {
	opacity: 0.4;
	cursor: default;
}

.rec-aviso-login {
	background: #fff3cd;
	border: 1px solid #ffe69c;
	border-radius: 8px;
	padding: 20px;
	text-align: center;
	max-width: 480px;
	margin: 0 auto;
}

.rec-tabla-detalle {
	width: 100%;
	border-collapse: collapse;
	margin: 16px 0 24px;
}

.rec-tabla-detalle th,
.rec-tabla-detalle td {
	text-align: left;
	padding: 10px 12px;
	border-bottom: 1px solid #eee;
	vertical-align: top;
}

.rec-tabla-detalle th {
	width: 220px;
	color: #0f2341;
	font-weight: 600;
	background: #f7f7f8;
}

.rec-verificar-externo {
	margin-top: 20px;
	padding: 14px 18px;
	background: #f7f7f8;
	border-left: 4px solid #790F18;
	border-radius: 4px;
}

.rec-verificar-externo p {
	margin: 0 0 8px;
}

.rec-verificar-externo ol {
	margin: 0 0 0 20px;
	padding: 0;
}

.rec-verificar-externo li {
	margin-bottom: 6px;
}

.rec-verificar-externo code {
	background: #fff;
	padding: 2px 6px;
	border-radius: 3px;
	border: 1px solid #ddd;
}

.rec-estado-vacio {
	text-align: center;
	color: #666;
	padding: 24px;
}

.rec-buscador [hidden] {
	display: none !important;
}

.rec-tarjeta-resultado {
	cursor: pointer;
}

.rec-tarjeta-resultado h3 a {
	color: inherit;
	text-decoration: none;
}

.rec-tarjeta-resultado h3 a:hover {
	text-decoration: underline;
}

.rec-volver {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	background: none;
	border: none;
	color: #0f2341;
	font-weight: 600;
	font-size: 13px;
	cursor: pointer;
	padding: 0 0 16px;
	text-decoration: none;
}

.rec-volver:hover {
	color: #b48828;
}

/* Botón flotante de inicio de sesión: fijo al costado derecho de la
   pantalla y siempre centrado verticalmente, sin importar el scroll. */
.rec-boton-flotante-login {
	position: fixed;
	top: 50%;
	right: 0;
	transform: translateY(-50%);
	z-index: 99999;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 6px;
	background: #0f2341;
	color: #fff !important;
	text-decoration: none !important;
	padding: 16px 10px;
	border-radius: 8px 0 0 8px;
	box-shadow: -2px 2px 12px rgba( 0, 0, 0, 0.25 );
	writing-mode: vertical-rl;
	text-orientation: mixed;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.02em;
	transition: background-color 0.15s ease, padding-right 0.15s ease;
}

.rec-boton-flotante-login:hover,
.rec-boton-flotante-login:focus {
	background: #b48828;
	color: #fff;
	padding-right: 16px;
}

.rec-boton-flotante-login .rec-boton-flotante-icono {
	writing-mode: horizontal-tb;
	font-size: 16px;
	line-height: 1;
}

@media ( max-width: 600px ) {
	.rec-boton-flotante-login {
		padding: 12px 8px;
		font-size: 12px;
	}
}

.rec-buscador .rec-volver {
	margin: 0 0 16px;
}

.rec-buscador .rec-volver a {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	color: #0f2341;
	font-size: 13.5px;
	font-weight: 600;
	text-decoration: none;
}

.rec-buscador .rec-volver a:hover,
.rec-buscador .rec-volver a:focus {
	color: #b48828;
	text-decoration: underline;
}
