/* Merchify God Tool – Kauf-Popups */
.mfp {
	--mfp-bg: #fff; --mfp-fg: #141414; --mfp-accent: #ff0080; --mfp-radius: 16px; --mfp-w: 340px; --mfp-x: 20px; --mfp-y: 20px; --mfp-dur: 7s;
	position: fixed; z-index: 99990; box-sizing: border-box; width: var(--mfp-w); max-width: calc(100vw - 2 * var(--mfp-x));
	background: var(--mfp-bg); color: var(--mfp-fg); border-radius: var(--mfp-radius); overflow: hidden;
	font-family: inherit; font-size: 14px; line-height: 1.4; text-align: left;
	opacity: 0; visibility: hidden; pointer-events: none;
	transform: translateY(18px) scale(.98);
	transition: opacity .35s ease, transform .5s cubic-bezier(.2, .9, .25, 1.15), visibility 0s linear .5s;
}
.mfp *, .mfp *::before, .mfp *::after { box-sizing: border-box; }
.mfp.is-in { opacity: 1; visibility: visible; pointer-events: auto; transform: none; transition: opacity .35s ease, transform .5s cubic-bezier(.2, .9, .25, 1.15), visibility 0s; }
.mfp--bottom-left { left: var(--mfp-x); bottom: var(--mfp-y); }
.mfp--bottom-right { right: var(--mfp-x); bottom: var(--mfp-y); }
.mfp--top-left { left: var(--mfp-x); top: var(--mfp-y); }
.mfp--top-right { right: var(--mfp-x); top: var(--mfp-y); }
.mfp--top-left, .mfp--top-right { transform: translateY(-18px) scale(.98); }
.mfp--bottom-left.mfp--anim-slide, .mfp--top-left.mfp--anim-slide { transform: translateX(-24px); }
.mfp--bottom-right.mfp--anim-slide, .mfp--top-right.mfp--anim-slide { transform: translateX(24px); }
.mfp--anim-pop { transform: scale(.85); }
.mfp--anim-fade { transform: none; }
.mfp.is-in { transform: none; }

