/* Physioesthetics - base del tema.
   Tres casos permitidos: nivel de tema, lo que Elementor no expone y el articulo de blog.
   Marcado real con Astra + lienzo de constructor: no hay <main> util; el contenido va en
   #content.site-content, la cabecera en header.elementor-location-header y el pie en
   footer.elementor-location-footer, fuera de #content. */

/* [Elementor no lo expone] La ubicacion header no es un elemento de Elementor y no tiene panel:
   el sticky debe ir aqui, no en el contenedor interno, o la cabecera no se queda fija.
   position:sticky crea ademas el contexto que necesita el desplegable. */
header.elementor-location-header{position:sticky;top:0;z-index:999;}

/* [Elementor no lo expone] Elementor no ofrece position:static en el widget. Sin esto el
   desplegable se ancla al widget del menu y los items salen cortados por la derecha. */
header.elementor-location-header .elementor-widget-nav-menu{position:static;}
header.elementor-location-header .elementor-nav-menu--dropdown{left:0;right:0;width:100%;max-width:none;}

/* [Articulo de blog] Acabado de la casa, una sola vez y a nivel de tema, para que cualquier
   entrada futura salga bien escrita en el editor de siempre y sin clases. */
.single-post .entry-title{font-family:'Libre Franklin',sans-serif;font-weight:700;letter-spacing:-.02em;line-height:1.15;}
.single-post .entry-meta,.single-post .entry-meta *{font-size:14px;color:#55605F;}
.single-post .post-thumb img{width:100%;height:auto;display:block;}
.single-post .entry-content{font-size:17px;line-height:1.7;color:#16201F;}
.single-post .entry-content>*{margin-bottom:24px;}
/* Primer parrafo destacado automatico, sin necesidad de clases */
.single-post .entry-content>p:first-of-type{font-size:19px;line-height:1.6;color:#16201F;font-weight:400;}
.single-post .entry-content h2{font-family:'Libre Franklin',sans-serif;font-weight:600;font-size:23px;line-height:1.2;color:#16201F;margin:40px 0 8px;}
.single-post .entry-content h3{font-family:'Libre Franklin',sans-serif;font-weight:600;font-size:17px;line-height:1.3;color:#16201F;margin:32px 0 8px;}
.single-post .entry-content a{color:#0A7A84;text-decoration:underline;text-underline-offset:2px;}
.single-post .entry-content a:hover{color:#085F67;}
.single-post .entry-content ul,.single-post .entry-content ol{padding-left:22px;}
.single-post .entry-content li{margin-bottom:8px;}
.single-post .entry-content blockquote{margin:32px 0;padding:24px;background:#F2F5F5;border:0;border-left:2px solid #0A7A84;font-style:normal;color:#16201F;}
.single-post .entry-content blockquote p:last-child{margin-bottom:0;}
.single-post .entry-content table{width:100%;border-collapse:collapse;font-size:16px;}
.single-post .entry-content th,.single-post .entry-content td{padding:12px;border-bottom:1px solid #D9E1E0;text-align:left;}
.single-post .entry-content th{font-weight:600;background:#F2F5F5;}
.single-post .entry-content figure{margin:32px 0;}
.single-post .entry-content figcaption{font-size:14px;color:#55605F;padding-top:8px;}
.single-post .entry-content hr{border:0;border-top:1px solid #D9E1E0;margin:40px 0;}
.single-post .entry-content img{height:auto;}
@media(max-width:767px){
  .single-post .entry-content{font-size:16.5px;}
 .single-post .entry-content>p:first-of-type{font-size:18px;}
}
/* [Elementor no lo expone] El widget de menu no ofrece nowrap en su lista: sin esto los
   seis items se reparten en dos lineas al estrechar. */
header.elementor-location-header .elementor-nav-menu--main > ul.elementor-nav-menu{flex-wrap:nowrap;}
header.elementor-location-header .elementor-nav-menu--main .elementor-item{white-space:nowrap;}

/* [Elementor no lo expone] El widget de contenido dinamico no tiene control de margen para los
   titulos que trae el propio texto: H2 y H3 salian pegados al parrafo anterior en fichas y entradas. */
.elementor-widget-theme-post-content h2{margin:40px 0 8px;}
.elementor-widget-theme-post-content h3{margin:32px 0 8px;}
.elementor-widget-theme-post-content h2:first-child,.elementor-widget-theme-post-content h3:first-child{margin-top:0;}
.elementor-widget-theme-post-content p{margin:0 0 16px;}
.elementor-widget-theme-post-content ul,.elementor-widget-theme-post-content ol{margin:0 0 16px;padding-left:22px;}

/* [Elementor no lo expone] La galeria de producto no permite ocultar las miniaturas: sin esto
   quedan filas huerfanas y un hueco a la izquierda. Se muestra solo la imagen principal. */
.elementor-widget-woocommerce-product-images .flex-control-thumbs{display:none;}
.elementor-widget-woocommerce-product-images .woocommerce-product-gallery__image img{width:100%;height:520px;object-fit:cover;}

/* [Elementor no lo expone] Las columnas clasicas no anclan el ultimo elemento abajo, no estiran una imagen a la altura de la columna ni dejan que un mapa rellene el alto restante. Solo escritorio: en tablet y movil las columnas se apilan y mandan las alturas nativas. */
@media(min-width:768px){
.elementor-column.pe-tarjeta>.elementor-widget-wrap{flex-direction:column;flex-wrap:nowrap;align-content:stretch}
.elementor-column.pe-tarjeta>.elementor-widget-wrap>.elementor-element:last-child{margin-top:auto}
}
/* [Los widgets de listado no exponen anclaje] Entradas y productos: enlace y boton anclados abajo para que queden a la misma altura en toda la fila. */
.elementor-posts .elementor-post{display:flex;flex-direction:column}
.elementor-posts .elementor-post__text{display:flex;flex-direction:column;flex:1 1 auto}
.elementor-posts .elementor-post__read-more{margin-top:auto}

/* [Elementor no lo expone] Foto y mapa rellenan exactamente la altura de la columna vecina. El hijo va en absoluto dentro de un contenedor que crece por flex, porque la altura en porcentaje no se resuelve en esta cadena y el iframe caia a 150 px. Solo escritorio. */
@media(min-width:1025px){
.elementor-column.pe-foto>.elementor-widget-wrap,.elementor-column.pe-mapa>.elementor-widget-wrap{flex-direction:column;flex-wrap:nowrap;align-content:stretch;height:100%}
.pe-foto .elementor-widget.elementor-widget-image,.pe-mapa .elementor-widget.elementor-widget-google_maps{display:flex;flex-direction:column;flex:1 1 auto;min-height:0}
.pe-foto .elementor-widget.elementor-widget-image>.elementor-widget-container{position:relative;flex:1 1 auto;min-height:280px;height:auto}
.pe-foto .elementor-widget.elementor-widget-image .elementor-widget-container img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.pe-mapa .elementor-widget.elementor-widget-google_maps>.elementor-widget-container{display:flex;flex-direction:column;flex:1 1 auto;min-height:0;height:auto}
.pe-mapa .elementor-widget.elementor-widget-google_maps .elementor-custom-embed{position:relative;flex:1 1 auto;min-height:280px}
.pe-mapa .elementor-widget.elementor-widget-google_maps .elementor-custom-embed iframe{position:absolute;inset:0;width:100%;height:100%}
}

/* [El widget de productos no expone anclaje] Boton 'Leer mas' anclado abajo en toda la fila. */
.elementor-widget-woocommerce-archive-products ul.products li.product,.elementor-widget-woocommerce-products ul.products li.product{display:flex;flex-direction:column}
.elementor-widget-woocommerce-archive-products ul.products li.product .astra-shop-summary-wrap,.elementor-widget-woocommerce-products ul.products li.product .astra-shop-summary-wrap{display:flex;flex-direction:column;flex:1 1 auto;width:100%}
.elementor-widget-woocommerce-archive-products ul.products li.product .astra-shop-summary-wrap .button,.elementor-widget-woocommerce-products ul.products li.product .astra-shop-summary-wrap .button{margin-top:auto;align-self:flex-start}

/* [Nivel de tema] Icono de bolsa sobre la tarjeta: en catalogo no lleva a nada y Astra no lo expone. */
ul.products li.product .ast-on-card-button{display:none}


/* [El widget no lo expone] Imprime su propio titulo 'Productos relacionados' aunque se desactive; el rotulo lo pone la plantilla. */


/* [Elementor no lo expone] Columna lateral de la ficha: tarjeta arriba y los tres relacionados crecen para acabar donde acaba el texto. Las fotos van en flujo normal con altura minima (nunca absolute: con carga diferida se quedaban sin caja y no se pintaban). Solo escritorio. */
@media(min-width:1025px){
.elementor-column.pe-lateral>.elementor-widget-wrap{flex-direction:column;flex-wrap:nowrap;align-content:stretch;height:100%}
.pe-lateral .elementor-widget.elementor-widget-woocommerce-product-related{display:flex;flex-direction:column;flex:1 1 auto}
.pe-lateral .elementor-widget-woocommerce-product-related>.elementor-widget-container,.pe-lateral .elementor-widget-woocommerce-product-related section.products{display:flex;flex-direction:column;flex:1 1 auto}
.pe-lateral .elementor-widget-woocommerce-product-related ul.products{display:flex;flex-direction:column;flex:1 1 auto;gap:24px;margin:0;padding:0}
.pe-lateral .elementor-widget-woocommerce-product-related ul.products li.product{display:flex;flex-direction:column;flex:1 1 auto;width:100%;margin:0}
.pe-lateral .elementor-widget-woocommerce-product-related li.product .astra-shop-thumbnail-wrap{flex:1 1 auto;display:flex}
.pe-lateral .elementor-widget-woocommerce-product-related li.product .astra-shop-thumbnail-wrap a{display:flex;flex:1 1 auto}
.pe-lateral .elementor-widget-woocommerce-product-related li.product .astra-shop-thumbnail-wrap img{width:100%;min-height:160px;height:100%;object-fit:cover;display:block}
.pe-lateral .elementor-widget-woocommerce-product-related li.product .astra-shop-summary-wrap{flex:0 0 auto;padding-top:10px}
}
@media(max-width:1024px){.pe-lateral .elementor-widget-woocommerce-product-related li.product .astra-shop-thumbnail-wrap img{width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;display:block}}
.pe-lateral .elementor-widget-woocommerce-product-related section.products>h2{display:none}
.pe-lateral .elementor-widget-woocommerce-product-related li.product .button,.pe-lateral .elementor-widget-woocommerce-product-related li.product .ast-on-card-button{display:none}

/* [El widget no lo expone] Relacionados en movil: uno por linea, nunca 2+1. */
@media(max-width:767px){.pe-lateral .elementor-widget-woocommerce-product-related ul.products{display:flex;flex-direction:column;gap:24px}.pe-lateral .elementor-widget-woocommerce-product-related ul.products li.product{width:100%!important;margin:0}} /* pe-lateral-1col */

@media(max-width:1024px){ul.products li.product.tablet-align-center .astra-shop-summary-wrap .button,ul.products li.product.mobile-align-center .astra-shop-summary-wrap .button{align-self:center}}

/* [Elementor no lo expone] El widget divisor lleva 15px de relleno vertical propio que desiguala el aire alrededor del filete. */
.elementor-widget-divider .elementor-divider{padding-top:0;padding-bottom:0}

.elementor-widget-divider>.elementor-widget-container,.elementor-widget-divider .elementor-divider{padding-top:0;padding-bottom:0}

/* [Movil] Centrado del contenido largo de ficha y del listado de entradas: los widgets no lo exponen por dispositivo. */
@media(max-width:767px){.single-product .elementor-widget-theme-post-content,.single-product .elementor-widget-theme-post-content h2,.single-product .elementor-widget-theme-post-content li{text-align:center}.single-product .elementor-widget-theme-post-content ul{padding-left:0;list-style-position:inside}.elementor-posts .elementor-post__text,.elementor-posts .elementor-post__meta-data{text-align:center}.elementor-posts .elementor-post__read-more{align-self:center}}

/* [Movil] El disparador del menu de Astra queda pegado al texto del pie: Astra no expone su margen superior. */
@media(max-width:921px){.ast-mobile-menu-trigger-fill,.ast-mobile-menu-trigger-minimal,.ast-mobile-menu-trigger-outline,#ast-mobile-header .menu-toggle{margin-top:16px}}
/* [Movil] Primer parrafo de la ficha, centrado como el resto. */
@media(max-width:767px){.single-product .elementor-widget-woocommerce-product-short-description,.single-product .elementor-widget-woocommerce-product-short-description p{text-align:center}}

/* PE-TABLET-CENTRADO
   [Elementor no lo expone] Ni el contenido de entrada/ficha (theme-post-content), ni la
   descripcion corta de WooCommerce, ni las tarjetas del bucle de producto ofrecen alineacion
   por dispositivo; y el enlace de tarjeta necesita margin-top:auto para quedar anclado abajo. */
@media(max-width:1024px){
 .elementor-widget-theme-post-content,
 .elementor-widget-theme-post-content p,
 .elementor-widget-theme-post-content h2,
 .elementor-widget-theme-post-content h3,
 .elementor-widget-theme-post-content li,
 .elementor-widget-woocommerce-product-short-description,
 .elementor-widget-woocommerce-product-short-description p{text-align:center}
 .elementor-widget-theme-post-content ul,
 .elementor-widget-theme-post-content ol{padding-left:0;list-style-position:inside}
 .single-product .elementor-widget-woocommerce-product-images{margin-left:auto;margin-right:auto}
 ul.products li.product,
 ul.products li.product .woocommerce-loop-product__title,
 ul.products li.product .woocommerce-loop-product__link,
 ul.products li.product .product_meta,
 ul.products li.product .price,
 .elementor-widget-woocommerce-product-related ul.products li.product{text-align:center}
 ul.products li.product a.button,
 ul.products li.product .added_to_cart{margin-left:auto;margin-right:auto;display:table}
 .elementor-widget-container>.elementor-posts .elementor-post__text{text-align:center}
}

/* PE-FOTO-ALTA
   [Elementor no lo expone] La columna clasica estira su alto pero no lo transmite al widget, y
   un height:100% en la imagen se resuelve contra padres sin altura definida, asi que no surtia
   efecto. Con la envoltura como referencia y el widget ocupandola por completo, la foto toma la
   altura real de la fila. Acotado a las columnas marcadas: no afecta a las miniaturas de tarjeta. */
@media(min-width:768px){
 .elementor-column.pe-foto-alta{align-self:stretch}
 .elementor-column.pe-foto-alta>.elementor-widget-wrap{position:relative;display:block;padding:0;min-height:100%}
 .elementor-column.pe-foto-alta .elementor-widget-image{position:absolute;top:0;right:0;bottom:0;left:0;margin:0;width:auto}
 .elementor-column.pe-foto-alta .elementor-widget-image>.elementor-widget-container,
 .elementor-column.pe-foto-alta .elementor-widget-image figure,
 .elementor-column.pe-foto-alta .elementor-widget-image a{height:100%;margin:0}
 .elementor-column.pe-foto-alta .elementor-widget-image img{height:100%!important;width:100%!important;max-width:none;object-fit:cover;display:block}
}
}

/* PE-TABLET-2
   [Elementor no lo expone] Categoria del bucle de producto, descripcion corta de la ficha y
   boton del listado de entradas: ninguno ofrece alineacion por dispositivo. */
@media(max-width:1024px){
 ul.products li.product .pe-cat,
 ul.products li.product .posted_in,
 ul.products li.product .product_cat,
 .elementor-widget-woocommerce-products ul.products li.product *{text-align:center}
 .single-product .elementor-widget-woocommerce-product-short-description{max-width:560px;margin-left:auto;margin-right:auto}
 .single-product .elementor-widget-woocommerce-product-short-description,
 .single-product .elementor-widget-woocommerce-product-short-description *{text-align:center;text-wrap:pretty}
 .elementor-posts .elementor-post__read-more{align-self:center;margin-left:auto;margin-right:auto}
 .elementor-posts .elementor-post__meta-data{justify-content:center;text-align:center}
}

/* PE-TABLET-3 \u00b7 tablet vertical y movil horizontal
   [Elementor no lo expone] La miga de producto, la ficha de entrada, las tarjetas del bucle de
   tienda y el enlace del listado de entradas no propagan su alineacion por dispositivo. */
@media(max-width:1024px){
 /* 2 - tarjetas de tienda: categoria, titulo y enlace centrados */
 ul.products li.product,
 ul.products li.product .woocommerce-loop-product__title,
 ul.products li.product .price,
 ul.products li.product .pe-cat,
 ul.products li.product .product_meta,
 ul.products li.product a.button{text-align:center}
 ul.products li.product a.button{margin-left:auto;margin-right:auto;display:table}
 /* 3 - miga de la ficha */
 .single-product .woocommerce-breadcrumb{text-align:center}
 /* 4 - enlace del listado de entradas */
 .elementor-posts .elementor-post__read-more{display:block;width:100%;text-align:center;margin-left:auto;margin-right:auto}
 /* 5 - ficha de categoria y fecha del articulo */
 .elementor-widget-post-info .elementor-inline-items{justify-content:center}
 .elementor-widget-post-info .elementor-icon-list-items{align-items:center}
}

/* PE-TABLET-4 \u00b7 tablet vertical y movil horizontal
   Las tarjetas de la tienda las pinta Astra, no Elementor: el rotulo de categoria lleva su
   propia alineacion a la izquierda y no hay panel que la exponga por dispositivo. */
@media(max-width:1024px){
 .ast-woo-shop-archive .astra-shop-summary-wrap,
 .ast-woo-product-category,
 .astra-shop-summary-wrap .woocommerce-loop-product__title,
 .astra-shop-summary-wrap .price,
 .astra-shop-summary-wrap .ast-woo-shop-product-description{text-align:center}
 .ast-woo-product-category{display:block}
 .astra-shop-summary-wrap>a.button,
 .astra-shop-summary-wrap>.button{margin-left:auto;margin-right:auto;display:table}
}

/* PE-TABLET-5 \u00b7 el rotulo y el parrafo de la descripcion de ficha van dentro de un HTML propio */
@media(max-width:1024px){
 .single-product .woocommerce-product-details__short-description,
 .single-product .woocommerce-product-details__short-description h3,
 .single-product .woocommerce-product-details__short-description p{text-align:center;margin-left:auto;margin-right:auto}
}