:root {
--pb-radius:  16px;
--pb-title:   var(--mg-text);
--pb-cta-fg:  #ffffff;
--pb-dot:     rgba(0, 0, 0, .18);
--pb-dot-on:  rgba(0, 0, 0, .5);
--pb-green-bg:  #e6f4ea; --pb-green-acc:  #1e7e44;
--pb-teal-bg:   #d8f3ef; --pb-teal-acc:   #0c7a6e;
--pb-cyan-bg:   #d9f1f7; --pb-cyan-acc:   #0a7286;
--pb-blue-bg:   #e3edfd; --pb-blue-acc:   #1554c4;
--pb-indigo-bg: #e7e6fb; --pb-indigo-acc: #4338ca;
--pb-purple-bg: #f3e6fb; --pb-purple-acc: #7e22ce;
--pb-pink-bg:   #fbe3ee; --pb-pink-acc:   #be185d;
--pb-red-bg:    #fde4e4; --pb-red-acc:    #c0392b;
--pb-orange-bg: #fdeada; --pb-orange-acc: #c2540a;
--pb-yellow-bg: #fbf2d3; --pb-yellow-acc: #946c00;
--pb-slate-bg:  #eceef2; --pb-slate-acc:  #475569;
--pb-custom-base: #ffffff;
--pb-custom-mix:  12%;
}
[data-theme="dark"] {
--pb-title:   var(--mg-text);
--pb-cta-fg:  #16181c;
--pb-dot:     rgba(255, 255, 255, .22);
--pb-dot-on:  rgba(255, 255, 255, .65);
--pb-green-bg:  #16271d; --pb-green-acc:  #5cc98f;
--pb-teal-bg:   #122725; --pb-teal-acc:   #4fc9bb;
--pb-cyan-bg:   #11272d; --pb-cyan-acc:   #4fc2d8;
--pb-blue-bg:   #16223a; --pb-blue-acc:   #6fa3f5;
--pb-indigo-bg: #1d1d3a; --pb-indigo-acc: #8b86f0;
--pb-purple-bg: #271433; --pb-purple-acc: #c78bf0;
--pb-pink-bg:   #301826; --pb-pink-acc:   #f08bbb;
--pb-red-bg:    #301717; --pb-red-acc:    #f08b8b;
--pb-orange-bg: #2e1d0e; --pb-orange-acc: #f0a85c;
--pb-yellow-bg: #2a2410; --pb-yellow-acc: #e0c860;
--pb-slate-bg:  #1b212b; --pb-slate-acc:  #9aa7b8;
--pb-custom-base: #16181c;
--pb-custom-mix:  22%;
}
.pb {
position: relative;
margin: 10px 0 0;
}
@media (min-width: 992px) {
.pb {
margin: 20px 0 10px;
}
}
.pb-track {
position: relative;
}
.pb-slide {
background: var(--pb-bg, #eef1f4);
border-radius: var(--pb-radius);
padding: 16px 18px;
position: relative;
overflow: hidden;
cursor: pointer; /* tüm banner kartı tıklanabilir → kampanyaya gider */
}
.pb-img {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
object-fit: cover;
z-index: 0;
}
.pb-veil {
position: absolute;
inset: 0;
z-index: 1;
background: linear-gradient(90deg, rgba(0, 0, 0, .58) 0%, rgba(0, 0, 0, .32) 55%, rgba(0, 0, 0, .12) 100%);
}
.pb-label, .pb-title, .pb-cta { position: relative; z-index: 2; }
.pb-has-img { background: var(--pb-acc, var(--mg-primary)); }
.pb-has-img .pb-label { color: #fff; }
.pb-has-img .pb-title { color: #fff; }
.pb--slider .pb-slide {
position: absolute;
inset: 0;
opacity: 0;
transition: opacity .4s ease;
pointer-events: none;
}
.pb--slider .pb-slide.is-active {
position: relative;
opacity: 1;
pointer-events: auto;
}
.pb-label {
display: flex;
align-items: flex-start;
gap: 6px;
color: var(--pb-acc, #555);
font-size: .8rem;
font-weight: 600;
}
.pb-title {
font-size: .95rem;
font-weight: 600;
color: color-mix(in srgb, var(--mg-text) 80%, var(--pb-acc));
line-height: 1.3;
margin: .35rem 0 .7rem;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
min-height: 2.6em;
}
.pb-cta {
display: inline-flex;
align-items: center;
background: var(--mg-primary, #2D6A4F);  /* CTA = sitenin genel tema rengi (kampanya rengi değil) */
color: #fff;
border: 0;
border-radius: var(--pb-radius);
padding: .42rem .95rem;
font-size: .85rem;
font-weight: 600;
cursor: pointer;
transition: filter .15s, transform .15s;
}
.pb-cta:hover  { filter: brightness(1.07); }
.pb-cta:active { transform: scale(.97); }
@media (max-width: 991px) {
.pb-slide {
display: grid;
grid-template-columns: 1fr auto;   /* sol: metin (esner) · sağ: buton (sabit) */
align-items: center;
column-gap: 12px;
}
.pb-label {
grid-column: 1;
grid-row: 1;
min-width: 0;
overflow: hidden;
line-height: 1.35;
min-height: 2.7em;
}
.pb-label span {
min-width: 0;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
}
.pb-title {
grid-column: 1;
grid-row: 2;
margin: .15rem 0 0;
min-width: 0;                       /* başlık kendi içinde (butona kadar) kısalsın */
font-size: .82rem;                  /* mobilde daha kompakt (PC eski boyutta kalır) */
}
.pb-cta {
grid-column: 2;
grid-row: 1 / 3;                    /* iki satır boyunca dikeyde ortalı */
justify-self: end;
flex-shrink: 0;                     /* buton hep sağda sabit, alta düşmez */
height: 28px;
box-sizing: border-box;
padding: 0 14px;
font-size: 12px;
}
}
.pb-dots {
position: absolute;
right: 14px;
bottom: 12px;
display: flex;
gap: 6px;
z-index: 2;
}
.pb-dot {
width: 8px;
height: 8px;
padding: 0;
border: 0;
border-radius: 50%;
background: var(--pb-dot);
cursor: pointer;
transition: background .2s, transform .2s;
}
.pb-dot.is-active {
background: var(--pb-dot-on);
transform: scale(1.15);
}
.pcard-cmpbadge {
width: 18px;
height: 18px;
border-radius: 50%;
display: inline-flex;
align-items: center;
justify-content: center;
background: #e11d48;
color: #fff;
font-size: 9px;
flex-shrink: 0;
box-shadow: 0 1px 3px rgba(0, 0, 0, .22);
}
.pcard-cmpbadge i { font-size: 9px; }
.pcard-discbadge {
width: 18px;
height: 18px;
border-radius: 50%;
display: inline-flex;
align-items: center;
justify-content: center;
background: #993556;
color: #fff;
font-size: 9px;
font-weight: 700;
flex-shrink: 0;
box-shadow: 0 1px 3px rgba(0, 0, 0, .22);
}
.pd-img-badges { gap: 3px; }
.pd-cmpbadge {
background: #e11d48;
color: #fff;
}
.pd-discbadge {
background: #993556;
color: #fff;
font-weight: 700;
}
.pb-green  { --pb-bg: var(--pb-green-bg);  --pb-acc: var(--pb-green-acc); }
.pb-teal   { --pb-bg: var(--pb-teal-bg);   --pb-acc: var(--pb-teal-acc); }
.pb-cyan   { --pb-bg: var(--pb-cyan-bg);   --pb-acc: var(--pb-cyan-acc); }
.pb-blue   { --pb-bg: var(--pb-blue-bg);   --pb-acc: var(--pb-blue-acc); }
.pb-indigo { --pb-bg: var(--pb-indigo-bg); --pb-acc: var(--pb-indigo-acc); }
.pb-purple { --pb-bg: var(--pb-purple-bg); --pb-acc: var(--pb-purple-acc); }
.pb-pink   { --pb-bg: var(--pb-pink-bg);   --pb-acc: var(--pb-pink-acc); }
.pb-red    { --pb-bg: var(--pb-red-bg);    --pb-acc: var(--pb-red-acc); }
.pb-orange { --pb-bg: var(--pb-orange-bg); --pb-acc: var(--pb-orange-acc); }
.pb-yellow { --pb-bg: var(--pb-yellow-bg); --pb-acc: var(--pb-yellow-acc); }
.pb-slate  { --pb-bg: var(--pb-slate-bg);  --pb-acc: var(--pb-slate-acc); }
.pb-site   { --pb-bg: var(--mg-primary-soft); --pb-acc: var(--mg-primary); }
.pb-custom {
--pb-acc: var(--pb-custom-acc);
--pb-bg:  color-mix(in srgb, var(--pb-custom-acc) var(--pb-custom-mix), var(--pb-custom-base));
}
[data-theme="dark"] .pb-custom {
--pb-acc: color-mix(in srgb, var(--pb-custom-acc) 72%, #ffffff);
}
.mg-promofilter {
display: flex;
align-items: center;
gap: 10px;
margin: 0 0 12px;
font-size: 12px;
}
.mg-promofilter-label { color: var(--mg-text-soft); }
.mg-promofilter-chip {
display: inline-flex;
align-items: center;
gap: 6px;
height: 28px;
padding: 0 6px 0 12px;
box-sizing: border-box;
border-radius: 999px;
background: var(--pb-bg, var(--pb-pink-bg));
color: var(--pb-acc, var(--pb-pink-acc));
font-weight: 600;
}
.mg-promofilter-chip > i { font-size: 12px; }
.mg-promofilter-clear {
display: inline-flex;
align-items: center;
justify-content: center;
width: 20px;
height: 20px;
padding: 0;
border: 0;
border-radius: var(--mg-radius-sm);
background: transparent;
color: inherit;
cursor: pointer;
font-size: 11px;
}
.mg-promofilter-clear:hover { background: var(--mg-primary-soft); color: var(--mg-primary); }