/* Grid uses YOOtheme's native responsive fields. WooCommerce Products receives
   the responsive columns and list presentation missing from its native type. */
.yt-plus-catalog-woo {
    --yt-plus-catalog-columns: 4;
    --yt-plus-catalog-image-width: 33%;
    --yt-plus-catalog-gap: 20px;
}

.yt-plus-catalog-woo ul.products {
    display: grid !important;
    grid-template-columns: repeat(var(--yt-plus-catalog-columns), minmax(0, 1fr));
    gap: var(--yt-plus-catalog-gap) !important;
}

.yt-plus-catalog-woo ul.products::before,
.yt-plus-catalog-woo ul.products::after { display: none !important; }

.yt-plus-catalog-woo ul.products > li.product {
    width: auto !important;
    min-width: 0;
    margin: 0 !important;
    float: none !important;
    box-sizing: border-box;
}

.yt-plus-catalog-woo[data-yt-plus-equal-height="1"][data-yt-plus-catalog-current="grid"] ul.products > li.product {
    display: flex;
    flex-direction: column;
}

.yt-plus-catalog-woo[data-yt-plus-equal-height="1"][data-yt-plus-catalog-current="grid"] ul.products > li.product > .button {
    margin-top: auto;
}

.yt-plus-catalog-woo[data-yt-plus-image-ratio="square"] ul.products > li.product img { aspect-ratio: 1 / 1; }
.yt-plus-catalog-woo[data-yt-plus-image-ratio="landscape"] ul.products > li.product img { aspect-ratio: 4 / 3; }
.yt-plus-catalog-woo[data-yt-plus-image-ratio="portrait"] ul.products > li.product img { aspect-ratio: 3 / 4; }

.yt-plus-catalog-woo:not([data-yt-plus-image-ratio="auto"]) ul.products > li.product img {
    width: 100%;
    height: auto;
    object-fit: cover;
}

.yt-plus-catalog-woo[data-yt-plus-image-fit="contain"] ul.products > li.product img { object-fit: contain; }

.yt-plus-catalog-woo[data-yt-plus-catalog-current="list"] ul.products {
    grid-template-columns: minmax(0, 1fr);
}

.yt-plus-catalog-woo[data-yt-plus-catalog-current="list"] ul.products > li.product {
    display: grid;
    grid-template-columns: var(--yt-plus-catalog-image-width) minmax(0, 1fr);
    column-gap: var(--yt-plus-catalog-gap);
    align-items: start;
}

.yt-plus-catalog-woo[data-yt-plus-catalog-current="list"][data-yt-plus-list-vertical-align="center"] ul.products > li.product {
    align-items: center;
}

.yt-plus-catalog-woo[data-yt-plus-catalog-current="list"] ul.products > li.product > a.woocommerce-LoopProduct-link {
    display: grid;
    grid-column: 1 / -1;
    grid-template-columns: var(--yt-plus-catalog-image-width) minmax(0, 1fr);
    column-gap: var(--yt-plus-catalog-gap);
    align-items: inherit;
}

.yt-plus-catalog-woo[data-yt-plus-catalog-current="list"] ul.products > li.product > a.woocommerce-LoopProduct-link > img {
    grid-row: 1 / span 20;
    grid-column: 1;
    margin: 0 !important;
}

.yt-plus-catalog-woo[data-yt-plus-catalog-current="list"] ul.products > li.product > a.woocommerce-LoopProduct-link > :not(img) {
    grid-column: 2;
}

.yt-plus-catalog-woo[data-yt-plus-catalog-current="list"] ul.products > li.product > :not(a.woocommerce-LoopProduct-link) {
    grid-column: 2;
    min-width: 0;
}

.yt-plus-catalog-woo[data-yt-plus-catalog-current="list"][data-yt-plus-list-image-align="right"] ul.products > li.product,
.yt-plus-catalog-woo[data-yt-plus-catalog-current="list"][data-yt-plus-list-image-align="right"] ul.products > li.product > a.woocommerce-LoopProduct-link {
    grid-template-columns: minmax(0, 1fr) var(--yt-plus-catalog-image-width);
}

.yt-plus-catalog-woo[data-yt-plus-catalog-current="list"][data-yt-plus-list-image-align="right"] ul.products > li.product > a.woocommerce-LoopProduct-link > img {
    grid-column: 2;
}

.yt-plus-catalog-woo[data-yt-plus-catalog-current="list"][data-yt-plus-list-image-align="right"] ul.products > li.product > a.woocommerce-LoopProduct-link > :not(img),
.yt-plus-catalog-woo[data-yt-plus-catalog-current="list"][data-yt-plus-list-image-align="right"] ul.products > li.product > :not(a.woocommerce-LoopProduct-link) {
    grid-column: 1;
}

.yt-plus-catalog-woo[data-yt-plus-catalog-current="list"][data-yt-plus-list-divider="1"] ul.products > li.product {
    padding-bottom: var(--yt-plus-catalog-gap);
    border-bottom: 1px solid color-mix(in srgb, currentColor 16%, transparent);
}

/* In the mobile tier the optional stacked treatment avoids unusably narrow
   text columns even when the adaptive/list presentation is active. */
.yt-plus-catalog-woo[data-yt-plus-catalog-current="list"][data-yt-plus-catalog-tier="mobile"][data-yt-plus-mobile-image-top="1"] ul.products > li.product,
.yt-plus-catalog-woo[data-yt-plus-catalog-current="list"][data-yt-plus-catalog-tier="mobile"][data-yt-plus-mobile-image-top="1"] ul.products > li.product > a.woocommerce-LoopProduct-link {
    display: block;
}

.yt-plus-catalog-woo[data-yt-plus-catalog-current="list"][data-yt-plus-catalog-tier="mobile"][data-yt-plus-mobile-image-top="1"] ul.products > li.product > a.woocommerce-LoopProduct-link > img {
    width: 100%;
    margin-bottom: 12px !important;
}

@media (prefers-reduced-motion: reduce) {
    .yt-plus-catalog-woo ul.products,
    .yt-plus-catalog-woo ul.products > li.product { transition: none !important; }
}