/**
 * BGO Subvenciones
 *
 * Autónomo: no depende de Bootstrap ni de ningún tema concreto.
 * Los colores se definen como variables, así que para adaptarlo a otra
 * marca basta con redefinirlas en el CSS del tema.
 */

:root {
	--bgo-subv-color:        var(--ast-global-color-2);
	--bgo-subv-color-oscuro: var(--ast-global-color-0);
	--bgo-subv-texto:        var(--ast-global-color-1);
	--bgo-subv-texto-blanco: var(--ast-global-color-5);
	--bgo-subv-fondo:        var(--ast-global-color-7);
	--bgo-subv-abierta:      #1a7f37;
	--bgo-subv-cerrada:      #b32d2e;
	--bgo-subv-proxima:      #6b7280;
	--bgo-subv-fondo-cta:    #dfeeff;
	--bgo-subv-borde:        var(--ast-global-color-2);
	--bgo-subv-radio:        8px;
}

/* ------------------------------------------------------------------ */
/* Listados                                                            */
/* ------------------------------------------------------------------ */

.bgo-subvenciones {
	margin: 2rem 0;
	border-radius: var(--bgo-subv-radio);
}

.bgo-subvenciones__scroll {
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}

.bgo-subvenciones__tabla {
	width: 100%;
	border-collapse: collapse;
	margin: 0;
	font-size: 15px;
}

.bgo-subvenciones__tabla th {
	text-align: left;
	padding: 14px 16px;
	font-weight: 700;
	color: var(--bgo-subv-texto-blanco);
	border-bottom: 2px solid var(--bgo-subv-color);
	white-space: nowrap;
}

.bgo-subvenciones__tabla th:nth-child(3),
.bgo-subvenciones__tabla th:nth-child(4) {
	text-align: center;
}

.bgo-subvenciones__tabla td {
	padding: 14px 16px;
	border-bottom: 1px solid var(--bgo-subv-borde);
	vertical-align: middle;
	color: var(--bgo-subv-texto-blanco);
}

.bgo-subvenciones__tabla tr:last-child td {
	border-bottom: 0;
}

.bgo-subvenciones__tabla tbody tr:hover {
	background: var(--bgo-subv-fondo);
}

.bgo-subv-titulo a {
	color: var(--bgo-subv-texto-blanco);
	text-decoration: none;
}

.bgo-subv-titulo a strong {
	font-weight: 400;
}

.bgo-subv-titulo a:hover {
	text-decoration: underline;
}

.bgo-subvenciones .bgo-subvenciones__tabla tbody tr:hover td,
.bgo-subvenciones .bgo-subvenciones__tabla tbody tr:hover td a,
.bgo-subvenciones .bgo-subvenciones__tabla tbody tr:hover td strong {color: var(--ast-global-color-0);}

.bgo-subv-organismo {
	color: var(--bgo-subv-proxima);
	font-size: 14px;
}

.bgo-subv-fecha,
.bgo-subv-estado {
	text-align: center;
	white-space: nowrap;
}

.bgo-subv-vacio {
	text-align: center;
	padding: 28px 16px;
	color: var(--bgo-subv-proxima);
	font-style: italic;
}

.bgo-subv-badge {
	display: inline-block;
	padding: 5px 12px;
	border-radius: 999px;
	font-size: 12px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.4px;
	color: #fff;
	line-height: 1.4;
}

.bgo-subv-badge--abierta { background: var(--bgo-subv-abierta); }
.bgo-subv-badge--cerrada { background: var(--bgo-subv-cerrada); }
.bgo-subv-badge--proxima { background: var(--bgo-subv-proxima); }

/* ------------------------------------------------------------------ */
/* Ficha individual                                                    */
/* ------------------------------------------------------------------ */

.bgo-subv-ficha {
	max-width: 1140px;
	margin: 0 auto;
	padding: 3rem 20px;
}

.bgo-subv-ficha__cabecera h1 {
	color: var(--bgo-subv-texto);
	font-weight: 900;
	padding: 16px;
	text-align: center;
	margin: 0 0 2.5rem;
}

.bgo-subv-ficha__cabecera h1::first-letter {
	text-transform: capitalize;
}

.bgo-subv-ficha__organismo {
	text-align: center;
	margin: -1.75rem 0 2.5rem;
	color: var(--bgo-subv-proxima);
	font-size: 15px;
	text-transform: uppercase;
	letter-spacing: 1px;
}

