/*
 * SkySkin - Optimización Móvil v1.0.0
 * Ajustes conservadores: se aplican principalmente en tablet y celular.
 */

/* Base segura */
html {
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
    scroll-padding-top: 88px;
}

body.skyskin-mobile-ready {
    overflow-x: clip;
    overflow-wrap: anywhere;
}

body.skyskin-mobile-ready *,
body.skyskin-mobile-ready *::before,
body.skyskin-mobile-ready *::after {
    box-sizing: border-box;
}

body.skyskin-mobile-ready img,
body.skyskin-mobile-ready picture,
body.skyskin-mobile-ready video,
body.skyskin-mobile-ready canvas,
body.skyskin-mobile-ready svg {
    max-width: 100%;
}

body.skyskin-mobile-ready img,
body.skyskin-mobile-ready video {
    height: auto;
}

body.skyskin-mobile-ready iframe {
    max-width: 100%;
}

body.skyskin-mobile-ready a,
body.skyskin-mobile-ready button,
body.skyskin-mobile-ready input,
body.skyskin-mobile-ready select,
body.skyskin-mobile-ready textarea,
body.skyskin-mobile-ready summary,
body.skyskin-mobile-ready [role="button"] {
    touch-action: manipulation;
}

body.skyskin-mobile-ready :where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
    outline: 3px solid rgba(122, 51, 70, .42);
    outline-offset: 3px;
}

/* Tablas y contenido ancho */
.skyskin-table-scroll {
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
}

.skyskin-table-scroll > table {
    min-width: 640px;
    margin: 0;
}

/* Videos e incrustaciones */
body.skyskin-mobile-ready :where(.wp-block-embed__wrapper, .elementor-wrapper, .video-container) {
    position: relative;
    width: 100%;
    max-width: 100%;
}

body.skyskin-mobile-ready :where(.wp-block-embed.is-type-video, .elementor-widget-video) iframe {
    width: 100%;
    aspect-ratio: 16 / 9;
    height: auto;
}

/* Renderizado diferido de secciones inferiores en navegadores compatibles */
@supports (content-visibility: auto) {
    body.skyskin-device-mobile .skyskin-defer-section {
        content-visibility: auto;
        contain-intrinsic-size: auto 720px;
    }
}

