/* animations.css — Read to Lead Bookstore */

/* ===== KEYFRAMES ===== */

@keyframes fadeInUp {
  from { opacity:0; transform:translateY(28px); }
  to   { opacity:1; transform:translateY(0); }
}
@keyframes fadeIn {
  from { opacity:0; } to { opacity:1; }
}
@keyframes cardPulse {
  0%{transform:scale(1)} 40%{transform:scale(.94)} 70%{transform:scale(1.04)} 100%{transform:scale(1)}
}
@keyframes slideInRight {
  from { opacity:0; transform:translateX(60px); }
  to   { opacity:1; transform:translateX(0); }
}
@keyframes slideInLeft {
  from { opacity:0; transform:translateX(-60px); }
  to   { opacity:1; transform:translateX(0); }
}
@keyframes shimmer {
  0%   { background-position:-1000px 0; }
  100% { background-position:1000px 0; }
}
@keyframes float {
  0%,100% { transform:translateY(0) rotate(0deg); }
  33%     { transform:translateY(-14px) rotate(2deg); }
  66%     { transform:translateY(-7px) rotate(-1deg); }
}
@keyframes floatSlow {
  0%,100% { transform:translateY(0) scale(1); }
  50%     { transform:translateY(-18px) scale(1.02); }
}
@keyframes badgeBounce {
  0%{transform:scale(1)} 50%{transform:scale(1.45)} 100%{transform:scale(1)}
}
@keyframes cardReveal {
  from { opacity:0; transform:translateY(18px) scale(.97); }
  to   { opacity:1; transform:translateY(0) scale(1); }
}
@keyframes scrollBounce {
  0%,100%{transform:translateY(0)} 50%{transform:translateY(8px)}
}

/* ===== HERO STAGGERED ENTRANCE ===== */
.hero-badge       { animation: fadeInUp .5s ease both .1s; }
.hero-title       { animation: fadeInUp .6s ease both .2s; }
.hero-author      { animation: fadeInUp .6s ease both .3s; }
.hero-rating      { animation: fadeInUp .6s ease both .4s; }
.hero-description { animation: fadeInUp .6s ease both .45s; }
.hero-price       { animation: fadeInUp .6s ease both .5s; }
.hero-actions     { animation: fadeInUp .6s ease both .6s; }
.hero-book-img    { animation: fadeInUp .8s ease both .15s; }

/* ===== BLOBS ===== */
.blob-1 { animation: float 8s ease-in-out infinite; }
.blob-2 { animation: floatSlow 11s ease-in-out infinite 2s; }
.blob-3 { animation: float 13s ease-in-out infinite 4s; }

/* ===== PRODUCT CARDS ===== */
.product-card { animation: cardReveal .4s ease both; }

/* ===== SKELETON ===== */
.skeleton {
  background: linear-gradient(90deg,
    var(--skeleton-base,#e8e0d0) 25%,
    var(--skeleton-shine,#f5f0e8) 50%,
    var(--skeleton-base,#e8e0d0) 75%
  );
  background-size:1000px 100%;
  animation: shimmer 1.5s infinite linear;
  border-radius:6px;
}

/* ===== CART TOAST ===== */
.cart-toast.show { animation: slideInRight .35s ease forwards; }

/* ===== SCROLL INDICATOR ===== */
.scroll-indicator { animation: scrollBounce 1.6s ease-in-out infinite; }

/* ===== SECTION ANIMATE (IntersectionObserver) ===== */
.section-animate { opacity:0; transform:translateY(24px); transition:opacity .6s ease,transform .6s ease; }
.section-animate.visible { opacity:1; transform:translateY(0); }

/* ===== HOVER TRANSITIONS ===== */
.product-card     { transition:transform .25s ease, box-shadow .25s ease; }
.product-card:hover { transform:translateY(-6px); box-shadow:0 14px 36px rgba(26,26,46,.18); }

.deal-card        { transition:transform .25s ease, box-shadow .25s ease; }
.deal-card:hover  { transform:translateY(-4px); box-shadow:0 10px 28px rgba(26,26,46,.15); }

.team-card        { transition:transform .25s ease, box-shadow .25s ease; }
.team-card:hover  { transform:translateY(-5px); box-shadow:0 14px 36px rgba(26,26,46,.15); }

.highlight-card   { transition:transform .25s ease, box-shadow .25s ease; }
.highlight-card:hover { transform:translateY(-6px); box-shadow:0 16px 40px rgba(26,26,46,.18); }

.icon-grid-card   { transition:transform .25s ease, box-shadow .25s ease; }
.icon-grid-card:hover { transform:translateY(-5px); box-shadow:0 12px 32px rgba(26,26,46,.14); }

/* Button hover */
.btn-primary-rtl  { transition:transform .2s ease, box-shadow .2s ease, background-color .2s ease; }
.btn-primary-rtl:hover { transform:translateY(-2px); box-shadow:0 6px 18px rgba(232,160,69,.4); }

.btn-add-cart:active { animation:cardPulse .3s ease; }

/* Social links */
.social-link { transition:color .2s ease, transform .2s ease, background-color .2s ease; }
.social-link:hover { transform:translateY(-3px); }

/* Navbar */
.navbar { transition:background-color .3s ease, box-shadow .3s ease, border-color .3s ease; }

/* Cart badge */
.cart-pulse .cart-badge { animation:badgeBounce .3s ease; }

/* Scroll-to-top */
#scroll-top-btn { transition:opacity .3s ease, transform .3s ease; }
#scroll-top-btn:hover { transform:translateY(-3px); }

/* Filter tab underline animation */
.filter-tab { transition:color .2s ease, border-color .2s ease; }

/* Nav link underline */
.nav-link::after {
  content:''; display:block; height:2px; background:var(--gold);
  transform:scaleX(0); transform-origin:left; transition:transform .25s ease;
}
.nav-link:hover::after,.nav-link.active::after { transform:scaleX(1); }

/* Page entrance */
.page-wrapper { animation:fadeIn .4s ease both; }
