/* Bildirim (toast) + sepete ucus — uretici: C:/tmp/gen_bildirim_css.js */

/* ── Butondan sepete ucan gorsel ─────────────────────────────────────── */
.sepete-ucan{position:fixed;z-index:190;pointer-events:none;
  background-size:cover;background-position:center;border-radius:2px;
  box-shadow:0 12px 28px rgba(30,30,26,.28);will-change:transform,opacity}

/* Sepet simgesi ucus bitince kisa bir zipla */
.icon-cart.zipla{animation:sepet-zipla .48s cubic-bezier(.3,1.6,.5,1)}
@keyframes sepet-zipla{
  0%{transform:scale(1)} 30%{transform:scale(1.28)}
  55%{transform:scale(.94)} 100%{transform:scale(1)}
}

/* ── Bildirim yigini: sag ALT ────────────────────────────────────────── */
/* Urun detayindaki yuzen WhatsApp dugmesi sag altta (63px + 27px) —
   bildirimler onun ustunde baslar. */
.bildirimler{position:fixed;right:24px;bottom:108px;z-index:180;
  display:flex;flex-direction:column-reverse;gap:12px;
  width:min(378px,calc(100vw - 32px));pointer-events:none}

.bildirim{position:relative;display:grid;grid-template-columns:auto minmax(0,1fr) 24px;gap:14px;
  align-items:start;overflow:hidden;
  background:#fff;border:1px solid rgba(37,35,31,.10);padding:14px 14px 15px;
  box-shadow:0 18px 46px rgba(28,28,24,.16),0 2px 6px rgba(28,28,24,.06);
  pointer-events:auto;
  opacity:0;transform:translateX(26px) scale(.97);
  transition:opacity .3s ease,transform .38s cubic-bezier(.22,.9,.28,1)}
.bildirim.acik{opacity:1;transform:none}

/* Urun gorseli + kose tiki */
.bildirim-foto{position:relative;display:block;width:62px;height:62px;flex-shrink:0;
  background:#efeae2;overflow:visible}
.bildirim-foto img{width:100%;height:100%;object-fit:cover;display:block}
.bildirim-tik{position:absolute;right:-7px;bottom:-7px;width:23px;height:23px;border-radius:50%;
  background:#66715f;color:#fff;display:grid;place-items:center;border:2px solid #fff;
  animation:tik-gir .38s .12s cubic-bezier(.3,1.5,.5,1) both}
.bildirim-tik svg{width:12px;height:12px}
@keyframes tik-gir{from{transform:scale(0)}to{transform:scale(1)}}

/* Gorseli olmayan (hata) bildirimler */
.bildirim-ikon{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;
  background:#eef1ea;color:#5e6c56;flex-shrink:0}
.bildirim-ikon svg{width:19px;height:19px}
.bildirim-hata .bildirim-ikon{background:#f7ecec;color:#a35b5b}

.bildirim-govde{min-width:0;padding-top:1px}
.bildirim-etiket{display:block;font-size:10.5px;letter-spacing:.13em;text-transform:uppercase;
  color:#7f8a78;margin-bottom:4px}
.bildirim-etiket:empty{display:none}
.bildirim-govde b{display:block;font:400 16px/1.3 "Libre Caslon Display",Georgia,serif;color:#25231f}
.bildirim-alt{display:block;font-size:12.5px;line-height:1.55;color:#7a766e;margin-top:4px}
.bildirim-alt:empty{display:none}

.bildirim-islem{display:flex;align-items:center;gap:14px;margin-top:12px}
.bildirim-btn{display:inline-grid;place-items:center;min-height:36px;padding:0 16px;
  background:#66715f;color:#fff;font-size:12px;letter-spacing:.04em;
  border:1px solid #66715f;transition:.22s}
.bildirim-btn:hover{background:#4b5546;border-color:#4b5546}
.bildirim-devam{background:none;border:0;padding:0;font:inherit;font-size:12.5px;color:#8b877f;
  cursor:pointer;transition:color .2s}
.bildirim-devam:hover{color:#25231f}

.bildirim-kapat{width:24px;height:24px;display:grid;place-items:center;padding:0;
  background:none;border:0;color:#b3aea6;cursor:pointer;transition:color .2s}
.bildirim-kapat:hover{color:#25231f}
.bildirim-kapat svg{width:14px;height:14px;display:block}

/* Kendiliginden kapanma cubugu */
.bildirim-cubuk{position:absolute;left:0;right:0;bottom:0;height:2px;background:rgba(37,35,31,.07)}
.bildirim-cubuk i{display:block;height:100%;width:100%;transform-origin:left;
  background:#66715f;animation:bildirim-erime linear forwards}
.bildirim-hata .bildirim-cubuk i{background:#a35b5b}
.bildirim.durdu .bildirim-cubuk i{animation-play-state:paused}
@keyframes bildirim-erime{from{transform:scaleX(1)}to{transform:scaleX(0)}}

@media(max-width:700px){
  .bildirimler{right:15px;left:15px;bottom:92px;width:auto}
  .bildirim{transform:translateY(16px) scale(.98)}
  .bildirim-foto{width:54px;height:54px}
}

@media(prefers-reduced-motion:reduce){
  .bildirim{transition:opacity .2s}
  .bildirim-tik,.bildirim-cubuk i,.icon-cart.zipla{animation:none}
  .bildirim-cubuk i{transform:scaleX(0)}
}