/* ================================
   WRAPPER
================================ */
.ecoland-featured-wrapper {
    padding: 10px;
    position: relative;
    overflow-x: hidden; /* prevents page scroll */
}

/* TITLE */
.featured-title {
    text-align: center;
    color: #7fa44a;
    font-weight: 700;
    margin-bottom: 12px;
}

/* ================================
   SLIDER
================================ */
.ecoland-featured-slider {
    display: flex;
    gap: 12px;
    overflow-x: auto;
    scroll-behavior: smooth;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-x: contain;

    width: 100%;
    max-width: 100%;
}


.ecoland-featured-slider::-webkit-scrollbar {
    display: none;
}

/* ================================
   PRODUCT CARD (EQUAL HEIGHT)
================================ */
.product-card {
    box-sizing: border-box;
    background: #ffffff;
    border-radius: 10px;
    padding: 10px;
    border:1px solid #eeeeee;

    display: flex;
    flex-direction: column;
}

/* IMAGE AREA */
/* IMAGE WRAPPER */
.product-card .product-image {
    display: block;
    width: 100%;
    aspect-ratio: 3 / 4;
    max-height: 220px;
    overflow: hidden;
}

/* IMAGE */
.product-card .product-image img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}



/* TEXT */
.product-card h3 {
    font-size: 13px;
    margin: 6px 0;
}

.product-card .price {
    font-weight: 700;
    color: #2e7d32;
    margin-bottom: 6px;
}

/* ADD BUTTON */
.ecoland-add-btn {
    margin-top: auto; /* 🔥 keeps bottom aligned */
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: #7fa44a;
    color: #fff;
    border-radius: 8px;
    padding: 6px 10px;
    font-size: 13px;
    text-decoration: none;
}

.ecoland-add-btn .icon-cart {
    width: 18px;
    height: 18px;
    stroke: #fff;
}

/* META */
.meta-row {
    display: flex;
    justify-content: space-between;
    font-size: 11px;
    margin-top: 6px;
    color: #666;
}

/* ================================
   MOBILE → 2 CARDS (SWIPE)
================================ */
@media (max-width: 767px) {
    .product-card {
        flex: 0 0 calc(50% - 8px);
        padding: 8px;
    }
	
	 .product-card .product-image {
        max-height: 180px;   /* mobile */
    }

    .product-card h3 {
        font-size: 12px;
        line-height: 1.3;
    }

    .product-card .price {
        font-size: 13px;
    }

    .ecoland-add-btn {
        font-size: 12px;
        padding: 5px 8px;
    }
	
			.ecoland-desktop-arrows {
			position: absolute;
			top: 50%;
			left: 0;
			right: 0;
			transform: translateY(-50%);
			display: flex;
			justify-content: space-between;
			pointer-events: none;
			z-index: 5;
		   }

		  .ecoland-desktop-arrows button {
			pointer-events: auto;
			background: #093d21;
			border: 2px solid #fff;
			border-radius: 50%;
			width: 42px;
			height: 42px;
			cursor: pointer;
			display: flex;
			align-items: center;
			justify-content: center;
		}

  .ecoland-desktop-arrows svg {
        width: 18px;
        height: 18px;
        stroke: #fff;
        fill: none;
    }

	
}

/* ================================
   DESKTOP → 4 CARDS (ARROWS)
================================ */
@media (min-width: 768px) {
    .product-card {
        flex: 0 0 calc(25% - 9px);
    }

    .ecoland-desktop-arrows {
        position: absolute;
        top: 50%;
        left: 0;
        right: 0;
        transform: translateY(-50%);
        display: flex;
        justify-content: space-between;
        pointer-events: none;
    }

    .ecoland-desktop-arrows button {
        pointer-events: auto;
        background: #093d21;
        border: 2px solid #fff;
        border-radius: 50%;
        width: 42px;
        height: 42px;
        cursor: pointer;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .ecoland-desktop-arrows svg {
        width: 18px;
        height: 18px;
        stroke: #fff;
        fill: none;
    }
}