.mfp--shadow-soft { box-shadow: 0 12px 32px rgba(0,0,0,.13), 0 2px 6px rgba(0,0,0,.06); }
.mfp--shadow-strong { box-shadow: 0 20px 55px rgba(0,0,0,.3), 0 4px 12px rgba(0,0,0,.12); }
.mfp--shadow-none { box-shadow: 0 0 0 1px rgba(128,128,128,.22); }
.mfp--dunkel.mfp--shadow-soft { box-shadow: 0 12px 32px rgba(0,0,0,.35); }
.mfp--glas { background: rgba(255,255,255,.72); border: 1px solid rgba(255,255,255,.55); -webkit-backdrop-filter: blur(16px) saturate(1.7); backdrop-filter: blur(16px) saturate(1.7); }
@supports (background: color-mix(in srgb, red 50%, blue)) { .mfp--glas { background: color-mix(in srgb, var(--mfp-bg) 70%, transparent); } }
.mfp--pink { background: linear-gradient(135deg, var(--mfp-bg), color-mix(in srgb, var(--mfp-bg) 75%, #7a00ff)); }

.mfp .mfp__main { display: flex !important; align-items: center; gap: 12px; padding: 12px 36px 12px 12px; color: inherit !important; text-decoration: none !important; background: none !important; }
.mfp .mfp__img { flex: 0 0 64px; width: 64px; height: 64px; display: grid; place-items: center; border-radius: calc(var(--mfp-radius) * .7); background: rgba(128,128,128,.12) center / cover no-repeat; color: var(--mfp-accent); }
.mfp--img-circle .mfp__img { border-radius: 50%; }
.mfp--img-square .mfp__img { border-radius: 4px; }
.mfp .mfp__body { flex: 1 1 auto; min-width: 0; display: block; }
.mfp .mfp__line { display: block; font-size: 12.5px; opacity: .78; }
.mfp .mfp__line strong { font-weight: 600; opacity: 1; }
.mfp .mfp__product { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; margin: 2px 0 5px; font-size: 14.5px; font-weight: 700; line-height: 1.3; transition: color .15s; }
.mfp .mfp__main:hover .mfp__product { color: var(--mfp-accent); }
.mfp--pink .mfp__main:hover .mfp__product { text-decoration: underline; color: inherit; }
.mfp .mfp__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; font-size: 11.5px; }
.mfp .mfp__meta i { font-style: normal; opacity: .5; }
.mfp .mfp__time { opacity: .7; }
.mfp .mfp__badge { display: inline-flex; align-items: center; gap: 3px; color: var(--mfp-accent); font-weight: 600; }
.mfp .mfp__x { position: absolute; top: 6px; right: 6px; width: 24px; height: 24px; margin: 0 !important; padding: 0 !important; border: 0 !important; border-radius: 50% !important; background: transparent !important; color: inherit !important; font: 400 17px/24px Arial, sans-serif !important; text-align: center; opacity: .45; cursor: pointer; box-shadow: none !important; }
.mfp .mfp__x:hover, .mfp .mfp__x:focus-visible { opacity: 1; background: rgba(128,128,128,.18) !important; }
.mfp .mfp__bar { position: absolute; left: 0; bottom: 0; width: 100%; height: 3px; background: var(--mfp-accent); opacity: .85; transform-origin: left; transform: scaleX(0); }
.mfp.is-in .mfp__bar { animation: mfp-bar var(--mfp-dur) linear forwards; }
.mfp:hover .mfp__bar { animation-play-state: paused; }
@keyframes mfp-bar { from { transform: scaleX(1); } to { transform: scaleX(0); } }

@media (max-width: 600px) {
	.mfp:not(.mfp--preview) { left: 10px !important; right: 10px !important; width: auto; max-width: none; }
	.mfp:not(.mfp--preview).mfp--bottom-left, .mfp:not(.mfp--preview).mfp--bottom-right { bottom: 10px; }
	.mfp:not(.mfp--preview) .mfp__img { flex-basis: 50px; width: 50px; height: 50px; }
	.mfp:not(.mfp--preview) .mfp__main { padding: 10px 34px 10px 10px; gap: 10px; }
	.mfp:not(.mfp--preview) .mfp__product { -webkit-line-clamp: 1; }
}
@media (prefers-reduced-motion: reduce) {
	.mfp, .mfp.is-in { transform: none !important; transition: opacity .2s; }
	.mfp.is-in .mfp__bar { animation: none; }
}

/* Admin-Vorschau */
.mfp--preview { position: absolute; }
.mgt-popups-grid { display: grid; grid-template-columns: minmax(420px, 1fr) minmax(380px, .9fr); gap: 16px; align-items: start; }
@media (max-width: 1100px) { .mgt-popups-grid { grid-template-columns: 1fr; } }
.mgt-popups-grid > .mgt-card { margin: 0; }
.mgt-p-preview-card { position: sticky; top: 40px; }
.mgt-p-preview-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.mgt-p-stage { position: relative; height: 420px; margin: 8px 0; border-radius: 10px; overflow: hidden; background: #eef0f3; transition: max-width .2s; }
.mgt-p-stage.is-mobile { max-width: 380px; margin-left: auto; margin-right: auto; }
.mgt-p-stage.is-mobile .mfp--preview { left: 10px !important; right: 10px !important; width: auto; max-width: none; }
.mgt-p-fake { padding: 24px; display: grid; gap: 12px; grid-template-columns: repeat(3, 1fr); }
.mgt-p-fake i { display: block; height: 150px; border-radius: 10px; background: #fff; }
.mgt-p-fake b { display: block; grid-column: 1 / -1; height: 12px; border-radius: 6px; background: #dcdfe4; }
.mgt-p-fake b + b { width: 60%; }
.mgt-p-colors label { display: inline-flex; align-items: center; gap: 6px; margin-right: 14px; }
.mgt-p-colors input[type=color] { width: 36px; height: 30px; padding: 0 2px; border: 1px solid #8c8f94; border-radius: 4px; cursor: pointer; }
.mgt-p-design td select { margin-right: 6px; }