/* =========================================================
   Talabiah – WooCommerce Shop UI (Optimized & Scoped)
   Scope: Shop + Categories + Tags فقط
   ========================================================= */

body.woocommerce.archive {

    /* =====================================================
       Product Card – General
       ===================================================== */
    ul.products li.product {
        padding-bottom: 6px;
    }

    /* =====================================================
       Product Title
       ===================================================== */
    .woocommerce-loop-product__title {
        font-size: 15px;
        line-height: 1.5;
        color: #222;
        margin-bottom: 6px;
    }

    /* =====================================================
       Price Area
       ===================================================== */
    .price {
        font-size: 15px;
        line-height: 1.4;
        margin-bottom: 8px;
    }

    .price ins {
        color: #111;
        font-weight: 400;
        text-decoration: none;
    }

    .price del {
        color: #d63638;
        font-size: 13px;
        opacity: 1;
    }

    /* =====================================================
       Add to Cart Button
       ===================================================== */
    .button {
        margin-top: 6px;
        font-size: 14px;
        padding: 6px 12px;
    }
}


/* =========================================================
   Mobile Optimizations
   ========================================================= */

@media (max-width: 768px) {

    body.woocommerce.archive {

        /* Grid: Two Columns */
        ul.products {
            display: grid !important;
            grid-template-columns: repeat(2, 1fr) !important;
            gap: 10px !important;
        }

        ul.products li.product {
            width: 100% !important;
            margin: 0 !important;
        }

        ul.products li.product img {
            margin-bottom: 6px;
        }

        /* Price – One Line & Centered */
        .price {
            display: flex !important;
            align-items: center;
            justify-content: center !important;
            gap: 6px;
            white-space: nowrap;
            text-align: center;
        }

        .price ins {
            font-weight: 600;
        }

        /* Product Title Clamp */
        .woocommerce-loop-product__title {
            overflow: hidden;
            display: -webkit-box;
            -webkit-line-clamp: 2;
            -webkit-box-orient: vertical;
        }
    }
}