/*
Theme Name: Astra Child
Template: astra
Description: Tema hijo de Astra para la tienda de galletas
Version: 1.0.0
Text Domain: astra-child
*/

/* ==========================================================================
   Global
   ========================================================================== */

html { scroll-behavior: smooth; }

.entry-title {
	font-size: 3.75rem;
}

.ast-primary-header-bar {
	background-color: #F7F1EE;
}

#primary {
		margin: 0;
	}

p, .entry-content p {
    margin-bottom: 10px !important;
}

.cursive { font-family: 'Hurricane', "Square Peg", 'madelyn', cursive; }

/* ==========================================================================
   Página de catálogo
   ========================================================================== */

.woocommerce #content {
	margin-block: 4rem;
}

.ast-archive-entry-banner[data-post-type="product"] .ast-container h1 {
	font-size: 6.5rem;
}

.ast-archive-entry-banner[data-post-type="product"] .ast-container > *:last-child {
	font-family: "Square Peg", 'madelyn', cursive;
	font-size: 2.5rem;
}

.woocommerce ul.products, 
.woocommerce-page ul.products {
	column-gap: 3rem;
    row-gap: 0;
}

.woocommerce-js ul.products li.product .woocommerce-loop-product__title, 
.woocommerce-page ul.products li.product .woocommerce-loop-product__title {
	font-size: 2rem;
    line-height: 1;
}

.woocommerce-js ul.products li.product .button, .woocommerce-page ul.products li.product .button {
	letter-spacing: 1.5px;
    font-weight: 400;
	transform: scale(0.85);
}

.term-cookies .astra-shop-summary-wrap {
	margin-top: -2rem;
}

.ast-on-card-button {
	left: 50%;
    top: 35%;
    transform: translate(-50%, -50%);
	
	& .ahfb-svg-iconset {
		width: 3em;
		height: 3em;
	}
}

.ast-card-action-tooltip,
.woocommerce-js ul.products li.product .button,
.woocommerce-page ul.products li.product .button{
	display: none;
}

.ast-woo-product-category {
	text-transform: uppercase;
}

.galleta-descripcion {
	display: none;
}

/* Special cookies */

.astra-shop-thumbnail-wrap {
	mix-blend-mode: multiply;
}

/* ==========================================================================
   Página de producto
   ========================================================================== */

.single-product #content {
	margin-block: 4rem;
}

.woocommerce-tabs,
.woocommerce-js div.product .woocommerce-tabs,
.woocommerce-js div.product .product_title + .price {
	display: none;
}

.woocommerce-js div.product .product_title {
    line-height: 1;
}

.ast-left-sidebar {
	@media (min-width: 922px) {
		& #primary {
			width: 100%;
			border-left: 0;
			padding-left: 0;
		}

		& #secondary {
			display: none;
		}
	}
}

.woocommerce-product-gallery {
	mix-blend-mode: multiply;
}

.woocommerce-product-gallery .galleta-nombre {
	left: 50px;
    top: 7px;
	font-size: 4.5rem;
}

.related.products .galleta-nombre {
	right: 5px;
    top: 5px;
	font-size: 2.5rem;
}

.woocommerce-product-gallery__image {
	position: relative;

	& .galleta-nombre {
		pointer-events: none;
	}
}

.galleta-info {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 3rem;
	margin: 0 0 5rem;
	padding-top: 2.5rem;
	clear: both;
	
	.galleta-info__col {
		padding-left: 20%;
	}

	& h3 {
		margin: 0 0 8px;
		font-size: 2.125rem;
	}

	& p {
		margin: 0 0 16px;
	}

	@media (max-width: 768px) {
		grid-template-columns: 1fr;
		gap: 16px;
	}
}

.woocommerce-product-details__short-description {
	margin-bottom: 2.5rem;
}

.related.products h2 {
	padding-top: 4rem;
}

.related.products img {
    margin-bottom: 2.8em !important;
    mix-blend-mode: multiply;
}

.related.products .woocommerce-loop-product__title {
	font-size: 1.5rem !important;
}

.related.products .astra-shop-summary-wrap {
    margin-top: -3.5rem;
}

/* ==========================================================================
   Páginas individuales
   ========================================================================== */

.page-id-6370 {
	& header,
	& footer {
		display: none;
	}

	& #primary {
		margin: 0;
	}
}

/* home */

.page-id-3610 .products .ast-woo-product-category {
	display: none !important;
}

.page-id-3610 .products .galleta-nombre {
	right: 0 !important;
    top: 0 !important;
	left: auto;
}

.wp-block-spectra-container.wp-block-spectra-container.wp-block-spectra-container[data-spectra-id='092f9f8c']::after {
	transform: translate3d(14%, 14%, 0) scale(0.75);
}

[data-spectra-id="spectra-mg4k9h13-8y33ho"] img {
	width: 242px !important;
    height: 230px !important;
}

[data-spectra-id="spectra-mfku5uol-kdnz5e"] {
	--spectra-background-color: #f3ede6 !important;
}

.page-id-3610 .galleta-descripcion {
	display: block;
}

[data-spectra-id="spectra-ec5699e8-d3ff-45d4-b1a4-ec67d7f7171f"] {
	max-width: 16ch; 
}

/* ==========================================================================
   Nombre de la galleta sobre la imagen
   ========================================================================== */

.galleta-imagen {
	position: relative;
	display: block;
	mix-blend-mode: multiply;

	& img {
		display: block;
		width: 100%;
	}
}

.galleta-nombre {
	position: absolute;
	right: 20px;
	top: 20px;
	padding: 4px 14px;
	color: #B48F63;
	border-radius: 999px;
	font-family: 'Hurricane', "Square Peg", 'madelyn', cursive;
	font-weight: 400;
	font-size: 3.5rem;
	line-height: 1;
}

/* ==========================================================================
   Iconos de alérgenos + tooltip
   ========================================================================== */

.alergenos-iconos {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	list-style: none;
	padding: 0;
	margin: 12px 0;

	& img {
		width: 32px;
		height: 32px;
	}

	& li {
		position: relative;
		cursor: help;

		&::after {
			content: attr(data-tooltip);
			position: absolute;
			bottom: calc(100% + 8px);
			left: 50%;
			transform: translateX(-50%);
			padding: 4px 10px;
			background: #333;
			color: #fff;
			border-radius: 6px;
			font-size: 0.8rem;
			white-space: nowrap;
			opacity: 0;
			pointer-events: none;
			transition: opacity 0.15s;
			z-index: 10;
		}

		&:is(:hover, :focus)::after {
			opacity: 1;
		}
	}
}

/* ==========================================================================
   Footer
   ========================================================================== */

.site-footer .site-footer-primary-section-1 img {
	width: 200px;
}

.site-footer .site-footer-primary-section-1 p {
	color: var(--wp--preset--color--ast-global-color-0);
	font-family: 'Hurricane', "Square Peg", 'madelyn', cursive;
	font-size: 2rem;
}

.site-footer .site-footer-primary-section-1 p em {
	font-weight: 400 !important;
}

/* ==========================================================================
   Contacto
   ========================================================================== */


.srfm-block {
	margin-bottom: -2rem !important;
}