/**
 * Modern Product Cards — OPC070174-1
 * ------------------------------------------------
 * product_list.tpl + product_list_module.tpl
 * .pcard sınıflarıyla görünümü modernleştirir.
 *
 * Geri alma: header.tpl içindeki product-card-modern.css
 * satırını kaldırın.
 * ------------------------------------------------
 */

:root {
	--pc-blue: #1e5fbf;
	--pc-blue-deep: #1455a9;
	--pc-blue-soft: #408de4;
	--pc-yellow: #ffd200;
	--pc-ink: #1b1b1b;
	--pc-muted: #5c6570;
	--pc-line: #e8ecf1;
	--pc-surface: #ffffff;
	--pc-soft: #f4f6f8;
	--pc-radius: 12px;
	--pc-shadow: 0 4px 16px rgba(20, 40, 80, 0.07);
	--pc-shadow-hover: 0 10px 28px rgba(20, 40, 80, 0.12);
	--pc-transition: 0.22s ease;
}

/* ========== Layout shells ========== */
.module-lister.product-layout.product-grid,
.product-listgrid .product-layout.product-grid {
	border: none !important;
	background: transparent !important;
	padding: 6px !important;
	margin: 0 0 10px !important;
	border-radius: 0 !important;
}

.product-listgrid .product-layout.product-grid:hover {
	border: none !important;
}

.carouselss .module-lister {
	width: 100% !important;
	float: none;
	padding: 6px !important;
	margin: 0 !important;
	border: none !important;
	background: transparent !important;
}

.product-listgrid .product-layout.product-list {
	border: none !important;
	background: transparent !important;
	padding: 6px !important;
	margin: 0 0 12px !important;
	float: none !important;
	width: 100% !important;
}

/* ========== Card shell ========== */
.pcard.product-block,
.product-block.pcard {
	background: var(--pc-surface) !important;
	border: 1px solid var(--pc-line) !important;
	border-radius: var(--pc-radius) !important;
	box-shadow: var(--pc-shadow);
	overflow: hidden;
	margin: 0 !important;
	padding: 0 !important;
	transition: box-shadow var(--pc-transition), border-color var(--pc-transition), transform var(--pc-transition);
}

.pcard:hover,
#content .product-carousel .pcard:hover,
#content .box-product .pcard:hover,
#content .product-listgrid .pcard:hover {
	border-color: rgba(30, 95, 191, 0.28) !important;
	box-shadow: var(--pc-shadow-hover);
	transform: translateY(-2px);
	overflow: hidden;
}

.pcard__inner,
.product-block-inner.pcard__inner,
#content .box-product .pcard__inner,
#content .product-carousel .pcard__inner,
#content .product-listgrid .pcard__inner {
	display: flex;
	flex-direction: column;
	height: 100%;
	padding: 0 !important;
	margin: 0 !important;
	overflow: hidden;
	position: relative;
}

/* List view: horizontal card */
.product-layout.product-list .pcard__inner {
	flex-direction: row;
	align-items: stretch;
}

.product-layout.product-list .pcard__media {
	flex: 0 0 200px;
	width: 200px;
	max-width: 36%;
}

.product-layout.product-list .pcard__body {
	flex: 1 1 auto;
	justify-content: center;
	min-width: 0;
}

