/*
Theme Name: Mediterráneo Business
Theme URI: https://mediterraneobusiness.es
Author: Visual & Growth (Agente Digitalizador Kit Digital)
Author URI: https://visualandgrowth.com
Description: Tema de bloques a medida para Mediterráneo Business S.L. — asesoría fiscal, contable, laboral y mercantil en Barcelona. Desarrollado dentro del programa Kit Digital (categoría Sitio Web y Presencia Básica en Internet). Diseño responsive, autogestionable, preparado para multidioma y accesible (WCAG 2.1 AA / EN 301549).
Version: 1.2.0
Requires at least: 6.6
Tested up to: 6.9
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: mediterraneo-business
Tags: full-site-editing, block-patterns, custom-colors, custom-menu, translation-ready, accessibility-ready, business
*/

/*
 * Los estilos globales se gestionan en theme.json.
 * Este archivo solo contiene ajustes puntuales que theme.json no cubre.
 *
 * Requires at least: 6.6 porque theme.json usa "version": 3, introducida en WordPress 6.6.
 */

/* -------------------------------------------------------------------------
 * Accesibilidad
 * ---------------------------------------------------------------------- */

/*
 * Enlace de salto al contenido. WordPress ya lo inyecta en los temas de bloques
 * (the_block_template_skip_link), así que el tema NO añade otro: solo lo tiñe con
 * los colores de marca. La especificidad .skip-link.screen-reader-text iguala la
 * de la regla del núcleo para poder sobrescribirla.
 */
.skip-link.screen-reader-text:focus {
	background-color: #0B1B3B;
	color: #ffffff;
	font-weight: 700;
	padding: 14px 22px;
	border-radius: 0 0 8px 0;
	text-decoration: none;
	outline: 3px solid #1D4ED8;
	outline-offset: 2px;
}

/* Foco visible reforzado para navegación por teclado (WCAG 2.4.7) */
:where(a, button, input, textarea, select, summary, .wp-block-button__link):focus-visible {
	outline: 3px solid #1D4ED8;
	outline-offset: 2px;
}

/* -------------------------------------------------------------------------
 * Servicios: iconos de las tarjetas
 * ---------------------------------------------------------------------- */
.mb-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	line-height: 0;
}

/* -------------------------------------------------------------------------
 * Desplegable de servicios adicionales (bloque Detalles nativo)
 * ---------------------------------------------------------------------- */
details.mb-extra {
	border: 1px solid #E2E8F0;
	border-radius: 14px;
	padding: 1.15rem 1.5rem;
	margin-bottom: 1rem;
	background: #ffffff;
	transition: border-color .15s ease, box-shadow .15s ease;
}
details.mb-extra[open] {
	border-color: #1D4ED8;
	box-shadow: 0 8px 24px rgba(11, 27, 59, 0.08);
}
details.mb-extra summary {
	cursor: pointer;
	list-style: none;
	font-weight: 800;
	font-size: 1.2rem;
	color: #0B1B3B;
	letter-spacing: -0.01em;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
}
details.mb-extra summary::-webkit-details-marker { display: none; }
details.mb-extra summary::after {
	content: "+";
	font-weight: 700;
	font-size: 1.6rem;
	line-height: 1;
	color: #1D4ED8;
	transition: transform .2s ease;
}
details.mb-extra[open] summary::after { content: "\2013"; }
details.mb-extra summary:focus-visible {
	outline: 3px solid #1D4ED8;
	outline-offset: 3px;
	border-radius: 6px;
}

/* -------------------------------------------------------------------------
 * Formulario de contacto
 *
 * Vive aquí y no en una etiqueta <style> dentro del bloque HTML del patrón:
 * WordPress elimina <style> del contenido al guardar cuando quien edita no
 * tiene la capacidad unfiltered_html (perfiles Editor o inferiores).
 *
 * Los bordes usan #7C8798 (3,64:1 sobre blanco) para cumplir el criterio
 * WCAG 2.1 AA 1.4.11 «Contraste no textual», que exige 3:1 en el contorno
 * de los componentes de interfaz.
 * ---------------------------------------------------------------------- */
