/**
 * Front de Contratación de personal (C-emp2): listado y ficha de convocatorias.
 * Maqueta propia con los tokens del tema (:root de style.css). WCAG 2.2 AA:
 * foco heredado, objetivos ≥24px, contrastes con tokens, información no basada
 * solo en color (el estado va como texto, no solo como color del badge).
 *
 * @package lpa_convocatorias
 */

.cv-filtro {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	gap: 16px 24px;
	background: var(--color-surface-soft);
	border: 1px solid var(--color-border);
	border-radius: var(--radius, 10px);
	padding: clamp(16px, 3vw, 24px);
	margin-block-end: 28px;
}

.cv-campo {
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: 4px;
	min-width: min(100%, 240px);
}

.cv-campo label {
	font-weight: 600;
	font-size: 0.9375rem;
}

.cv-campo select,
.cv-campo input[type="search"] {
	box-sizing: border-box;
	width: 100%;
	min-height: 44px;
	padding: 10px 12px;
	font-family: inherit;
	font-size: 1rem;
	border: 1px solid var(--color-border-interactive);
	border-radius: var(--radius-sm, 6px);
	background: var(--color-surface, #fff);
	color: var(--color-ink);
}

/* El campo de búsqueda ocupa el ancho disponible; el select se queda compacto. */
.cv-campo--buscar {
	flex: 1 1 min(100%, 320px);
}

.cv-filtro-acciones {
	margin: 0;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 16px;
}

/* «Buscar» y «Limpiar» comparten tamaño (misma altura, padding y ancho mínimo). */
.cv-boton,
.cv-reset {
	box-sizing: border-box;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	min-height: 44px;
	min-width: 9rem;
	padding: 10px 28px;
	/* Borde en ambos (transparente en «Buscar») para que el box-sizing coincida
	   y tengan EXACTAMENTE la misma altura. */
	border: 1px solid transparent;
	border-radius: var(--radius-sm, 6px);
	font-family: inherit;
	font-size: 1rem;
	/* line-height explícito: el <a> hereda 1.6 del cuerpo y el <button> no →
	   sin esto la altura difiere. Fijado, ambos miden lo mismo. */
	line-height: 1.2;
	text-decoration: none;
	cursor: pointer;
}

.cv-boton {
	background: var(--color-primary);
	color: var(--color-primary-contrast);
	font-weight: 700;
}

.cv-boton:hover {
	background: var(--color-primary-strong);
}

/* «Limpiar»: acción secundaria (mismo tamaño que «Buscar», estilo bordeado). */
.cv-reset {
	background: var(--color-surface, #fff);
	color: var(--color-primary-strong);
	border: 1px solid var(--color-border-interactive);
	font-weight: 600;
}

.cv-reset:hover {
	background: var(--color-surface-tint);
}

.cv-lista-titulo {
	font-size: 1.125rem;
	margin: 0 0 20px;
}

.cv-lista {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 16px;
}

.cv-item {
	min-width: 0;
	border: 1px solid var(--color-border);
	border-radius: var(--radius, 10px);
	padding: 20px 24px;
	background: var(--color-surface, #fff);
}

.cv-item-titulo {
	margin: 0 0 8px;
	font-size: 1.125rem;
	line-height: 1.35;
	overflow-wrap: break-word;
}

.cv-item-titulo a {
	color: var(--color-primary-strong);
	text-underline-offset: 2px;
}

.cv-meta {
	margin: 0 0 10px;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
}

/* El estado va SIEMPRE como texto (no solo color): cumple 1.4.1. El color/borde
   es un refuerzo visual. */
.cv-badge {
	display: inline-block;
	padding: 3px 12px;
	border-radius: var(--radius-pill, 999px);
	font-size: 0.8125rem;
	font-weight: 700;
	background: var(--color-surface-tint);
	color: var(--color-ink);
	border: 1px solid var(--color-border-interactive);
}

.cv-badge--abierta,
.cv-badge--en-proceso,
.cv-badge--lista-reserva {
	border-color: var(--color-success);
}

.cv-badge--resuelta {
	color: var(--color-muted);
}

.cv-fecha {
	color: var(--color-muted);
	font-size: 0.9375rem;
}

.cv-item-desc {
	margin: 0 0 10px;
	overflow-wrap: break-word;
}

.cv-item-docs {
	margin: 0;
	color: var(--color-muted);
	font-size: 0.9375rem;
}

.cv-vacio {
	padding: 20px;
	background: var(--color-surface-soft);
	border-radius: var(--radius-sm, 6px);
}

/* --- Ficha -------------------------------------------------------------- */
.cv-breadcrumb ol {
	list-style: none;
	margin: 0 0 16px;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	font-size: 0.9375rem;
}

.cv-breadcrumb li:not(:last-child)::after {
	content: "›";
	margin-inline-start: 8px;
	color: var(--color-muted);
}

.cv-breadcrumb a {
	color: var(--color-primary-strong);
}

.cv-ficha-titulo {
	margin: 0 0 12px;
}

.cv-ficha-desc {
	font-size: 1.125rem;
	margin: 0 0 20px;
	overflow-wrap: break-word;
}

.cv-ficha-enlace {
	margin: 0 0 24px;
}

.cv-docs-titulo {
	font-size: 1.25rem;
	margin: 24px 0 16px;
}

.cv-docs {
	list-style: none;
	margin: 0 0 28px;
	padding: 0;
	display: grid;
	gap: 12px;
}

.cv-doc {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
	border: 1px solid var(--color-border);
	border-radius: var(--radius-sm, 6px);
	padding: 14px 18px;
	background: var(--color-surface, #fff);
}

.cv-doc-nombre {
	font-weight: 600;
	overflow-wrap: break-word;
}

.cv-doc-fecha {
	color: var(--color-muted);
	font-size: 0.875rem;
}

.cv-doc-enlace {
	margin-inline-start: auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 44px;
	min-height: 32px;
	padding: 4px 12px;
	border: 1px solid var(--color-border-interactive);
	border-radius: var(--radius-pill, 999px);
	font-size: 0.8125rem;
	font-weight: 700;
	text-decoration: none;
	color: var(--color-primary-strong);
}

.cv-doc-enlace:hover {
	background: var(--color-surface-tint);
}

.cv-volver a {
	color: var(--color-primary-strong);
}