/* Perfekt Pfannen – Shop features styling
   Uses the theme's design tokens (--color-accent, --font-*) with safe fallbacks. */

:root {
	--pp-accent: var(--color-accent, #B8892A);
}

/* ---------- Price filter ---------- */
.pp-price-form { display: flex; flex-direction: column; gap: .75rem; }
.pp-price-inputs { display: flex; align-items: flex-end; gap: .5rem; }
.pp-price-inputs label {
	display: flex; flex-direction: column; gap: .25rem;
	font-size: .75rem; text-transform: uppercase; letter-spacing: .04em;
	color: var(--color-mid, #777); flex: 1;
}
.pp-price-inputs input {
	width: 100%; padding: .5rem .6rem; border: 1px solid #ddd; border-radius: 4px;
	font: inherit; font-size: .9rem;
}
.pp-price-inputs input:focus { outline: none; border-color: var(--pp-accent); }
.pp-price-dash { padding-bottom: .65rem; color: var(--color-mid, #999); }
.pp-price-actions { display: flex; align-items: center; gap: 1rem; }
.pp-price-reset { font-size: .8rem; color: var(--color-mid, #777); text-decoration: underline; }
.pp-price-range-note { font-size: .75rem; color: var(--color-mid, #999); margin: 0; }

/* ---------- Card action overlay (wishlist + quick view) ---------- */
.product-card { position: relative; }
.product-card__img-wrap { position: relative; }

.pp-card-tools {
	position: absolute; top: .6rem; right: .6rem; z-index: 3;
	display: flex; flex-direction: column; gap: .4rem;
}
.pp-wishlist-btn,
.pp-quick-view-btn {
	display: inline-flex; align-items: center; justify-content: center; gap: .4rem;
	background: rgba(255,255,255,.92); border: none; border-radius: 999px;
	cursor: pointer; color: #333; box-shadow: 0 2px 8px rgba(0,0,0,.12);
	transition: transform .15s ease, color .15s ease, background .15s ease;
}
.pp-wishlist-btn { width: 38px; height: 38px; padding: 0; }
.pp-wishlist-btn:hover { transform: scale(1.08); color: var(--pp-accent); }
.pp-wishlist-btn.is-active { color: #fff; background: var(--pp-accent); }
.pp-wishlist-btn.is-active svg { fill: #fff; }

/* Quick-view button: icon in the card-tools column, fades in on card hover */
.pp-card-tools .pp-quick-view-btn {
	width: 38px; height: 38px; padding: 0;
	opacity: 0; transform: translateY(-4px); pointer-events: none;
}
.pp-card-tools .pp-quick-view-btn span {
	position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
	overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
.product-card:hover .pp-card-tools .pp-quick-view-btn {
	opacity: 1; transform: none; pointer-events: auto;
}
.pp-quick-view-btn:hover { color: var(--pp-accent); }
@media (hover: none) {
	.pp-card-tools .pp-quick-view-btn { opacity: 1; pointer-events: auto; transform: none; }
}

/* ---------- Header wishlist icon ---------- */
.header-icon--wishlist { position: relative; }
.pp-wishlist-count {
	position: absolute; top: -6px; right: -8px; min-width: 17px; height: 17px;
	padding: 0 4px; border-radius: 999px; background: var(--pp-accent); color: #fff;
	font-size: .65rem; line-height: 17px; text-align: center; font-weight: 700;
}

/* ---------- Wishlist page ---------- */
.pp-wishlist-empty, .pp-wishlist-loading {
	grid-column: 1 / -1; color: var(--color-mid, #777); padding: 2rem 0; text-align: center;
}
.pp-wishlist-card-actions { display: flex; align-items: center; gap: 1rem; margin-top: .5rem; }
.pp-wishlist-remove {
	background: none; border: none; cursor: pointer; font-size: .8rem;
	color: var(--color-mid, #888); text-decoration: underline;
}
.pp-wishlist-remove:hover { color: #c0392b; }

/* ---------- Single product wishlist row ---------- */
.product-info__wishlist {
	display: flex; align-items: center; gap: .6rem; margin-top: 1.1rem;
	font-size: .9rem; color: var(--color-mid, #777);
}
.product-info__wishlist .pp-wishlist-btn {
	width: 40px; height: 40px; border: 1px solid #e2e2e2; box-shadow: none;
}

/* ---------- Price suffix ---------- */
.pp-price-suffix { display: block; font-size: .8rem; color: var(--color-mid, #888); margin-top: .25rem; }
.pp-price-suffix a { color: inherit; text-decoration: underline; }

/* ---------- Quick-view modal ---------- */
.pp-quick-modal {
	position: fixed; inset: 0; z-index: 9999; display: none;
	align-items: center; justify-content: center; padding: 1.5rem;
}
.pp-quick-modal.is-open { display: flex; }
.pp-quick-modal__overlay { position: absolute; inset: 0; background: rgba(20,16,10,.55); backdrop-filter: blur(2px); }
.pp-quick-modal__dialog {
	position: relative; z-index: 1; background: #fff; border-radius: 6px;
	max-width: 880px; width: 100%; max-height: 90vh; overflow: auto;
	box-shadow: 0 24px 60px rgba(0,0,0,.3); animation: pp-qv-in .22s ease;
}
@keyframes pp-qv-in { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: none; } }
.pp-quick-modal__close {
	position: absolute; top: .5rem; right: .75rem; z-index: 2;
	background: none; border: none; font-size: 2rem; line-height: 1; cursor: pointer; color: #999;
}
.pp-quick-modal__close:hover { color: #222; }

.pp-qv { display: grid; grid-template-columns: 1fr 1fr; gap: 2rem; padding: 2rem; }
.pp-qv__img { width: 100%; height: auto; border-radius: 4px; display: block; }
.pp-qv__title { font-family: var(--font-display, "Cormorant Garamond", serif); font-size: 2rem; margin: .3rem 0 .5rem; }
.pp-qv__price { font-size: 1.4rem; color: var(--pp-accent); font-weight: 600; margin-bottom: 1rem; }
.pp-qv__desc { color: var(--color-mid, #666); line-height: 1.6; margin-bottom: 1.5rem; }
.pp-qv__actions { display: flex; gap: 1rem; flex-wrap: wrap; }
.pp-qv__loading { padding: 3rem; text-align: center; color: var(--color-mid, #888); }

@media (max-width: 768px) {
	.pp-qv { grid-template-columns: 1fr; gap: 1rem; padding: 1.25rem; }
	.pp-qv__title { font-size: 1.6rem; }
}

/* ───────────── Spam-Schutz: Honeypot verstecken ───────────── */
.pp-hp{position:absolute !important;left:-9999px !important;top:-9999px !important;height:1px;width:1px;overflow:hidden;}

/* ───────────── Lieferzeit ───────────── */
.pp-lieferzeit{display:flex;align-items:center;gap:.45rem;margin:.4rem 0 .8rem;font-size:.9rem;color:#3d7a3d;}
.pp-lieferzeit--out{color:#a33;}
.pp-dot{display:inline-block;width:.6rem;height:.6rem;border-radius:50%;}
.pp-dot--green{background:#3d9a3d;box-shadow:0 0 0 3px rgba(61,154,61,.18);}
.pp-dot--red{background:#c0392b;box-shadow:0 0 0 3px rgba(192,57,43,.15);}

/* ───────────── Gratisversand-Fortschritt ───────────── */
.pp-shipbar{margin:0 0 1.4rem;padding:.9rem 1.1rem;border:1px solid #e5e0d8;border-radius:6px;background:#f8f5f0;}
.pp-shipbar__text{margin:0 0 .55rem;font-size:.92rem;}
.pp-shipbar__track{height:8px;border-radius:4px;background:#e7e1d6;overflow:hidden;}
.pp-shipbar__fill{height:100%;border-radius:4px;background:#B8892A;transition:width .4s ease;}

/* ───────────── Newsletter-Formular ───────────── */
.pp-nl-form{max-width:480px;}
.pp-nl-row{display:flex;gap:.5rem;}
.pp-nl-row input[type=email]{flex:1;padding:.65rem .9rem;border:1px solid #d8d2c6;border-radius:4px;font-size:.95rem;}
.pp-nl-hint{margin:.5rem 0 0;font-size:.75rem;color:#8a8a8a;}
.pp-nl-hint a{color:inherit;text-decoration:underline;}
.pp-nl-msg{padding:.6rem .9rem;border-radius:4px;font-size:.9rem;}
.pp-nl-msg--ok{background:#eaf6ea;border:1px solid #bfe3bf;color:#2c662c;}
.pp-nl-msg--err{background:#fbeaea;border:1px solid #ecc4c4;color:#8a2a2a;}

/* ───────────── Newsletter im dunklen Footer ───────────── */
.footer-newsletter{border-bottom:1px solid rgba(255,255,255,.08);}
.footer-newsletter .container{padding-block:2.2rem;}
.footer-newsletter__text{margin:.4rem 0 1rem;font-size:.92rem;color:rgba(255,255,255,.65);}
.footer-newsletter .pp-nl-row input[type=email]{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.18);color:#fff;}
.footer-newsletter .pp-nl-row input[type=email]::placeholder{color:rgba(255,255,255,.4);}
.footer-newsletter .pp-nl-hint{color:rgba(255,255,255,.45);}