.bgo-subv-bloque {
	margin-bottom: 2rem;
}

.bgo-subv-bloque h2 {
	font-weight: 600;
	color: var(--bgo-subv-color);
	font-size: 18px;
	padding-bottom: 6px;
	margin-bottom: 16px;
}

.bgo-subv-bloque p,
.bgo-subv-bloque li {
	font-size: 15px;
	line-height: 1.7;
	color: var(--bgo-subv-texto);
}

.bgo-subv-bloque ul {
	list-style: none;
	padding-left: 1.2em;
}

.bgo-subv-bloque ul li {
	margin-bottom: 10px;
	position: relative;
}

.bgo-subv-bloque ul li::before {
	content: "\2023";
	color: var(--bgo-subv-color);
	font-weight: bold;
	font-size: 26px;
	position: absolute;
	left: -1em;
	top: -4px;
}

.bgo-subv-bloque strong {
	color: var(--bgo-subv-color);
}

.bgo-subv-plazos p {
	margin: 0 0 6px;
}

.bgo-subv-plazos strong {
	color: #000;
}

/* Dos columnas */

.bgo-subv-columnas {
	display: flex;
	flex-wrap: wrap;
	gap: 2rem;
	align-items: flex-start;
}

.bgo-subv-columnas__principal {
	flex: 1 1 58%;
	min-width: 280px;
}

.bgo-subv-columnas__lateral {
	flex: 1 1 32%;
	min-width: 220px;
}

.bgo-subv-columnas__lateral img {
	width: 100%;
	height: auto;
	display: block;
}

.bgo-subv-imagen-central {
	margin: 3rem 0;
	text-align: center;
}

.bgo-subv-imagen-central img {
	max-width: 60%;
	height: auto;
	display: inline-block;
}

/* Llamada a la acción */

.bgo-subv-cta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 1.5rem;
	background: var(--bgo-subv-fondo-cta);
	border-radius: var(--bgo-subv-radio);
	padding: 2.5rem;
	margin: 3rem 0;
}

.bgo-subv-cta__texto {
	flex: 1 1 60%;
	min-width: 260px;
}

.bgo-subv-cta__titulo {
	font-size: 26px !important;
	color: var(--bgo-subv-color-oscuro);
	font-weight: 900;
	line-height: 1.15;
	margin: 0 0 12px;
}

.bgo-subv-cta__boton {
	flex: 1 1 25%;
	text-align: center;
}

.bgo-subv-boton {
	display: inline-block;
	background: #688dba;
	color: #fff !important;
	font-weight: 700;
	padding: 12px 32px;
	border-radius: 25px;
	text-decoration: none;
	transition: background 0.2s ease;
}

.bgo-subv-boton:hover {
	background: var(--bgo-subv-color-oscuro);
}

.bgo-subv-formulario {
	margin: 3rem 0;
}

.bgo-subv-formulario h2 {
	color: var(--bgo-subv-color);
	font-weight: 900;
	text-align: center;
	margin-bottom: 1.5rem;
}

/* ------------------------------------------------------------------ */
/* Móvil                                                               */
/* ------------------------------------------------------------------ */

@media only screen and (max-width: 768px) {

	.bgo-subv-ficha {
		padding: 2rem 16px;
	}

	.bgo-subv-ficha__cabecera h1 {
		font-size: 24px;
		padding: 12px;
	}

	.bgo-subv-imagen-central img {
		max-width: 100%;
	}

	.bgo-subv-cta {
		padding: 1.75rem;
		text-align: center;
	}

	.bgo-subv-cta__boton {
		flex-basis: 100%;
	}

	.bgo-subvenciones__tabla {
		font-size: 14px;
	}

	.bgo-subvenciones__tabla th,
	.bgo-subvenciones__tabla td {
		padding: 10px 12px;
	}

	/* La tabla tiene scroll horizontal; el organismo no se corta */
	.bgo-subv-organismo {
		min-width: 140px;
	}
}


/* ==================================================================== */
/* Formulario de contacto — panel oscuro                                 */
/*                                                                       */
/* Pensado para formularios de Mautic (generate.js), pero las reglas     */
/* genéricas sirven también para otros plugins de formularios.           */
/*                                                                       */
/* La clase va repetida (.bgo-subv-formulario.bgo-subv-formulario) para  */
/* subir la especificidad por encima de la del tema: Astra estiliza los  */
/* campos y los botones con selectores del mismo peso que los nuestros   */
/* y, al cargar después, ganaba el empate. Las propiedades que definen   */
/* el aspecto llevan además !important, porque esos estilos del tema     */
/* dependen de los ajustes del personalizador y pueden cambiar.          */
/* ==================================================================== */

