/* Featured Product Toast (floating card + progress bar) */
.featured-toast{
  position:fixed; right:1rem; bottom:1rem; z-index:80; width:21rem; max-width:calc(100vw - 2rem);
  background:#ffffff; border:1px solid #efefef; border-radius:.375rem; overflow:hidden;
  box-shadow:0 .5rem 2rem rgba(0,0,0,.18);
  opacity:0; transform:translateY(1.5rem); pointer-events:none; transition:opacity .4s, transform .4s, bottom .4s ease;
}
/* ปุ่ม back-to-top แสดงอยู่ (เลื่อนลงมาแล้ว) ให้ toast ขยับขึ้นหลบ */
.featured-toast.with-top{bottom:5rem;}
.featured-toast.show{opacity:1; transform:none; pointer-events:auto;}
.featured-toast .ft-link{display:flex; align-items:center; padding:.875rem 2.25rem .875rem .875rem; color:#222325; text-decoration:none;}
.featured-toast .ft-img{flex:0 0 5.5rem; width:5.5rem; height:5rem; margin-right:.875rem; background:#ffffff;}
.featured-toast .ft-img img{display:block; width:100%; height:100%; object-fit:contain;}
.featured-toast .ft-text{min-width:0; transition:opacity .25s, transform .25s;}
.featured-toast.switching .ft-text, .featured-toast.switching .ft-img{opacity:0; transform:translateX(.5rem);}
.featured-toast .ft-img{transition:opacity .25s, transform .25s;}
.featured-toast .ft-label{display:block; font-size:.75rem; letter-spacing:.04em; text-transform:uppercase; color:var(--color-p);}
.featured-toast .ft-title{
  margin:.125rem 0 0 0; font-size:1rem; line-height:1.25; font-weight:400;
  display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden;
}
.featured-toast .ft-more{display:inline-block; margin-top:.375rem; font-size:.875rem; color:var(--color-p);}
.featured-toast .ft-more em{margin-left:.25rem; font-size:.75rem; transition:transform .25s;}
.featured-toast .ft-link:hover .ft-more em{transform:translateX(.25rem);}
.featured-toast .ft-close{
  position:absolute; top:.375rem; right:.375rem; width:1.75rem; height:1.75rem; padding:0; border:0; border-radius:50%;
  background:transparent; color:#7a7a7a; font-size:.875rem; cursor:pointer; transition:background .25s, color .25s;
}
.featured-toast .ft-close:hover{background:#f0f0f0; color:#222325;}
.featured-toast .ft-progress{height:.25rem; background:#efefef;}
.featured-toast .ft-progress-bar{display:block; height:100%; width:0; background:var(--color-p);}
@media (prefers-reduced-motion:reduce){
  .featured-toast, .featured-toast .ft-text, .featured-toast .ft-img{transition:none;}
}
@media screen and (max-width:575.98px){
  .featured-toast.with-top{bottom:4.75rem;}
  .featured-toast .ft-img{flex-basis:4.5rem; width:4.5rem; height:4.25rem;}
}