/* ========== Media ========== */
.pcard__media,
.pcard .image {
	position: relative;
	background: linear-gradient(180deg, #f7f9fb 0%, #eef2f6 100%);
	min-height: 0 !important;
	padding: 16px 16px 8px;
	text-align: center;
	float: none !important;
}

.pcard__img-link {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 180px;
	height: 180px;
}

.product-layout.product-list .pcard__img-link {
	min-height: 160px;
	height: 160px;
}

.pcard__img-link .bayi-icon {
	opacity: 1;
	z-index: 1;
}

.pcard__img-link img,
.pcard .image img,
.product-grid .pcard .product-block-inner a img {
	height: 160px !important;
	width: auto !important;
	max-width: 100%;
	object-fit: contain;
	margin: 0 auto;
	transition: transform var(--pc-transition);
}

.product-layout.product-list .pcard__img-link img {
	height: 140px !important;
}

.pcard:hover .pcard__img-link img {
	transform: scale(1.04);
}

/* ========== Badges ========== */
.pcard__badge.pinfo,
.pcard .pinfo {
	top: 10px;
	right: 10px;
	left: auto;
	z-index: 2;
	padding: 4px 9px;
	border-radius: 999px;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.01em;
	line-height: 1.2;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
}

.pcard__badge.pgreen { background: #0f9d8a; }
.pcard__badge.pblue { background: #4a6fa5; }
.pcard__badge.pred { background: #c44b4b; }
.pcard__badge.porange { background: #d9891a; }

.pcard__ship,
.pcard .free-ship.pcard__ship {
	position: absolute;
	left: 10px;
	bottom: 10px;
	z-index: 2;
	padding: 4px 8px;
	border-radius: 6px;
	background: rgba(15, 157, 138, 0.95) !important;
	color: #fff !important;
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0.02em;
	text-transform: uppercase;
	border: none;
}

.pcard__sale {
	position: absolute;
	left: 10px;
	top: 10px;
	z-index: 2;
	padding: 4px 8px;
	border-radius: 6px;
	background: var(--pc-yellow);
	color: var(--pc-ink);
	font-size: 10px;
	font-weight: 800;
	letter-spacing: 0.02em;
	text-transform: uppercase;
}

.pcard__quality,
.pcard .quality {
	position: absolute;
	right: 10px;
	bottom: 10px;
	z-index: 2;
	left: auto !important;
	top: auto !important;
	padding: 4px 8px;
	border-radius: 6px;
	font-size: 10px;
	font-weight: 700;
}

/* ========== Body ========== */
.pcard__body,
.pcard .product-details {
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
	padding: 10px 14px 14px;
	gap: 10px;
	background: var(--pc-surface);
	float: none !important;
	width: auto !important;
}

.pcard .caption {
	padding: 0 !important;
	margin: 0 !important;
	float: none !important;
	width: auto !important;
	flex: 1 1 auto;
}

.pcard__title,
.pcard h4 {
	height: auto !important;
	min-height: 2.6em;
	margin: 0 0 8px !important;
	font-family: 'Titillium Web', 'Open Sans', sans-serif;
	font-size: 14px;
	font-weight: 600;
	line-height: 1.35;
	text-align: left;
}

.product-layout.product-list .pcard__title {
	min-height: 0;
	font-size: 16px;
}

.pcard__title a,
.pcard h4 a {
	display: -webkit-box !important;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	width: auto !important;
	text-align: left !important;
	color: var(--pc-ink) !important;
	text-decoration: none;
	text-transform: none !important;
	transition: color var(--pc-transition);
}

.pcard:hover .pcard__title a,
#content .product-carousel .pcard:hover h4 a,
#content .box-product .pcard:hover h4 a,
#content .product-listgrid .pcard:hover h4 a {
	color: var(--pc-blue) !important;
}

.pcard__desc,
.pcard .desc {
	display: none;
}

.product-layout.product-list .pcard__desc,
.product-layout.product-list .pcard .desc {
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	margin: 0 0 8px;
	color: var(--pc-muted);
	font-size: 12px;
	line-height: 1.4;
}

/* ========== Price ========== */
.pcard__price,
.pcard .price,
.product-layout.product-list .pcard .caption .price,
.product-layout.product-grid .pcard .caption .price {
	display: flex !important;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 4px 8px;
	margin: 0 !important;
	text-align: left !important;
	color: var(--pc-blue);
	font-family: 'Titillium Web', 'Open Sans', sans-serif;
	font-size: 20px;
	font-weight: 700;
	line-height: 1.2;
}

.pcard__amount {
	color: var(--pc-blue);
	font-size: 20px;
	font-weight: 700;
}

.pcard .price-old {
	order: -1;
	width: 100%;
	margin: 0;
	color: #9aa3ad;
	font-size: 13px;
	font-weight: 500;
	text-decoration: line-through;
}

.pcard .kdahil {
	margin: 0;
	color: var(--pc-muted);
	font-size: 11px;
	font-weight: 600;
}

.pcard__price--pending,
.pcard .price.prepending {
	color: #a06718 !important;
	font-size: 14px !important;
	font-weight: 700;
}

/* ========== Actions ========== */
.pcard__btnwrap,
.product-layout.product-list .pcard .btn-list-grid,
.product-layout.product-grid .pcard .btn-list-grid {
	display: block !important;
	float: none !important;
	width: 100% !important;
	margin: 0 !important;
	padding: 0 !important;
}

.pcard__actions,
.pcard .button-group,
.product-layout.product-grid .pcard .button-group,
.product-layout.product-list .pcard .button-group,
.product-block .button-group.pcard__actions {
	position: static !important;
	display: grid !important;
	grid-template-columns: 1fr 1fr;
	gap: 8px;
	width: 100% !important;
	opacity: 1 !important;
	overflow: visible !important;
	bottom: auto !important;
	float: none;
	clear: both;
	border: none !important;
}

.pcard__btn,
.pcard .button-group .addtocart,
.pcard .button-group button,
.pcard .button-group a.pcard__btn {
	float: none !important;
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	width: 100% !important;
	height: 38px !important;
	margin: 0 !important;
	padding: 0 10px;
	border: none !important;
	border-left: none !important;
	border-radius: 8px !important;
	font-size: 12px !important;
	font-weight: 700 !important;
	letter-spacing: 0.01em;
	text-transform: none !important;
	text-decoration: none !important;
	cursor: pointer;
	transition: background var(--pc-transition), color var(--pc-transition);
}

.pcard__btn--cart,
.pcard .pcard__btn--cart,
.pcard .addtocart.cart-blue {
	background: var(--pc-blue) !important;
	color: #fff !important;
}

.pcard__btn--cart:hover,
.pcard .addtocart.cart-blue:hover {
	background: var(--pc-blue-deep) !important;
}

.pcard__btn--buy,
.pcard .pcard__btn--buy {
	background: var(--pc-yellow) !important;
	color: var(--pc-ink) !important;
}

.pcard__btn--buy:hover {
	background: #f0c400 !important;
}

.pcard__actions:has(.pcard__btn--detail) {
	grid-template-columns: 1fr;
}

.pcard__btn--detail {
	background: var(--pc-soft) !important;
	color: var(--pc-blue) !important;
	border: 1px solid var(--pc-line) !important;
}

.pcard__btn--detail:hover {
	background: #e8eef8 !important;
}

.pcard--oos {
	opacity: 0.92;
}

.pcard--oos .pcard__media::after {
	content: '';
	position: absolute;
	inset: 0;
	background: rgba(255, 255, 255, 0.25);
	pointer-events: none;
}

/* Hide old sale ribbon inside modern cards */
.pcard .saleback {
	display: none !important;
}

/* ========== Section spacing ========== */
.box.featured,
.box.latest {
	margin-bottom: 28px;
}

/* ========== Responsive ========== */
@media (max-width: 767px) {
	.product-layout.product-list .pcard__inner {
		flex-direction: column;
	}

	.product-layout.product-list .pcard__media {
		flex: none;
		width: 100%;
		max-width: none;
	}

	.pcard__img-link {
		min-height: 150px;
		height: 150px;
	}

	.pcard__img-link img,
	.pcard .image img {
		height: 130px !important;
	}

	.pcard__body {
		padding: 8px 12px 12px;
	}

	.pcard__title,
	.pcard h4 {
		font-size: 13px;
		min-height: 2.5em;
	}

	.pcard__amount,
	.pcard__price {
		font-size: 18px;
	}

	.pcard__btn,
	.pcard .button-group .addtocart {
		height: 36px !important;
		font-size: 11px !important;
	}
}