/* Tablet y celular */
@media (max-width: 1024px) {
    html {
        scroll-padding-top: 76px;
    }

    body.skyskin-mobile-ready {
        width: 100%;
        min-width: 0;
    }

    body.skyskin-mobile-ready :where(
        .wp-site-blocks,
        .site,
        .site-content,
        #page,
        #content,
        main,
        .elementor,
        .elementor-section-wrap
    ) {
        width: 100%;
        max-width: 100%;
        min-width: 0;
    }

    body.skyskin-mobile-ready :where(
        .e-con,
        .e-con-inner,
        .elementor-container,
        .elementor-column,
        .elementor-widget-wrap,
        .wp-block-group,
        .wp-block-columns,
        .wp-block-column
    ) {
        min-width: 0;
        max-width: 100%;
    }

    /* Header y navegación */
    body.skyskin-mobile-ready header {
        max-width: 100%;
    }

    body.skyskin-mobile-ready :where(
        .custom-logo,
        .site-logo img,
        .wp-block-site-logo img,
        header img
    ) {
        max-height: 62px;
        width: auto;
        object-fit: contain;
    }

    body.skyskin-mobile-ready :where(
        .wp-block-navigation__responsive-container-open,
        .wp-block-navigation__responsive-container-close,
        .elementor-menu-toggle,
        .menu-toggle,
        .nav-toggle
    ) {
        min-width: 44px;
        min-height: 44px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }

    body.skyskin-mobile-ready .wp-block-navigation__responsive-container.is-menu-open {
        padding:
            calc(22px + env(safe-area-inset-top))
            max(20px, env(safe-area-inset-right))
            calc(24px + env(safe-area-inset-bottom))
            max(20px, env(safe-area-inset-left));
        overflow-y: auto;
        overscroll-behavior: contain;
    }

    body.skyskin-mobile-ready :where(
        .wp-block-navigation__responsive-container-content,
        .elementor-nav-menu--dropdown
    ) a {
        min-height: 48px;
        display: flex;
        align-items: center;
        line-height: 1.25;
    }

    body.skyskin-mobile-ready .elementor-nav-menu--dropdown {
        max-height: min(76dvh, 680px);
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
    }

    /* Tipografía adaptable */
    body.skyskin-mobile-ready h1 {
        font-size: clamp(2.05rem, 7.2vw, 3.25rem);
        line-height: 1.06;
        text-wrap: balance;
    }

    body.skyskin-mobile-ready h2 {
        font-size: clamp(1.7rem, 5.8vw, 2.55rem);
        line-height: 1.12;
        text-wrap: balance;
    }

    body.skyskin-mobile-ready h3 {
        font-size: clamp(1.28rem, 4.5vw, 1.8rem);
        line-height: 1.18;
        text-wrap: balance;
    }

    body.skyskin-mobile-ready :where(p, li, label, .elementor-widget-text-editor) {
        line-height: 1.62;
    }

    /* Botones y campos accesibles al tacto */
    body.skyskin-mobile-ready :where(
        .wp-element-button,
        .wp-block-button__link,
        .elementor-button,
        button,
        input[type="submit"],
        input[type="button"],
        .button,
        .wc-block-components-button
    ) {
        min-height: 46px;
    }

    body.skyskin-mobile-ready :where(
        input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
        select,
        textarea
    ) {
        width: 100%;
        max-width: 100%;
        min-height: 48px;
        font-size: 16px; /* evita zoom automático en iPhone */
        line-height: 1.35;
    }

    body.skyskin-mobile-ready textarea {
        min-height: 132px;
        resize: vertical;
    }

    body.skyskin-mobile-ready :where(
        .elementor-field-group,
        .wpforms-field,
        .wpcf7-form-control-wrap,
        .form-row
    ) {
        min-width: 0;
    }

    /* Imágenes y galerías */
    body.skyskin-mobile-ready :where(
        .wp-block-image,
        .elementor-widget-image,
        figure
    ) {
        max-width: 100%;
    }

    body.skyskin-mobile-ready :where(
        .wp-block-gallery,
        .gallery,
        .elementor-image-gallery
    ) img {
        width: 100%;
        object-fit: cover;
    }

    /* Comparadores antes/después */
    body.skyskin-mobile-ready :where(
        .before-after,
        .before-after-container,
        .skyskin-before-after,
        .skyskin-ba,
        [class*="before-after"]
    ) {
        width: 100%;
        max-width: 100%;
        min-height: 0;
        overflow: hidden;
    }

    body.skyskin-mobile-ready :where(
        .before-after,
        .before-after-container,
        .skyskin-before-after,
        .skyskin-ba,
        [class*="before-after"]
    ) img {
        width: 100%;
        height: auto;
        object-fit: cover;
    }

    body.skyskin-mobile-ready input[type="range"] {
        min-height: 44px;
    }

    /* Trustindex / reseñas de Google */
    body.skyskin-mobile-ready :where(
        .skyskin-trustindex-home,
        .ti-widget,
        [class*="trustindex"]
    ) {
        width: 100%;
        max-width: 100%;
        overflow: hidden;
    }

    body.skyskin-mobile-ready :where(
        .ti-widget-container,
        .ti-reviews-container,
        .ti-reviews-container-wrapper
    ) {
        max-width: 100% !important;
    }

    body.skyskin-mobile-ready .skyskin-trustindex-home {
        padding-inline:
            max(16px, env(safe-area-inset-left))
            max(16px, env(safe-area-inset-right));
    }

    /* WooCommerce */
    body.skyskin-mobile-ready.woocommerce :where(
        .woocommerce-notices-wrapper,
        .woocommerce-message,
        .woocommerce-info,
        .woocommerce-error
    ) {
        max-width: 100%;
    }

    body.skyskin-mobile-ready :where(
        .woocommerce div.product,
        .woocommerce-page div.product
    ) {
        max-width: 100%;
    }

    body.skyskin-mobile-ready :where(
        .woocommerce div.product div.images,
        .woocommerce div.product div.summary
    ) {
        width: 100%;
        float: none;
    }

    body.skyskin-mobile-ready :where(
        .woocommerce table.shop_table,
        .woocommerce-cart-form
    ) {
        max-width: 100%;
    }

    /* Botones flotantes sin tapar contenido */
    body.skyskin-mobile-ready :where(
        .joinchat,
        .floating-whatsapp,
        .whatsapp-float,
        [class*="whatsapp"][class*="float"]
    ) {
        bottom: max(16px, env(safe-area-inset-bottom)) !important;
        right: max(14px, env(safe-area-inset-right)) !important;
    }
}

