/*
Theme Name: Ecomall Child
Theme URI: https://demo.theme-sky.com/ecomall/
Author: Theme Sky Team
Author URI: http://theme-sky.com/
Description: A Premium and Responsive WordPress theme, designed for E-Commerce websites
Template: ecomall
Version: 1.0.1
License: GNU General Public License v2 or later
License URI:  http://www.gnu.org/licenses/gpl-2.0.html
Tags: two-columns, left-sidebar, custom-background, custom-colors, custom-header, custom-menu, editor-style, featured-images, microformats, post-formats, rtl-language-support, sticky-post, threaded-comments, translation-ready
Text Domain: ecomall-child
*/

/* ============================================================================
   PRODUCT CARDS: Fixed Heights to Prevent Grid Jumping
   ========================================================================= */

/**
 * Fix product card layout inconsistencies
 * - Title: fixed 2 lines height (even if text is shorter)
 * - SKU: fixed 1 line with ellipsis
 * - Article: fixed 1 line with ellipsis
 * This ensures all cards have the same height and grid doesn't jump
 */

/* Product title - ALWAYS 2 lines height */
.products .product .product-name,
.products .product h3.product-name,
.products .product .woocommerce-loop-product__title {
    /* Fix height for exactly 2 lines */
    min-height: 2.8em;
    /* ~2 lines with line-height 1.4 */
    max-height: 2.8em;
    line-height: 1.4;

    /* Show ellipsis if text overflows */
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    /* Standard property for compatibility */
    /* Limit to 2 lines */
    -webkit-box-orient: vertical;

    /* Ensure consistent spacing */
    margin-bottom: 8px !important;
}

/* SKU - ALWAYS 1 line */
.products .product .sku-wrapper {
    /* Fix height for exactly 1 line */
    display: flex;
    align-items: center;
    min-height: 1.4em;
    max-height: 1.4em;
    line-height: 1.4;

    /* Show ellipsis if text overflows */
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;

    /* Ensure consistent spacing */
    margin-bottom: 4px !important;
}

.products .product .sku-wrapper > span {
    white-space: nowrap;
}

.products .product .sku-wrapper .sku {
    display: inline-block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Article (Артикул) - ALWAYS 1 line */
.products .product .product-meta,
.products .product .posted_in {
    /* Fix height for exactly 1 line per meta item */
    line-height: 1.4;

    /* Ensure each line doesn't wrap */
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;

    /* Ensure consistent spacing */
    margin-bottom: 4px !important;
}

/* Ensure product info section has consistent height */
.products .product .product-info,
.products .product .product-wrapper {
    display: flex;
    flex-direction: column;
}

/* Product image container - ensure consistent aspect ratio */
.products .product .product-image,
.products .product .wp-post-image {
    aspect-ratio: 1 / 1;
    /* Square images */
    object-fit: cover;
    width: 100%;
    height: auto;
}

/* ============================================================================
   GENERIC SELECTORS: Apply same fixes to search results and other pages
   ========================================================================= */

/* Generic product title - ALWAYS 2 lines */
.product .product-name,
.product h3.product-name,
.product .woocommerce-loop-product__title,
.woocommerce-loop-product__title,
.product a>h2 {
    min-height: 2.8em !important;
    max-height: 2.8em !important;
    line-height: 1.4 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    margin-bottom: 8px !important;
}

/* Generic SKU - ALWAYS 1 line */
.product .sku-wrapper,
.product .product-sku {
    display: flex !important;
    align-items: center !important;
    min-height: 1.4em !important;
    max-height: 1.4em !important;
    line-height: 1.4 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    margin-bottom: 4px !important;
}

.product .sku-wrapper > span,
.product .product-sku > span {
    white-space: nowrap !important;
}

.product .sku-wrapper .sku,
.product .product-sku .sku {
    display: inline-block !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    margin-bottom: 0 !important;
    max-height: 1.4em !important;
    padding-left: 4px; /* spacing between label and SKU */
}

/* Generic Article - ALWAYS 1 line */
.product .product-meta,
.product .posted_in {
    line-height: 1.4 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    margin-bottom: 4px !important;
}

/* Generic Images - ALWAYS Square */
.product .product-image img,
.product .wp-post-image,
.woocommerce-loop-product__link img {
    aspect-ratio: 1 / 1 !important;
    object-fit: cover !important;
    width: 100% !important;
    height: auto !important;
}

/* Article loop container - prevent wrapping */
.product-article-loop,
.product-sku.product-article-loop {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    overflow: hidden !important;
    max-width: 100% !important;
    line-height: 1.4 !important;
    margin-bottom: 4px !important;
}

/* Article loop - label stays inline */
.product-article-loop>span:first-child {
    flex-shrink: 0 !important;
    white-space: nowrap !important;
    margin-right: 4px !important;
}

/* Article loop - SKU value gets ellipsis */
.product-article-loop>span.sku {
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    flex-shrink: 1 !important;
    min-width: 0 !important;
}


/* Hide browser number spin-buttons on all devices */
input[type=number].qty::-webkit-inner-spin-button,
input[type=number].qty::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
input[type=number].qty {
  -moz-appearance: textfield;
}