/* ============================================================
   ANNY — RESPONSIVE
   ============================================================
   Adaptación responsive global del sistema ANNY.

   RESPONSABILIDADES:
   - Desktop
   - Tablet
   - Mobile
   - Grid responsive
   - Catálogo responsive
   - Producto individual responsive
   - Menú responsive
   - Espaciados responsive
   - Tipografías responsive

   BREAKPOINTS:
   - Desktop  → > 1024px
   - Tablet   → 768px — 1024px
   - Mobile   → < 768px

   NOTA:
   Los selectores del catálogo respetan la estructura real:

   .woocommerce
       .anny-catalog
           ul.anny-grid.products
               li.anny-card.product
                   .anny-card__inner
                       .anny-card__top
                       .anny-card__information
                       .anny-card__footer

   NO USAR !important.
   ============================================================ */


/* ============================================================
   01 — TABLET
   768px — 1024px
   ============================================================ */

@media (min-width: 768px) and (max-width: 1024px) {


    /* ========================================================
       CATÁLOGO
       ======================================================== */

    .woocommerce .anny-catalog {

        width: 100%;

    }


    /* ========================================================
       GRID
       ======================================================== */

    .woocommerce
    .anny-catalog
    ul.anny-grid.products {

        grid-template-columns:
            repeat(2, minmax(0, 1fr));

        column-gap: 1.25rem;

        row-gap: 2rem;

    }


    /* ========================================================
       CELDA DEL GRID
       ======================================================== */

    .woocommerce
    .anny-catalog
    ul.anny-grid.products
    > li.anny-card.product {

        width: auto;

        min-width: 0;

    }


    /* ========================================================
       TARJETA INTERNA
       ======================================================== */

    .woocommerce
    .anny-catalog
    ul.anny-grid.products
    > li.anny-card.product
    .anny-card__inner {

        width: 100%;

        min-width: 0;

    }


    /* ========================================================
       INFORMACIÓN
       ======================================================== */

    .woocommerce
    .anny-catalog
    ul.anny-grid.products
    .anny-card__information {

        padding-top: .85rem;

    }


    /* ========================================================
       TÍTULO
       ======================================================== */

    .woocommerce
    .anny-catalog
    ul.anny-grid.products
    .anny-card__title {

        font-size: 1.15rem;

    }


    /* ========================================================
       DESCRIPCIÓN
       ======================================================== */

    .woocommerce
    .anny-catalog
    ul.anny-grid.products
    .anny-card__description {

        font-size: .78rem;

    }


    /* ========================================================
       PRECIO
       ======================================================== */

    .woocommerce
    .anny-catalog
    ul.anny-grid.products
    .anny-card__price {

        font-size: .9rem;

    }


    /* ========================================================
       IMÁGENES
       ======================================================== */

    .woocommerce
    .anny-catalog
    ul.anny-grid.products
    .anny-card__image {

        aspect-ratio: 1 / 1;

    }


    /* ========================================================
       MENÚ
       ======================================================== */

    .anny-menu > ul {

        justify-content: center;

    }


    .anny-menu > ul > li > a {

        min-height: 40px;

        padding:
            .6rem .8rem;

        font-size: .67rem;

    }
	.anny-toolbar {
    display: flex;
    align-items: flex-end;
    justify-content: center;
    gap: .5rem;
    width: 100%;
    margin: 0 0 2rem;
    padding: 1rem 0;
    border-top: 1px solid var(--anny-border);
    border-bottom: 1px solid var(--anny-border);
    background-color: var(--anny-white);
    box-sizing: border-box;
    flex-direction: column;
    flex-wrap: nowrap;
    align-content: center;
}


    /* ========================================================
       PRODUCTO INDIVIDUAL
       ======================================================== */

    body.single-product
    .woocommerce
    .product_title {

        font-size: clamp(
            1.9rem,
            4vw,
            2.6rem
        );

    }


    body.single-product
    .woocommerce
    .woocommerce-product-gallery {

        padding: 1rem;

    }


    body.single-product
    .woocommerce
    .woocommerce-product-gallery__image img {

        max-height: 560px;

    }


    body.single-product
    .woocommerce
    .flex-control-thumbs {

        gap: .55rem;

    }


    body.single-product
    .woocommerce
    .flex-control-thumbs li,
    body.single-product
    .woocommerce
    .flex-control-thumbs img {

        width: 64px;

        height: 64px;

    }


    body.single-product
    .woocommerce
    .summary {

        padding-top: .5rem;

    }


    body.single-product
    .woocommerce
    .summary .price {

        font-size: 1.1rem;

    }


    /* ========================================================
       TABS
       ======================================================== */

    body.single-product
    .woocommerce
    .woocommerce-tabs {

        margin-top: 3rem;

    }


}
/* ============================================================
   02 — MOBILE
   Hasta 767px
   ============================================================ */

