/*
Theme Name: Ducktoy Blocksy child
Author: Ducktoy
Author URI: https://ducktoy.es
Description: Child theme de Blocksy para Agencia Prestashop.
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: ducktoy-blocksy-child
Template: blocksy
*/

:root {
	--dt-amarillo: #ffda00;
	--dt-negro: #000000d1;
	--dt-grad-cabecera: linear-gradient(256deg, rgb(255, 218, 0) 4%, rgb(255, 255, 255) 85%);
}

/* ==========================================================================
   Cabecera
   ========================================================================== */

#header [data-row="middle"] {
	background: var(--dt-grad-cabecera);
}

/* El logo es un lockup horizontal muy ancho: sin tope se come la cabecera. */
#header [data-id="logo"] .site-logo-container img {
	max-width: 270px;
	height: auto;
}

/* Boton CONTACTO del menu principal: caja compacta, no a toda altura. */
#header .menu-boton {
	display: flex;
	align-items: center;
}

#header .menu-boton > a {
	height: auto;
	align-self: center;
	padding: 12px 20px;
	background-color: var(--dt-negro);
	color: #fff !important;
	border-radius: 0;
}

#header .menu-boton > a:hover,
#header .menu-boton > a:focus {
	background-color: var(--dt-amarillo);
	color: #000 !important;
}

/* ==========================================================================
   Pie
   ==========================================================================
   Sin estilos propios: el pie se configura desde Personalizar > Pie de pagina
   con las opciones nativas de Blocksy.
   ========================================================================== */

/* ==========================================================================
   Blog - listado (archive)
   ==========================================================================
   El orden de la tarjeta (imagen > categoria > titulo > extracto > meta) se
   controla de forma nativa en Personalizar > Blog > Card Options. Aqui solo
   quedan los ajustes que esa opcion no cubre.
   ========================================================================== */

.entries .entry-card {
	display: flex;
	flex-direction: column;
	height: 100%;
	transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.entries .entry-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 12px 28px rgba(0, 0, 0, 0.08);
}

/* La meta de autor y fecha se ancla al pie para que las tarjetas casen. */
.entries .entry-card .entry-meta:last-child {
	margin-top: auto;
	padding-top: 18px;
}

/*
 * PENDIENTE - Estas dos reglas duplican ajustes que YA existen en Blocksy
 * (Blog > Card Options > Title Font, y Single > Page Title Font), y que estan
 * correctamente guardados. No se aplican porque el Theme Style de Elementor
 * (.elementor-kit-25 h1/h2) se inyecta en TODO el sitio, no solo en las paginas
 * de Elementor, y gana en especificidad a la variable --theme-font-size con la
 * que Blocksy aplica sus tamanos.
 *
 * Se pueden borrar en cuanto se decida que sistema tipografico manda.
 */
.entries .entry-card .entry-title {
	font-size: clamp(1.25rem, 1.162rem + 0.376vw, 1.5rem); /* 20 -> 24 px */
	line-height: 1.3;
	font-weight: 600;
}

.single-post .page-title {
	font-size: clamp(1.625rem, 1.317rem + 1.315vw, 2.5rem); /* 26 -> 40 px */
	line-height: 1.15;
}

/* ==========================================================================
   Blog - entrada individual (single)
   ========================================================================== */

/* Ancho de lectura comodo: los articulos no se maquetan con Elementor. */
.single-post .entry-content {
	max-width: 760px;
	margin-inline: auto;
}

.single-post .entry-content p {
	margin-bottom: 1.5em;
	line-height: 1.75;
}

.single-post .entry-content h2 {
	margin-top: 1.8em;
	font-size: clamp(1.3125rem, 1.158rem + 0.657vw, 1.75rem); /* 21 -> 28 px */
	line-height: 1.25;
}

.single-post .entry-content h3 {
	margin-top: 1.4em;
	font-size: clamp(1.125rem, 1.037rem + 0.376vw, 1.375rem); /* 18 -> 22 px */
	line-height: 1.3;
}

.single-post .entry-content img,
.single-post .ct-featured-image img {
	border-radius: 8px;
}

/* ==========================================================================
   Animaciones (Animation Addons for Elementor)
   ========================================================================== */

/* Respetar a quien pide menos movimiento en su sistema. */
@media (prefers-reduced-motion: reduce) {

	[class*="wcf-starter-animations-"],
	[class*="wcf-starter-animations-"] .elementor-widget-container > * {
		animation: none !important;
		transition: none !important;
		opacity: 1 !important;
		transform: none !important;
		white-space: normal !important;
		width: auto !important;
		overflow: visible !important;
		clip-path: none !important;
	}
}
