/* Hoja de estilos específicos para el buscador de
solicitud de simplificaciones administrativas SimplexESP */
:root {
	--corporative-red: #c33400;
}

.simplexesp {
	.ppg-search--splitted {
		button.button-txtClave {
			border-radius: 3px;
		}
	}

	.ordenacion {
		.ordenar {
			.select2-container {
				.select2-selection__rendered {
					padding-right: 1.5625rem;
				}
			}
		}

		.resultados-pagina {
			display: flex;
			flex-wrap: wrap;

			ul#menu {
				display: flex;
				gap: 0.8em;
				width: auto !important;

				li {
					margin: unset;
				}
			}
		}
	}

	.resultados {
		.convocatoria {
			padding-top: 1rem;

			&:last-of-type {
				margin-bottom: unset;
			}

			.resultado-tramite {
				padding-top: unset !important;
				max-width: 100%;

				.datos-compl {
					justify-content: initial;
					gap: 0.625rem;
					margin-right: unset;
					margin-bottom: 0.9375rem;

					.dato-compl {
						display: flex;
						align-items: center;
						margin-right: unset;

						&:nth-child(2) {
							margin-left: unset;
						}
					}

					.dato-estado {
						margin-left: auto;
						border-radius: 21px;
						max-width: fit-content;
						max-height: fit-content;
						white-space: nowrap;
					}
				}

				.datos-compl__bordes-rojos {
					display: flex;
					flex-wrap: wrap;
					gap: 0.625rem;

					span.dato-compl.borde-rojo {
						border-radius: 21px;
					}
				}

				.detalle-tramite.desc {
					margin-bottom: 0.5rem;
				}

				.o-unit__row {
					display: flex;
					flex-direction: column;
					gap: 0.5rem;
					margin: unset;
					width: 100%;

					.detalle-tramite.custom {
						margin: unset;
						padding-left: unset;

						.cstm2 {
							width: initial;

							.cstm-barrarrss {
								margin: 0.25rem 0;
								padding: unset;
							}
						}

						dd.datos-resultado {
							padding-left: unset;
						}

						&:last-child {
							display: flex;
							gap: 0.625rem;

							.detalles__cantidad-gente {
								display: flex;
								flex-wrap: wrap;
								align-items: center;
								gap: 0.625rem;

								.detalleSimplex {
									margin-left: unset;

									.alinear-horizontal {
										gap: 0.3125rem;

										dt > span {
											display: flex;
											align-items: center;
											gap: 0.625rem;
										}
									}
								}
							}

							.detalles__fecha.detalleSimplex {
								margin-left: auto;
								max-width: fit-content;
								max-height: fit-content;

								.datos-resultado {
									border-radius: 21px;
									background-color: #f7f7f7;
									padding: 4px 8px;
									font-size: 12px;
								}
							}
						}
					}
				}
			}
		}
	}

	.menu-izq {
		form.contenido-ce {
			.acordeonBuscador-resultadotramite {
				border: 2px solid var(--corporative-red);
				border-radius: 3px;
				padding: 0 0.3125rem;
				width: max-content;
				color: var(--corporative-red);
				white-space: nowrap;

				p.filtrado-txt {
					width: initial;
				}
			}

			ul {
				.select2-selection__rendered {
					.select2-search {
						padding-right: 25px;
						padding-left: 25px;
					}

					.select2-selection__choice + .select2-search {
						padding-right: unset;
						padding-left: unset;
					}

					& > li {
						width: 100%;

						& input.select2-search__field {
							width: 100% !important;
							text-overflow: ellipsis;
							white-space: nowrap;
						}
					}
				}
			}
		}
	}

	nav.pagination {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		align-items: center;
		gap: 1rem;
		padding: 0 0.9375rem;

		.pagination--btns {
			display: flex;
			gap: 0.5rem;

			ul:is(.ppg-pagination__btn--left, .ppg-pagination__btn--right) {
				padding: unset;
				width: initial;

				li {
					display: flex !important;
					height: 100%;
				}

				button:is(.ppg-icon--before, .ppg-icon--after) {
					display: flex;
					align-items: center;

					span {
						white-space: nowrap;
					}
				}
			}

			ul.ppg-pagination__btn--middle {
				display: flex;
				align-items: center;
				gap: 5px;
				margin: unset;
				padding: unset;
				width: auto;

				li {
					& > span {
						display: flex;
						align-items: center;
						height: 100%;
					}

					button {
						margin-right: unset !important;

						span {
							white-space: nowrap;
						}
					}
				}
			}
		}

		div.ppg-pagination__input--middle {
			display: flex;
			justify-content: flex-end;
			align-items: center;
			gap: 0.5rem;
			padding: unset;
			width: auto;

			input {
				width: 2.375rem;
				height: 40px;
				text-align: center;
			}

			span {
				white-space: nowrap;
			}
		}
	}

	/* MEDIA QUERIES */

	@media (768px <= width <= 1023px) {
		label.label-ordenar {
			margin-right: 1rem;
		}
	}

	@media (width >= 768px) {
		.ordenacion .select2-container--default .select2-selection--single {
			margin-left: 0;
		}
	}
	@media (width < 768px) {
		.ppg-search--splitted {
			display: flex;
			flex-direction: column;
			gap: 1rem;
			margin-right: unset;
			margin-left: unset;

			i.fa.fa-search.icon-right {
				top: 30%;
				right: 25px;
			}
		}

		.menu-izq {
			.ppg-form__fieldset--submit {
				padding: unset;

				.buscar-limpiar {
					.boton-buscar {
						margin-top: 1rem;
						width: 100%;
					}
				}
			}
		}

		.resultados {
			.ordenacion {
				div:is(.ordenar, .resultados-pagina) {
					padding-left: 1rem;

					.label-ordenar {
						margin-right: unset;
						margin-left: unset;
					}

					.select2-selection__rendered {
						padding-left: unset;
					}
				}

				.resultados-pagina {
					gap: 1rem;
				}
			}
		}

		nav.pagination {
			ul.ppg-pagination__btn--left {
				.ppg-icon--before {
					&::before {
						margin: 0 0.3125rem;
					}
				}
			}

			ul.ppg-pagination__btn--right {
				.ppg-icon--after {
					&::before {
						display: inline-block;
						vertical-align: middle;
						margin: 0 0.3125rem;
						background-image: url(../assets/img/icons/spritesheet.png);
						background-repeat: no-repeat;
						content: "";
					}
				}
			}
		}
	}
}