@media (max-width: 767px) {


    /* ========================================================
       BASE
       ======================================================== */

    html {

        scroll-behavior: smooth;

    }


    body {

        font-size: .95rem;

        line-height: 1.6;

    }


    /* ========================================================
       CATÁLOGO
       ======================================================== */

    .woocommerce .anny-catalog {

        width: 100%;

    }


    /* ========================================================
       GRID
       ======================================================== */

    .woocommerce
    .anny-catalog
    ul.anny-grid.products {

        grid-template-columns:
            repeat(2, minmax(0, 1fr));

        column-gap: .8rem;

        row-gap: 1.75rem;

    }


    /* ========================================================
       CELDA
       ======================================================== */

    .woocommerce
    .anny-catalog
    ul.anny-grid.products
    > li.anny-card.product {

        width: auto;

        min-width: 0;

    }


    /* ========================================================
       TARJETA INTERNA
       ======================================================== */

    .woocommerce
    .anny-catalog
    ul.anny-grid.products
    > li.anny-card.product
    .anny-card__inner {

        width: 100%;

        min-width: 0;

    }


    /* ========================================================
       GALERÍA
       ======================================================== */

    .woocommerce
    .anny-catalog
    ul.anny-grid.products
    .anny-card__top {

        border-radius:
            var(--anny-radius);

    }


    /* ========================================================
       INFORMACIÓN
       ======================================================== */

    .woocommerce
    .anny-catalog
    ul.anny-grid.products
    .anny-card__information {

        padding-top: .7rem;

    }


    /* ========================================================
       IMAGEN
       ======================================================== */

    .woocommerce
    .anny-catalog
    ul.anny-grid.products
    .anny-card__image {

        aspect-ratio: 1 / 1;

    }


    /* ========================================================
       EVITAR ZOOM EN TOUCH
       ======================================================== */

    .woocommerce
    .anny-catalog
    ul.anny-grid.products
    > li.anny-card.product:hover
    .anny-card__image {

        transform: none;

    }


    /* ========================================================
       BADGES
       ======================================================== */

    .woocommerce
    .anny-catalog
    ul.anny-grid.products
    .anny-card__badge {

        top: 8px;

        left: 8px;

        min-height: 22px;

        padding:
            .3rem .5rem;

        font-size: .55rem;

    }


    /* ========================================================
       TÍTULO
       ======================================================== */

    .woocommerce
    .anny-catalog
    ul.anny-grid.products
    .anny-card__title {

        font-size: 1rem;

        line-height: 1.15;

    }


    /* ========================================================
       DESCRIPCIÓN
       ======================================================== */

    .woocommerce
    .anny-catalog
    ul.anny-grid.products
    .anny-card__description {

        margin-top: .35rem;

        font-size: .72rem;

        line-height: 1.45;

    }


    /* ========================================================
       PRECIO
       ======================================================== */

    .woocommerce
    .anny-catalog
    ul.anny-grid.products
    .anny-card__price {

        gap: .3rem;

        margin-top: .45rem;

        font-size: .78rem;

    }


    .woocommerce
    .anny-catalog
    ul.anny-grid.products
    .anny-card__price
    del {

        font-size: .68rem;

    }


    /* ========================================================
       META
       ======================================================== */

    .woocommerce
    .anny-catalog
    ul.anny-grid.products
    .anny-card__meta {

        margin-top: .45rem;

        font-size: .62rem;

    }


    /* ========================================================
       FOOTER
       ======================================================== */

    .woocommerce
    .anny-catalog
    ul.anny-grid.products
    .anny-card__footer {

        margin-top: .7rem;

        padding-top: 0;

    }


    /* ========================================================
       MENÚ
       ======================================================== */

    .anny-menu {

        width: 100%;

        overflow-x: auto;

        overflow-y: hidden;

        scrollbar-width: none;

    }


    .anny-menu::-webkit-scrollbar {

        display: none;

    }


    .anny-menu > ul {

        flex-wrap: nowrap;

        justify-content: flex-start;

        width: max-content;

        min-width: 100%;

    }


    .anny-menu > ul > li {

        flex: 0 0 auto;

    }


    .anny-menu > ul > li > a {

        min-height: 38px;

        padding:
            .55rem .75rem;

        font-size: .62rem;

        letter-spacing: .05em;

    }


    .anny-menu > ul > li > a::after {

        right: .75rem;

        left: .75rem;

    }


    .anny-menu > ul > li + li > a::before {

        display: none;

    }
	.anny-toolbar {
    display: flex;
    align-items: flex-end;
    justify-content: center;
    gap: .5rem;
    width: 100%;
    margin: 0 0 2rem;
    padding: 1rem 0;
    border-top: 1px solid var(--anny-border);
    border-bottom: 1px solid var(--anny-border);
    background-color: var(--anny-white);
    box-sizing: border-box;
    flex-direction: column;
    flex-wrap: wrap;
    align-content: center;
}


    /* ========================================================
       SUBMENÚ
       ======================================================== */

    .anny-menu .sub-menu {

        position: static;

        display: none;

        width: 100%;

        min-width: 0;

        margin: 0;

        border: 0;

        border-radius: 0;

        box-shadow: none;

        opacity: 1;

        visibility: visible;

        transform: none;

    }


    .anny-menu li:hover > .sub-menu {

        display: none;

    }


    /* ========================================================
       PRODUCTO INDIVIDUAL
       ======================================================== */

    body.single-product .woocommerce .product {

        width: 100%;

    }


    /* ========================================================
       GALERÍA PRODUCTO
       ======================================================== */

    body.single-product .woocommerce
    .woocommerce-product-gallery {

        padding: .75rem;

        border-radius:
            var(--anny-radius);

    }


    body.single-product .woocommerce
    .woocommerce-product-gallery__image img {

        width: 100%;

        max-height: 460px;

        border-radius:
            var(--anny-radius-sm);

    }


    /* ========================================================
       THUMBNAILS
       ======================================================== */

    body.single-product .woocommerce
    .flex-control-thumbs {

        display: flex;

        flex-wrap: nowrap;

        gap: .5rem;

        margin-top: .7rem;

        padding-bottom: .15rem;

        overflow-x: auto;

        overflow-y: hidden;

        scrollbar-width: none;

    }


    .woocommerce
    .flex-control-thumbs::-webkit-scrollbar {

        display: none;

    }
	    body.single-product .woocommerce
    .flex-control-thumbs li {

        flex: 0 0 58px;

        width: 58px;

    }


    body.single-product .woocommerce
    .flex-control-thumbs img {

        width: 58px;

        height: 58px;

        border-radius:
            var(--anny-radius-sm);

    }


    /* ========================================================
       SUMMARY
       ======================================================== */

    body.single-product .woocommerce
    .summary {

        width: 100%;

        padding-top: 1.5rem;

    }


    /* ========================================================
       TÍTULO PRODUCTO
       ======================================================== */

    body.single-product .woocommerce
    .product_title {

        margin-bottom: .6rem;

        font-size:
            clamp(
                1.8rem,
                8vw,
                2.3rem
            );

        line-height: 1.08;

    }


    /* ========================================================
       PRECIO PRODUCTO
       ======================================================== */

    body.single-product .woocommerce
    .summary
    .price {

        margin-bottom: 1.1rem;

        font-size: 1.05rem;

    }


    /* ========================================================
       DESCRIPCIÓN PRODUCTO
       ======================================================== */

    body.single-product .woocommerce
    .woocommerce-product-details__short-description {

        margin-bottom: 1.25rem;

        font-size: .88rem;

        line-height: 1.65;

    }


    /* ========================================================
       VARIACIONES
       ======================================================== */

    body.single-product .woocommerce
    .variations_form {

        margin-top: 1.25rem;

    }


    body.single-product .woocommerce
    .variations tr {

        margin-bottom: 1rem;

    }


    body.single-product .woocommerce
    .variations th.label
    label {

        font-size: .65rem;

    }


    body.single-product .woocommerce
    .variations select {

        min-height: 44px;

        font-size: .78rem;

    }


    /* ========================================================
       CANTIDAD
       ======================================================== */

    body.single-product .woocommerce
    .quantity {

        margin-bottom: .75rem;

    }


    body.single-product .woocommerce
    .quantity .qty {

        width: 68px;

        min-height: 44px;

        font-size: .85rem;

    }


    /* ========================================================
       AÑADIR AL CARRITO
       ======================================================== */

    body.single-product .woocommerce
    .single_add_to_cart_button {

        width: 100%;

        min-height: 48px;

        padding:
            .75rem 1rem;

        font-size: .7rem;

    }


    /* ========================================================
       STOCK
       ======================================================== */

    body.single-product .woocommerce
    .stock {

        margin-bottom: .75rem;

        font-size: .7rem;

    }


    /* ========================================================
       META
       ======================================================== */

    body.single-product .woocommerce
    .product_meta {

        margin-top: 1.25rem;

        padding-top: 1rem;

        font-size: .67rem;

    }


    /* ========================================================
       TABS
       ======================================================== */

    body.single-product .woocommerce
    .woocommerce-tabs {

        margin-top: 2.5rem;

    }


    body.single-product .woocommerce
    .woocommerce-tabs ul.tabs {

        display: flex;

        gap: 0;

        margin-bottom: 1.5rem;

        overflow-x: auto;

        flex-wrap: nowrap;

        scrollbar-width: none;

    }


    body.single-product .woocommerce
    .woocommerce-tabs ul.tabs::-webkit-scrollbar {

        display: none;

    }


    body.single-product .woocommerce
    .woocommerce-tabs ul.tabs li {

        flex: 0 0 auto;

    }


    body.single-product .woocommerce
    .woocommerce-tabs ul.tabs li a {

        padding:
            .65rem .75rem;

        font-size: .62rem;

        white-space: nowrap;

    }


    /* ========================================================
       CONTENIDO TABS
       ======================================================== */

    body.single-product .woocommerce
    .woocommerce-Tabs-panel {

        font-size: .84rem;

        line-height: 1.65;

    }


    body.single-product .woocommerce
    .woocommerce-Tabs-panel h2 {

        font-size: 1.45rem;

    }


    /* ========================================================
       ATRIBUTOS
       ======================================================== */

    body.single-product .woocommerce
    .shop_attributes th,
    body.single-product .woocommerce
    .shop_attributes td {

        padding: .65rem .4rem;

        font-size: .78rem;

    }


    /* ========================================================
       RELATED / UPSELLS
       ======================================================== */

    body.single-product .woocommerce
    .related,
    body.single-product .woocommerce
    .upsells {

        margin-top: 2.75rem;

    }


    body.single-product .woocommerce
    .related h2,
    body.single-product .woocommerce
    .upsells h2 {

        margin-bottom: 1.25rem;

        font-size: 1.7rem;

    }

}
/* ============================================================
   03 — MOBILE PEQUEÑO
   Hasta 480px
   ============================================================ */

