/* =========================================================================
   Oposiciones Oficial - Portal publico (tema NEXUS IA)
   -------------------------------------------------------------------------
   Paleta y tipografia alineadas con la identidad real del sitio: fondo
   casi negro, acento cian neon (como el logotipo), tipografia tecnica en
   vez de la serif de gaceta oficial de la version anterior. La estructura
   (masthead, tira de busqueda, tarjetas tipo expediente, sidebar) se
   mantiene: solo cambia el vestido.

   Color:  fondo #06080B, paneles #0D1117, texto #EDF1F3, acento cian
           #2FE3D6 (CTAs, foco, estado activo), rojo urgencia #FF6B6B,
           verde abierta #35D68C, ambar proxima #E8B23D.
   Tipos:  Space Grotesk (titulos, tecnica/geometrica) + Archivo (UI y
           datos, cifras tabulares).
   ========================================================================= */

.opos-portal {
	--opos-paper: #06080B;
	--opos-paper-alt: #0D1117;
	--opos-ink: #EDF1F3;
	--opos-ink-soft: #93A1AC;
	--opos-line: #1D242C;
	--opos-red: #FF6B6B;
	--opos-red-soft: rgba(255, 107, 107, 0.12);
	--opos-green: #35D68C;
	--opos-green-soft: rgba(53, 214, 140, 0.12);
	--opos-amber: #E8B23D;
	--opos-amber-soft: rgba(232, 178, 61, 0.12);
	--opos-grey: #5C6773;
	--opos-accent: #2FE3D6;
	--opos-accent-ink: #06080B;
	--opos-radius: 4px;

	background: var(--opos-paper);
	color: var(--opos-ink);
	font-family: 'Archivo', -apple-system, BlinkMacSystemFont, sans-serif;
	font-variant-numeric: tabular-nums;
	line-height: 1.5;
	max-width: 1160px;
	margin: 0 auto;
}

.opos-portal a { color: inherit; }

/* ---------------------------------------------------------------- masthead */

.opos-masthead {
	border-bottom: 1px solid var(--opos-line);
	padding: 28px 24px 22px;
}

.opos-masthead__inner {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 12px;
}