:root {
	--bgo-subv-form-fondo:  #203864;
	--bgo-subv-form-texto:  #ffffff;
	--bgo-subv-form-suave:  rgba(255, 255, 255, 0.55);
	--bgo-subv-form-linea:  rgba(255, 255, 255, 0.40);
	--bgo-subv-form-legal:  rgba(255, 255, 255, 0.75);
}

/* --- Contenedor ---------------------------------------------------- */

.bgo-subv-formulario {
	background: var(--bgo-subv-form-fondo);
	border-radius: var(--bgo-subv-radio);
	padding: 3rem;
	color: var(--bgo-subv-form-texto);
}

.bgo-subv-formulario.bgo-subv-formulario h2,
.bgo-subv-formulario.bgo-subv-formulario h2 a {
	color: var(--bgo-subv-form-texto) !important;
}

.bgo-subv-formulario.bgo-subv-formulario a,
.bgo-subv-formulario.bgo-subv-formulario a:hover,
.bgo-subv-formulario.bgo-subv-formulario a:focus,
.bgo-subv-formulario.bgo-subv-formulario a:visited {
	color: var(--bgo-subv-form-texto) !important;
	text-decoration: underline;
}

/* Mautic limita el formulario a 600px y lo centra: lo anulamos. */
.bgo-subv-formulario.bgo-subv-formulario .mauticform_wrapper {
	max-width: none;
	margin: 0;
}

/* --- Rejilla de dos columnas --------------------------------------- */

.bgo-subv-formulario.bgo-subv-formulario .mauticform-page-wrapper {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	column-gap: 2.5rem;
	row-gap: 1.75rem;
}

/* Por defecto cada fila ocupa el ancho completo... */
.bgo-subv-formulario.bgo-subv-formulario .mauticform-row {
	position: relative;
	grid-column: 1 / -1;
	margin: 0;
}

/* ...salvo los campos cortos, que van a media fila. */
.bgo-subv-formulario.bgo-subv-formulario .mauticform-row.mauticform-text,
.bgo-subv-formulario.bgo-subv-formulario .mauticform-row.mauticform-email,
.bgo-subv-formulario.bgo-subv-formulario .mauticform-row.mauticform-tel,
.bgo-subv-formulario.bgo-subv-formulario .mauticform-row.mauticform-number,
.bgo-subv-formulario.bgo-subv-formulario .mauticform-row.mauticform-url,
.bgo-subv-formulario.bgo-subv-formulario .mauticform-row.mauticform-date,
.bgo-subv-formulario.bgo-subv-formulario .mauticform-row.mauticform-select,
.bgo-subv-formulario.bgo-subv-formulario .mauticform-row.mauticform-country {
	grid-column: span 1;
}

/* Los campos ocultos no deben ocupar una celda de la rejilla. */
.bgo-subv-formulario.bgo-subv-formulario .mauticform-hidden,
.bgo-subv-formulario.bgo-subv-formulario .mauticform-row.mauticform-hidden {
	display: none;
}

/* --- Etiquetas ----------------------------------------------------- */

.bgo-subv-formulario.bgo-subv-formulario .mauticform-label {
	display: block;
	margin: 0 0 0.35rem;
	font-size: 0.9rem;
	font-weight: 400;
	letter-spacing: 0.02em;
	color: var(--bgo-subv-form-suave);
}

/* El script del plugin copia el texto de la etiqueta al placeholder del
   campo. Cuando lo hace, la etiqueta se oculta a la vista pero sigue en
   el HTML para los lectores de pantalla. Si por lo que sea el campo se
   queda sin placeholder, la etiqueta se mantiene visible encima. */
.bgo-subv-formulario.bgo-subv-formulario .mauticform-row:has(.mauticform-input[placeholder]:not([placeholder=""])) .mauticform-label {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	border: 0;
	overflow: hidden;
	white-space: nowrap;
	clip-path: inset(50%);
}

/* --- Campos de texto ----------------------------------------------- */