/* Celular */
@media (max-width: 767px) {
    body.skyskin-mobile-ready {
        --skyskin-mobile-gutter: clamp(16px, 4.5vw, 22px);
    }

    body.skyskin-mobile-ready :where(
        main > .wp-block-group,
        main > .wp-block-cover,
        .elementor-top-section,
        .e-con.e-parent
    ) {
        max-width: 100%;
    }

    /* Espaciado más compacto sin aplastar el diseño */
    body.skyskin-mobile-ready :where(
        .wp-block-group,
        .wp-block-cover,
        .elementor-section,
        .e-con
    ) {
        scroll-margin-top: 82px;
    }

    body.skyskin-mobile-ready :where(
        .wp-block-columns:not(.is-not-stacked-on-mobile)
    ) {
        flex-direction: column;
    }

    body.skyskin-mobile-ready :where(
        .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column
    ) {
        flex-basis: 100% !important;
        width: 100%;
    }

    /* Clases de grillas propias de SkySkin */
    body.skyskin-mobile-ready :where(
        .skyskin-grid,
        .concern-grid,
        .concerns-grid,
        .treatments-grid,
        .results-grid,
        .posts-grid,
        .locations-grid,
        .services-grid,
        [class*="skyskin"][class*="grid"]
    ) {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    /* Acciones principales a ancho completo */
    body.skyskin-mobile-ready :where(
        .wp-block-buttons,
        .elementor-widget-button + .elementor-widget-button,
        .hero-actions,
        .cta-actions
    ) {
        gap: 12px;
    }

    body.skyskin-mobile-ready .wp-block-buttons:not(.is-content-justification-right) {
        align-items: stretch;
    }

    body.skyskin-mobile-ready .wp-block-buttons:not(.is-content-justification-right) > .wp-block-button {
        width: 100%;
    }

    body.skyskin-mobile-ready .wp-block-buttons:not(.is-content-justification-right) .wp-block-button__link {
        width: 100%;
        justify-content: center;
        text-align: center;
    }

    body.skyskin-mobile-ready :where(
        .hero-actions,
        .cta-actions
    ) > * {
        width: 100%;
    }

    body.skyskin-mobile-ready :where(
        .hero-actions,
        .cta-actions
    ) :where(a, button) {
        width: 100%;
        justify-content: center;
        text-align: center;
    }

    /* WooCommerce: dos productos por fila cuando entra, uno en pantallas chicas */
    body.skyskin-mobile-ready.woocommerce ul.products,
    body.skyskin-mobile-ready .woocommerce ul.products {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 16px;
    }

    body.skyskin-mobile-ready.woocommerce ul.products::before,
    body.skyskin-mobile-ready.woocommerce ul.products::after,
    body.skyskin-mobile-ready .woocommerce ul.products::before,
    body.skyskin-mobile-ready .woocommerce ul.products::after {
        display: none;
    }

    body.skyskin-mobile-ready.woocommerce ul.products li.product,
    body.skyskin-mobile-ready .woocommerce ul.products li.product {
        width: auto !important;
        margin: 0 !important;
        min-width: 0;
    }

    /* Footer */
    body.skyskin-mobile-ready footer :where(
        .wp-block-columns,
        .elementor-container,
        .footer-columns
    ) {
        row-gap: 24px;
    }

    body.skyskin-mobile-ready footer :where(a, button) {
        min-height: 42px;
    }

    /* Administración visible: evita que el header quede debajo de la barra */
    body.admin-bar.skyskin-mobile-ready .wp-block-navigation__responsive-container.is-menu-open {
        padding-top: calc(54px + env(safe-area-inset-top));
    }
}

/* Celular angosto */
@media (max-width: 480px) {
    body.skyskin-mobile-ready h1 {
        font-size: clamp(1.95rem, 9.2vw, 2.65rem);
    }

    body.skyskin-mobile-ready h2 {
        font-size: clamp(1.58rem, 7.4vw, 2.1rem);
    }

    body.skyskin-mobile-ready.woocommerce ul.products,
    body.skyskin-mobile-ready .woocommerce ul.products {
        grid-template-columns: minmax(0, 1fr);
    }

    body.skyskin-mobile-ready :where(
        .wp-element-button,
        .wp-block-button__link,
        .elementor-button,
        input[type="submit"],
        .button
    ) {
        width: 100%;
        justify-content: center;
        text-align: center;
    }
}

/* Respeta la preferencia del usuario y reduce trabajo gráfico */
@media (prefers-reduced-motion: reduce) {
    body.skyskin-mobile-ready *,
    body.skyskin-mobile-ready *::before,
    body.skyskin-mobile-ready *::after {
        scroll-behavior: auto !important;
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
    }
}

/* Impresión: no altera el documento */
@media print {
    .skyskin-table-scroll {
        overflow: visible;
    }
}