/* Bejjur layout fixes 2026-09-28: equal-height product cards (grid, category and homepage sliders). */

/* Photo area: always a square box; photo fitted inside without stretching the box */
.item-inner .images-container .image > a,
.item-inner .images-container > a.product-image {
	display: block;
	position: relative;
	width: 100%;
	aspect-ratio: 1 / 1;
	overflow: hidden;
}
.item-inner .images-container .image > a img,
.item-inner .images-container > a.product-image img {
	width: 100%;
	height: 100%;
	object-fit: contain;
}

/* Product name: always two lines tall; longer names end with "..." */
.item-inner .caption .product-name a {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	line-clamp: 2;
	overflow: hidden;
	line-height: 22px;
	height: 44px;
}

/* Price row: same height whether or not there is a struck-out old price */
.item-inner .caption .price-box {
	min-height: 26px;
}

/* List view keeps full names */
.product-list .item-inner .caption .product-name a {
	display: block;
	height: auto;
	-webkit-line-clamp: unset;
	line-clamp: unset;
}

/* Price row on one line (new price + struck-out old price), so narrow cards don't grow a second line */
.item-inner .caption .price-box {
	white-space: nowrap;
	overflow: hidden;
}
.item-inner .caption .price-box p {
	display: inline-block;
}
.item-inner .caption .price-box p.old-price .price {
	font-size: 13px;
}

/* Brand line above some product names (only a few products have it) made those cards taller */
.item-inner .caption .manufacture-product {
	display: none;
}

/* Pagination 2026-09-28: page sizes are 24/48/72/96 so rows always fill for 2, 3 or 4 per row.
   The 5-per-row option is removed; shoppers who had picked it earlier (remembered in their browser) now see 4 per row. */
.btn-custom-view.btn-grid-5 {
	display: none !important;
}
@media (min-width: 768px) {
	#content .product-layout.col-lg-divide-5 {
		width: 25% !important;
		clear: none !important;
	}
}

/* Top bar: centre the blue location button vertically with "My Account" / "Language" (bar 46px, button 34px) */
#top ul.box-right > .btn.btn-primary {
	vertical-align: top;
	margin-top: 6px;
	margin-bottom: 6px;
}