.bgo-subv-formulario.bgo-subv-formulario .mauticform-input,
.bgo-subv-formulario.bgo-subv-formulario .mauticform-selectbox {
	width: 100% !important;
	box-sizing: border-box !important;
	min-height: 0 !important;
	padding: 0.55rem 0 !important;
	border: 0 !important;
	border-bottom: 1px solid var(--bgo-subv-form-linea) !important;
	border-radius: 0 !important;
	background: transparent !important;
	background-image: none !important;
	box-shadow: none !important;
	color: var(--bgo-subv-form-texto) !important;
	font-family: inherit;
	font-size: 1.0625rem;
	line-height: 1.5;
	transition: border-color 0.2s ease;
}

.bgo-subv-formulario.bgo-subv-formulario .mauticform-input::placeholder {
	color: var(--bgo-subv-form-suave) !important;
	opacity: 1 !important;
}

.bgo-subv-formulario.bgo-subv-formulario .mauticform-input::-webkit-input-placeholder {
	color: var(--bgo-subv-form-suave) !important;
	opacity: 1 !important;
}

.bgo-subv-formulario.bgo-subv-formulario .mauticform-input:focus,
.bgo-subv-formulario.bgo-subv-formulario .mauticform-selectbox:focus {
	outline: none !important;
	border-bottom-color: var(--bgo-subv-form-texto) !important;
	box-shadow: none !important;
}

.bgo-subv-formulario.bgo-subv-formulario textarea.mauticform-input {
	min-height: 140px !important;
	resize: vertical;
}

/* El desplegable hereda el color del panel, pero sus opciones las pinta
   el sistema operativo: ahí hace falta texto oscuro sobre blanco. */
.bgo-subv-formulario.bgo-subv-formulario .mauticform-selectbox option {
	color: #1a1a1a;
	background: #ffffff;
}

/* El autorrelleno del navegador pinta el campo de blanco o amarillo.
   Este es el único modo de devolverle el fondo del panel. */
.bgo-subv-formulario.bgo-subv-formulario .mauticform-input:-webkit-autofill,
.bgo-subv-formulario.bgo-subv-formulario .mauticform-input:-webkit-autofill:hover,
.bgo-subv-formulario.bgo-subv-formulario .mauticform-input:-webkit-autofill:focus {
	-webkit-text-fill-color: var(--bgo-subv-form-texto);
	-webkit-box-shadow: 0 0 0 1000px var(--bgo-subv-form-fondo) inset;
	caret-color: var(--bgo-subv-form-texto);
}

/* --- Casillas y botones de opción ---------------------------------- */

.bgo-subv-formulario.bgo-subv-formulario .mauticform-checkboxgrp-row,
.bgo-subv-formulario.bgo-subv-formulario .mauticform-radiogrp-row {
	display: flex;
	align-items: flex-start;
	gap: 0.85rem;
	margin-bottom: 0.9rem;
}

.bgo-subv-formulario.bgo-subv-formulario .mauticform-checkboxgrp-row:last-child,
.bgo-subv-formulario.bgo-subv-formulario .mauticform-radiogrp-row:last-child {
	margin-bottom: 0;
}

.bgo-subv-formulario.bgo-subv-formulario .mauticform-checkboxgrp-checkbox,
.bgo-subv-formulario.bgo-subv-formulario .mauticform-radiogrp-radio {
	appearance: none !important;
	-webkit-appearance: none !important;
	position: relative;
	flex: 0 0 auto;
	width: 22px !important;
	height: 22px !important;
	min-height: 0 !important;
	margin: 2px 0 0 !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 4px !important;
	background: #ffffff !important;
	box-shadow: none !important;
	cursor: pointer;
}

.bgo-subv-formulario.bgo-subv-formulario .mauticform-radiogrp-radio {
	border-radius: 50% !important;
}

.bgo-subv-formulario.bgo-subv-formulario .mauticform-checkboxgrp-checkbox:checked::after {
	content: "";
	position: absolute;
	left: 7px;
	top: 3px;
	width: 6px;
	height: 11px;
	border: solid var(--bgo-subv-form-fondo);
	border-width: 0 2.5px 2.5px 0;
	transform: rotate(45deg);
}

.bgo-subv-formulario.bgo-subv-formulario .mauticform-radiogrp-radio:checked::after {
	content: "";
	position: absolute;
	inset: 6px;
	border-radius: 50%;
	background: var(--bgo-subv-form-fondo);
}