.mb-form {
	font-family: var(--wp--preset--font-family--manrope);
}
.mb-form-note {
	font-size: .85rem;
	color: #556070;
	margin: 0 0 1.25rem;
}
.mb-form-row {
	display: flex;
	gap: 1rem;
	flex-wrap: wrap;
}
.mb-form-row .mb-field { flex: 1 1 200px; }
.mb-field {
	margin-bottom: 1.1rem;
	display: flex;
	flex-direction: column;
}
.mb-field label {
	font-size: .92rem;
	font-weight: 600;
	color: #0F172A;
	margin-bottom: .4rem;
}
.mb-field input,
.mb-field textarea {
	font: inherit;
	font-size: 1rem;
	padding: .75rem .9rem;
	border: 1px solid #7C8798;
	border-radius: 10px;
	background: #fff;
	color: #0F172A;
	width: 100%;
	box-sizing: border-box;
}
.mb-field textarea {
	resize: vertical;
	min-height: 8rem;
}
.mb-field input:focus,
.mb-field textarea:focus {
	outline: 3px solid #1D4ED8;
	outline-offset: 1px;
	border-color: #1D4ED8;
}
.mb-consent {
	flex-direction: row;
	align-items: flex-start;
	gap: .6rem;
}
.mb-consent input {
	width: auto;
	margin-top: .2rem;
}
.mb-consent label {
	font-weight: 500;
	color: #556070;
	margin: 0;
}
.mb-form-submit {
	font: inherit;
	font-weight: 700;
	font-size: 1rem;
	background: #1D4ED8;
	color: #fff;
	border: 0;
	border-radius: 10px;
	padding: .9rem 1.6rem;
	cursor: pointer;
	margin-top: .5rem;
}
.mb-form-submit:hover { background: #1E40AF; }
.mb-form-submit:focus-visible {
	outline: 3px solid #0B1B3B;
	outline-offset: 2px;
}
.mb-form-submit:disabled {
	opacity: .7;
	cursor: default;
}

/* Honeypot antispam: fuera de la vista y del foco, sin usar display:none
   (algunos bots ignoran los campos ocultos con display:none). */
.mb-hp {
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

/* Mensaje de estado del envío */
.mb-form-status {
	margin: 1rem 0 0;
	font-size: .95rem;
	font-weight: 600;
	line-height: 1.5;
}
.mb-form-status:empty { margin: 0; }
.mb-form-status.is-ok { color: #15803D; }
.mb-form-status.is-error { color: #B91C1C; }
.mb-form-status.is-sending { color: #556070; }

/* -------------------------------------------------------------------------
 * Pie de página
 * ---------------------------------------------------------------------- */

/* Logo en el footer (fondo navy): chip blanco tras la marca y texto claro */
.mb-footer .mb-logo img {
	background: #ffffff;
	border-radius: 50%;
	padding: 3px;
	box-sizing: border-box;
}
.mb-footer .mb-logo p {
	color: #ffffff !important;
}
.mb-footer .mb-logo p:last-child {
	color: #9db2d9 !important;
}

/* Buscador del pie: texto claro sobre navy y borde con contraste suficiente */
.mb-footer-search .wp-block-search__input {
	background: transparent;
	color: #ffffff;
	border: 0;
	font-size: .95rem;
	padding: .6rem .8rem;
}
.mb-footer-search .wp-block-search__input::placeholder {
	color: #9db2d9;
	opacity: 1;
}
.mb-footer-search .wp-block-search__button {
	background: transparent;
	border: 0;
	color: #ffffff;
	fill: #ffffff;
	cursor: pointer;
}
.mb-footer-search .wp-block-search__input:focus-visible {
	outline: 3px solid #9db2d9;
	outline-offset: -1px;
}