.opos-wordmark {
	text-decoration: none;
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.opos-wordmark__nombre {
	font-family: 'Space Grotesk', 'Archivo', sans-serif;
	font-weight: 700;
	font-size: 26px;
	color: var(--opos-ink);
	letter-spacing: -0.01em;
}

.opos-wordmark__sub {
	font-size: 13px;
	color: var(--opos-accent);
}

.opos-masthead__nav {
	display: flex;
	align-items: center;
	gap: 16px;
	font-size: 14px;
}

.opos-masthead__usuario {
	color: var(--opos-ink-soft);
}

.opos-boton-cuenta {
	text-decoration: none;
	border: 1px solid var(--opos-accent) !important;
	color: var(--opos-accent) !important;
	background: transparent !important;
	border-radius: var(--opos-radius);
	padding: 7px 16px;
}

.opos-boton-cuenta:hover {
	background: var(--opos-accent) !important;
	color: var(--opos-accent-ink) !important;
}

/* --------------------------------------------------------- tira de busqueda */

.opos-tira-busqueda {
	background: var(--opos-paper-alt);
	border-bottom: 1px solid var(--opos-line);
	padding: 20px 24px;
}

.opos-form-portal {
	display: flex;
	gap: 14px;
	flex-wrap: wrap;
	align-items: flex-end;
	max-width: 1112px;
	margin: 0 auto;
}

.opos-campo {
	display: flex;
	flex-direction: column;
	gap: 5px;
	flex: 1;
	min-width: 160px;
}

.opos-campo--texto { flex: 2.2; min-width: 240px; }

.opos-campo label {
	font-size: 12.5px;
	color: var(--opos-ink-soft);
}

/* Reseteo defensivo: el tema/Elementor aplican estilos globales a
   button/input/select con bastante especificidad; partimos de un
   reseteo básico antes de aplicar los estilos propios del portal. */
.opos-portal button {
	appearance: none;
	-webkit-appearance: none;
	box-sizing: border-box;
	font-family: inherit;
	box-shadow: none;
}

.opos-portal input,
.opos-portal select {
	appearance: none;
	-webkit-appearance: none;
	box-sizing: border-box;
}

.opos-campo input,
.opos-campo select {
	font-family: 'Archivo', sans-serif;
	font-size: 15px;
	padding: 10px 12px;
	border: 1px solid var(--opos-line) !important;
	border-radius: var(--opos-radius);
	background: #10151B !important;
	color: var(--opos-ink) !important;
}

.opos-campo input::placeholder { color: #5C6773; }

.opos-campo input:focus,
.opos-campo select:focus {
	outline: 2px solid var(--opos-accent);
	outline-offset: 1px;
	border-color: var(--opos-accent);
}

.opos-boton-buscar {
	font-family: 'Space Grotesk', sans-serif;
	font-weight: 600;
	font-size: 15px;
	padding: 11px 26px;
	background: var(--opos-accent) !important;
	color: var(--opos-accent-ink) !important;
	border: none !important;
	border-radius: var(--opos-radius);
	cursor: pointer;
	box-shadow: 0 0 0 rgba(47, 227, 214, 0);
	transition: box-shadow 0.15s ease;
}

.opos-boton-buscar:hover {
	background: var(--opos-accent) !important;
	box-shadow: 0 0 18px rgba(47, 227, 214, 0.35);
}

.opos-boton-limpiar {
	font-family: 'Archivo', sans-serif;
	font-size: 14px;
	padding: 11px 18px;
	background: transparent !important;
	color: var(--opos-ink-soft) !important;
	border: 1px solid var(--opos-line) !important;
	border-radius: var(--opos-radius);
	cursor: pointer;
}

.opos-boton-limpiar:hover {
	color: var(--opos-ink) !important;
	border-color: var(--opos-ink-soft) !important;
}

/* --------------------------------------------------------------- cuerpo */

.opos-cuerpo {
	display: grid;
	grid-template-columns: 1fr 300px;
	gap: 32px;
	padding: 28px 24px 60px;
}

@media (max-width: 820px) {
	.opos-cuerpo { grid-template-columns: 1fr; }
	.opos-sidebar { order: -1; }
}

.opos-resultados-portal {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.opos-vacio,
.opos-vacio-pequeno,
.opos-cargando,
.opos-error {
	color: var(--opos-ink-soft);
	font-size: 14px;
}

.opos-paginacion {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 18px;
	margin-top: 16px;
	padding-top: 16px;
	border-top: 1px solid var(--opos-line);
}

.opos-paginacion__estado {
	font-size: 13.5px;
	color: var(--opos-ink-soft);
	font-variant-numeric: tabular-nums;
}

.opos-paginacion__boton {
	font-family: 'Archivo', sans-serif;
	font-size: 13.5px;
	padding: 8px 16px;
	background: transparent !important;
	color: var(--opos-ink) !important;
	border: 1px solid var(--opos-line) !important;
	border-radius: var(--opos-radius);
	cursor: pointer;
}

.opos-paginacion__boton:hover:not(:disabled) {
	border-color: var(--opos-accent) !important;
	color: var(--opos-accent) !important;
}

.opos-paginacion__boton:disabled {
	opacity: 0.35;
	cursor: default;
}

/* ------------------------------------------------------- tarjeta / expediente */

.opos-tarjeta {
	display: flex;
	justify-content: space-between;
	gap: 16px;
	background: var(--opos-paper-alt);
	border: 1px solid var(--opos-line);
	border-left: 3px solid var(--opos-grey);
	border-radius: var(--opos-radius);
	padding: 16px 18px;
}

.opos-tarjeta--abierta { border-left-color: var(--opos-green); }
.opos-tarjeta--proxima { border-left-color: var(--opos-amber); }
.opos-tarjeta--cerrada { border-left-color: var(--opos-grey); opacity: 0.7; }

.opos-tarjeta__titulo {
	font-family: 'Space Grotesk', sans-serif;
	font-weight: 600;
	font-size: 18px;
	margin: 0 0 6px;
	color: var(--opos-ink);
}

.opos-tarjeta__titulo a { text-decoration: none; }
.opos-tarjeta__titulo a:hover { color: var(--opos-accent); }

.opos-tarjeta__organismo {
	margin: 0 0 4px;
	font-size: 14px;
	color: var(--opos-ink-soft);
}

.opos-tarjeta__plazas {
	margin-left: 8px;
	font-weight: 600;
	color: var(--opos-accent);
}

.opos-tarjeta__territorio {
	margin: 0 0 4px;
	font-size: 13px;
	color: var(--opos-ink-soft);
}

.opos-tarjeta__plazo {
	margin: 6px 0 0;
	font-size: 13.5px;
	color: var(--opos-ink-soft);
}

.opos-tarjeta__plazo--urgente {
	color: var(--opos-red);
	font-weight: 600;
}

.opos-tarjeta__acciones {
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	justify-content: space-between;
	gap: 10px;
	flex-shrink: 0;
}

.opos-tarjeta__enlace {
	font-size: 13.5px;
	text-decoration: none;
	white-space: nowrap;
	color: var(--opos-accent);
	border-bottom: 1px solid var(--opos-accent);
}

.opos-boton-guardar {
	font-family: 'Archivo', sans-serif;
	font-size: 13px;
	padding: 6px 14px;
	border: 1px solid var(--opos-line) !important;
	border-radius: var(--opos-radius);
	background: transparent !important;
	color: var(--opos-ink-soft) !important;
	cursor: pointer;
	white-space: nowrap;
}

.opos-boton-guardar--activo {
	background: var(--opos-accent) !important;
	border-color: var(--opos-accent) !important;
	color: var(--opos-accent-ink) !important;
}

/* --------------------------------------------------------------- sidebar */

.opos-panel {
	background: var(--opos-paper-alt);
	border: 1px solid var(--opos-line);
	border-radius: var(--opos-radius);
	padding: 18px;
	margin-bottom: 18px;
}

.opos-panel h2 {
	font-family: 'Space Grotesk', sans-serif;
	font-weight: 600;
	font-size: 15px;
	margin: 0 0 12px;
	color: var(--opos-ink);
}

.opos-lista-alertas,
.opos-lista-favoritos {
	list-style: none;
	margin: 0 0 14px;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.opos-lista-alertas li {
	display: flex;
	justify-content: space-between;
	align-items: center;
	font-size: 13.5px;
	border-bottom: 1px solid var(--opos-line);
	padding-bottom: 6px;
}

.opos-eliminar-alerta {
	background: none;
	border: none;
	color: var(--opos-ink-soft);
	cursor: pointer;
	font-size: 13px;
}

.opos-lista-favoritos li {
	font-size: 13.5px;
	border-bottom: 1px solid var(--opos-line);
	padding-bottom: 6px;
}

.opos-crear-alerta {
	width: 100%;
	font-family: 'Archivo', sans-serif;
	font-size: 13.5px;
	font-weight: 600;
	padding: 9px 12px;
	background: transparent !important;
	border: 1px solid var(--opos-accent) !important;
	border-radius: var(--opos-radius);
	color: var(--opos-accent) !important;
	cursor: pointer;
}

.opos-crear-alerta:hover {
	background: var(--opos-accent) !important;
	color: var(--opos-accent-ink) !important;
}

.opos-panel--cuenta p {
	font-size: 13.5px;
	color: var(--opos-ink-soft);
	margin: 0 0 14px;
}

.opos-disclaimer-portal {
	font-size: 12.5px;
	color: var(--opos-grey);
}

/* ------------------------------------------------------------ cuenta / login */

.opos-cuenta-columnas {
	display: flex;
	flex-direction: column;
	gap: 20px;
}

.opos-cuenta-form {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.opos-cuenta-form h3 {
	font-family: 'Space Grotesk', sans-serif;
	font-size: 14px;
	margin: 0;
	color: var(--opos-ink);
}

.opos-cuenta-form label {
	display: flex;
	flex-direction: column;
	gap: 4px;
	font-size: 12.5px;
	color: var(--opos-ink-soft);
}

.opos-cuenta-form input {
	font-size: 14px;
	padding: 8px 10px;
	border: 1px solid var(--opos-line);
	border-radius: var(--opos-radius);
	background: #10151B;
	color: var(--opos-ink);
}

.opos-cuenta-form button {
	font-family: 'Archivo', sans-serif;
	font-weight: 600;
	font-size: 13.5px;
	padding: 9px;
	background: var(--opos-accent) !important;
	color: var(--opos-accent-ink) !important;
	border: none !important;
	border-radius: var(--opos-radius);
	cursor: pointer;
}

.opos-enlace-olvide {
	background: transparent !important;
	color: var(--opos-ink-soft) !important;
	font-weight: 400 !important;
	font-size: 12.5px !important;
	text-decoration: underline;
	padding: 4px 0 !important;
}

.opos-checkbox-privacidad {
	display: flex;
	align-items: flex-start;
	gap: 8px;
	font-size: 12.5px;
	color: var(--opos-ink-soft);
	flex-direction: row;
}

.opos-checkbox-privacidad input[type="checkbox"] {
	margin-top: 2px;
	flex-shrink: 0;
}

.opos-checkbox-privacidad a {
	color: var(--opos-accent);
}

.opos-cuenta-mensaje {
	font-size: 13px;
	background: var(--opos-red-soft);
	color: var(--opos-red);
	padding: 8px 10px;
	border-radius: var(--opos-radius);
	margin-bottom: 12px;
}

.opos-enlace-salir { font-size: 13.5px; color: var(--opos-accent); }

/* Accesibilidad: foco visible consistente en toda la pagina. */
.opos-portal a:focus-visible,
.opos-portal button:focus-visible {
	outline: 2px solid var(--opos-accent);
	outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
	.opos-portal * { transition: none !important; }
}

/* ------------------------------------------------------------- ficha individual */

.opos-cuerpo--ficha {
	display: block;
	max-width: 760px;
}

.opos-cuerpo--archivo {
	display: block;
	max-width: 800px;
	padding: 28px 24px 60px;
}

.opos-archivo__titulo {
	font-family: 'Space Grotesk', sans-serif;
	font-weight: 600;
	font-size: 26px;
	margin: 14px 0 6px;
	color: var(--opos-ink);
}

.opos-archivo__intro {
	font-size: 14px;
	color: var(--opos-ink-soft);
	margin: 0 0 20px;
}

.opos-ficha-vacia,
.opos-ficha-completa {
	background: var(--opos-paper-alt);
	border: 1px solid var(--opos-line);
	border-radius: var(--opos-radius);
	padding: 28px;
}

.opos-ficha-vacia h1,
.opos-ficha-completa__titulo {
	font-family: 'Space Grotesk', sans-serif;
	font-weight: 600;
	font-size: 26px;
	margin: 14px 0 10px;
	color: var(--opos-ink);
}

.opos-ficha-completa { border-left: 5px solid var(--opos-grey); }
.opos-ficha-completa.opos-tarjeta--abierta { border-left-color: var(--opos-green); }
.opos-ficha-completa.opos-tarjeta--proxima { border-left-color: var(--opos-amber); }
.opos-ficha-completa.opos-tarjeta--cerrada { border-left-color: var(--opos-grey); }

.opos-ficha-completa__estado {
	display: inline-block;
	font-size: 12.5px;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: var(--opos-ink-soft);
	margin: 0 0 18px;
}

.opos-ficha-completa__info {
	list-style: none;
	margin: 0 0 22px;
	padding: 0;
}

.opos-ficha-completa__info li {
	padding: 8px 0;
	border-bottom: 1px solid var(--opos-line);
	font-size: 14.5px;
	color: var(--opos-ink);
}

.opos-ficha-completa__acciones {
	display: flex;
	align-items: center;
	gap: 14px;
	margin-bottom: 22px;
	flex-wrap: wrap;
}

.opos-ficha-completa__fuente {
	font-size: 13.5px;
	color: var(--opos-ink-soft);
	margin-bottom: 16px;
}

.opos-ficha-completa__historial ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.opos-ficha-completa__historial li {
	font-size: 13px;
	color: var(--opos-ink-soft);
	border-bottom: 1px solid var(--opos-line);
	padding-bottom: 8px;
}

.opos-ficha-completa__historial-fecha {
	color: var(--opos-accent);
	font-variant-numeric: tabular-nums;
}