.bgo-subv-formulario.bgo-subv-formulario .mauticform-checkboxgrp-checkbox:focus-visible,
.bgo-subv-formulario.bgo-subv-formulario .mauticform-radiogrp-radio:focus-visible {
	outline: 2px solid var(--bgo-subv-form-texto);
	outline-offset: 3px;
}

.bgo-subv-formulario.bgo-subv-formulario .mauticform-checkboxgrp-label,
.bgo-subv-formulario.bgo-subv-formulario .mauticform-radiogrp-label {
	color: var(--bgo-subv-form-texto) !important;
	margin: 0;
	font-size: 0.95rem;
	font-weight: 400;
	line-height: 1.5;
	color: var(--bgo-subv-form-texto);
	cursor: pointer;
}

/* --- Texto legal ---------------------------------------------------- */

.bgo-subv-formulario.bgo-subv-formulario .mauticform-freetext,
.bgo-subv-formulario.bgo-subv-formulario .mauticform-freehtml {
	font-size: 0.9rem;
	line-height: 1.65;
	color: var(--bgo-subv-form-legal);
}

.bgo-subv-formulario.bgo-subv-formulario .mauticform-freetext p:last-child,
.bgo-subv-formulario.bgo-subv-formulario .mauticform-freehtml p:last-child {
	margin-bottom: 0;
}

/* --- Botón de envío -------------------------------------------------- */

.bgo-subv-formulario.bgo-subv-formulario .mauticform-button-wrapper {
	margin: 0.5rem 0 0 !important;
}

.bgo-subv-formulario.bgo-subv-formulario .mauticform-button,
.bgo-subv-formulario.bgo-subv-formulario button.mauticform-button,
.bgo-subv-formulario.bgo-subv-formulario input.mauticform-button {
	display: inline-block !important;
	width: auto !important;
	min-width: 0 !important;
	margin: 0 !important;
	padding: 0.85rem 2.75rem !important;
	border: 1px solid var(--bgo-subv-form-texto) !important;
	border-radius: var(--bgo-subv-radio) !important;
	background: transparent !important;
	background-image: none !important;
	box-shadow: none !important;
	color: var(--bgo-subv-form-texto) !important;
	font-family: inherit;
	font-size: 1.0625rem;
	font-weight: 400;
	line-height: 1.4;
	letter-spacing: 0.02em;
	text-transform: none;
	text-shadow: none;
	cursor: pointer;
	transition: background-color 0.2s ease, color 0.2s ease;
}

.bgo-subv-formulario.bgo-subv-formulario .mauticform-button:hover,
.bgo-subv-formulario.bgo-subv-formulario .mauticform-button:focus {
	background: var(--bgo-subv-form-texto) !important;
	color: var(--bgo-subv-form-fondo) !important;
	border-color: var(--bgo-subv-form-texto) !important;
}

/* --- Avisos y errores ------------------------------------------------ */

.bgo-subv-formulario.bgo-subv-formulario .mauticform-message,
.bgo-subv-formulario.bgo-subv-formulario .mauticform-post-success {
	margin-bottom: 1.25rem;
	color: #9fe3b4;
}

.bgo-subv-formulario.bgo-subv-formulario .mauticform-error {
	margin-bottom: 1.25rem;
	color: #ffb3ae;
}

.bgo-subv-formulario.bgo-subv-formulario .mauticform-errormsg {
	display: block;
	margin-top: 0.35rem;
	font-size: 0.85rem;
	color: #ffb3ae;
}

/* --- Móvil ----------------------------------------------------------- */

@media only screen and (max-width: 768px) {

	.bgo-subv-formulario {
		padding: 1.75rem 1.25rem;
	}

	/* Una sola columna: los campos cortos pasan a ancho completo solos. */
	.bgo-subv-formulario.bgo-subv-formulario .mauticform-page-wrapper {
		grid-template-columns: 1fr;
		column-gap: 0;
	}

	.bgo-subv-formulario.bgo-subv-formulario .mauticform-button {
		width: 100% !important;
		padding: 0.85rem 1rem !important;
	}
}

/* Mautic deja a veces etiquetas o filas sin contenido (grupos de casillas
   sin título, campos de apoyo). En una rejilla eso abre un hueco. */
.bgo-subv-formulario.bgo-subv-formulario .mauticform-label:empty,
.bgo-subv-formulario.bgo-subv-formulario .mauticform-row:empty {
	display: none;
}