@media (max-width: 480px) {


    /* ========================================================
       GRID
       ======================================================== */

    body.woocommerce
    .anny-catalog
    ul.anny-grid.products {

        column-gap: .65rem;

        row-gap: 1.5rem;

    }


    /* ========================================================
       TÍTULO TARJETA
       ======================================================== */

    body.woocommerce
    .anny-catalog
    ul.anny-grid.products
    .anny-card__title {

        font-size: .92rem;

    }


    /* ========================================================
       DESCRIPCIÓN
       ======================================================== */

    body.woocommerce
    .anny-catalog
    ul.anny-grid.products
    .anny-card__description {

        font-size: .68rem;

    }


    /* ========================================================
       PRECIO
       ======================================================== */

    body.woocommerce
    .anny-catalog
    ul.anny-grid.products
    .anny-card__price {

        font-size: .74rem;

    }


    /* ========================================================
       BADGES
       ======================================================== */

    body.woocommerce
    .anny-catalog
    ul.anny-grid.products
    .anny-card__badge {

        top: 6px;

        left: 6px;

        min-height: 20px;

        padding: .25rem .4rem;

        font-size: .5rem;

    }


    /* ========================================================
       MENÚ
       ======================================================== */

    .anny-menu > ul > li > a {

        padding-left: .65rem;

        padding-right: .65rem;

        font-size: .58rem;

    }


    /* ========================================================
       GALERÍA PRODUCTO
       ======================================================== */

    body.woocommerce.single-product
    .woocommerce-product-gallery {

        padding: .5rem;

    }


    body.woocommerce.single-product
    .woocommerce-product-gallery__image img {

        max-height: 380px;

    }


    body.woocommerce.single-product
    .flex-control-thumbs li {

        flex-basis: 52px;

    }


    body.woocommerce.single-product
    .flex-control-thumbs img {

        width: 52px;

        height: 52px;

    }


    /* ========================================================
       SUMMARY
       ======================================================== */

    body.woocommerce.single-product
    .summary {

        padding-top: 1.25rem;

    }


    /* ========================================================
       TÍTULO
       ======================================================== */

    body.woocommerce.single-product
    .product_title {

        font-size: clamp(
            1.65rem,
            8vw,
            2rem
        );

    }


    /* ========================================================
       PRECIO
       ======================================================== */

    body.woocommerce.single-product
    .summary .price {

        font-size: 1rem;

    }


    /* ========================================================
       VARIACIONES
       ======================================================== */

    body.woocommerce.single-product
    .variations select {

        min-height: 42px;

    }


    /* ========================================================
       BOTÓN
       ======================================================== */

    body.woocommerce.single-product
    .single_add_to_cart_button {

        min-height: 46px;

    }

}


/* ============================================================
   04 — TOUCH DEVICES
   ============================================================ */

@media (hover: none) and (pointer: coarse) {


    /* ========================================================
       CATÁLOGO — SIN HOVER
       ======================================================== */

    body.woocommerce
    .anny-catalog
    ul.anny-grid.products
    > li.anny-card.product:hover {

        z-index: auto;

    }


    body.woocommerce
    .anny-catalog
    ul.anny-grid.products
    > li.anny-card.product:hover
    .anny-card__image {

        transform: none;

    }


    body.woocommerce
    .anny-catalog
    ul.anny-grid.products
    > li.anny-card.product:hover
    .anny-card__image--secondary {

        opacity: 0;

    }


    /* ========================================================
       GALERÍA PRODUCTO
       ======================================================== */

    body.woocommerce.single-product
    .woocommerce-product-gallery__image a:hover img {

        transform: none;

    }


    body.woocommerce.single-product
    .flex-control-thumbs img:hover {

        transform: none;

    }


    /* ========================================================
       BOTÓN PRODUCTO
       ======================================================== */

    body.woocommerce.single-product
    .single_add_to_cart_button:hover {

        transform: none;

        box-shadow: none;

    }

}