/* ================================================================
   AFFICHEUR MAGIC v1.2 — Mobile-First Storefront + Sidebars + Wow Effects
   ================================================================ */

:root {
    --am-primary: #ff4d4f;
    --am-primary-dark: #d4380d;
    --am-secondary: #ff7a45;
    --am-accent: #faad14;
    --am-gold: #ffc53d;
    --am-bg: #f5f0ff;
    --am-bg-card: #ffffff;
    --am-text: #1a1a2e;
    --am-text-light: #6b7280;
    --am-success: #52c41a;
    --am-gradient: linear-gradient(135deg, #ff4d4f 0%, #ff7a45 50%, #faad14 100%);
    --am-gradient-cool: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    --am-gradient-magic: linear-gradient(135deg, #a855f7 0%, #ec4899 50%, #f59e0b 100%);
    --am-shadow: 0 2px 12px rgba(0,0,0,0.08);
    --am-shadow-hover: 0 8px 30px rgba(255,77,79,0.2);
    --am-radius: 12px;
    --am-radius-sm: 8px;
}

.affmagic-wrapper {
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'PingFang SC', 'Microsoft YaHei', sans-serif;
    max-width: 100%;
    margin: 0 auto;
    background: var(--am-bg);
    color: var(--am-text);
    -webkit-font-smoothing: antialiased;
    overflow-x: hidden;
}
.affmagic-wrapper * { box-sizing: border-box; }

/* ================================================================
   TOP BAR
   ================================================================ */
.affmagic-topbar {
    background: linear-gradient(135deg, #1e0a3c 0%, #2d1259 40%, #4a1a7a 100%);
    padding: 10px 12px;
    position: sticky;
    top: 0;
    z-index: 100;
    box-shadow: 0 2px 20px rgba(74,26,122,0.3);
}
.affmagic-topbar-inner {
    display: flex; align-items: center; justify-content: space-between;
    max-width: 1400px; margin: 0 auto; gap: 8px;
}
.affmagic-brand { display: flex; align-items: center; gap: 6px; min-width: 0; }
.affmagic-brand-icon { font-size: 20px; animation: amSparkle 2s ease-in-out infinite; }
@keyframes amSparkle { 0%,100%{transform:scale(1) rotate(0);opacity:1}50%{transform:scale(1.2) rotate(15deg);opacity:.8} }
.affmagic-brand-text {
    font-size: 15px; font-weight: 800;
    background: linear-gradient(90deg,#fbbf24,#f472b6,#a78bfa);
    -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text;
    white-space: nowrap;
}
.affmagic-fire-badge {
    display: none; background:var(--am-primary); color:#fff; font-size:10px; font-weight:700;
    padding:2px 8px; border-radius:20px; white-space:nowrap; animation:amPulse 2s infinite;
}
@keyframes amPulse { 0%,100%{transform:scale(1)}50%{transform:scale(1.05)} }

/* Currency */
.affmagic-currency-select {
    background:rgba(255,255,255,.12); color:#fff; border:1px solid rgba(255,255,255,.25);
    border-radius:20px; padding:5px 26px 5px 10px; font-size:12px; font-weight:600;
    cursor:pointer; outline:none; appearance:none; -webkit-appearance:none; min-width:100px;
    background-image:url("data:image/svg+xml,%3Csvg fill='white' viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z'/%3E%3C/svg%3E");
    background-repeat:no-repeat; background-position:right 8px center; background-size:14px;
    transition: all .2s;
}
.affmagic-currency-select:focus { border-color:var(--am-accent); box-shadow:0 0 0 2px rgba(250,173,20,.3); }
.affmagic-currency-select option { background:#1e0a3c; color:#fff; }

/* ================================================================
   FLASH BANNER
   ================================================================ */
.affmagic-flash-banner { background:var(--am-gradient); padding:8px 0; overflow:hidden; cursor:pointer; }
.affmagic-flash-inner {
    display:flex; align-items:center; gap:10px;
    animation:amScrollText 18s linear infinite; white-space:nowrap; padding:0 16px;
}
@keyframes amScrollText { 0%{transform:translateX(100%)}100%{transform:translateX(-100%)} }
.affmagic-flash-icon { font-size:18px; animation:amBounce .6s infinite alternate; }
@keyframes amBounce { 0%{transform:translateY(0)}100%{transform:translateY(-3px)} }
.affmagic-flash-text { color:#fff; font-weight:700; font-size:13px; }
.affmagic-flash-cta { color:#fff; font-weight:800; font-size:13px; background:rgba(0,0,0,.2); padding:3px 12px; border-radius:20px; }

/* ================================================================
   PROMO RIBBON
   ================================================================ */
.affmagic-promo-ribbon { background:#fff; border-bottom:1px solid #f0f0f0; padding:8px 0; overflow-x:auto; -webkit-overflow-scrolling:touch; scrollbar-width:none; }
.affmagic-promo-ribbon::-webkit-scrollbar { display:none; }
.affmagic-promo-inner { display:flex; gap:12px; padding:0 12px; min-width:max-content; }
.affmagic-promo-item { display:flex; align-items:center; gap:4px; font-size:11px; font-weight:600; background:#f8f5ff; padding:4px 10px; border-radius:20px; white-space:nowrap; flex-shrink:0; }
.affmagic-promo-icon { font-size:13px; }

/* ================================================================
   MAIN LAYOUT — Sidebars sticky INSIDE the plugin wrapper only
   ================================================================ */
.affmagic-main-layout {
    display: flex;
    align-items: stretch;   /* sidebars fill full height of container */
    width: 100%;
    max-width: 100%;
    gap: 0;
    position: relative;
}

/* Sidebars: hidden on mobile, static on desktop.
   They never scroll — only the center column scrolls.
   100% contained inside the plugin, no dependency on ancestors. */
.affmagic-sidebar {
    display: none;
    width: 210px;
    flex-shrink: 0;
    padding: 8px;
    position: relative;
    z-index: 10;
}
.affmagic-sidebar-inner {
    position: static;
}

.affmagic-center { flex: 1; min-width: 0; }

/* (Desktop widget removed — keeping space for future use) */

/* ================================================================
   PRODUCT GRID
   ================================================================ */
.affmagic-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 6px;
    padding: 6px;
}

/* ================================================================
   PRODUCT CARD — Compact, no wasted space
   ================================================================ */
.affmagic-card {
    background: var(--am-bg-card);
    border-radius: var(--am-radius);
    overflow: hidden;
    box-shadow: var(--am-shadow);
    position: relative;
    transition: transform .35s cubic-bezier(.34,1.56,.64,1), box-shadow .35s, border-color .3s;
    animation: amFadeIn .5s ease-out both;
    border: 1.5px solid transparent;
}
.affmagic-card:hover {
    border-color: rgba(168,85,247,.25);
    box-shadow: 0 8px 25px rgba(168,85,247,.12), 0 0 0 1px rgba(168,85,247,.1);
}
.affmagic-card:nth-child(odd) { animation-delay:.05s }
.affmagic-card:nth-child(even) { animation-delay:.1s }
.affmagic-card:nth-child(3) { animation-delay:.15s }
.affmagic-card:nth-child(4) { animation-delay:.2s }
@keyframes amFadeIn { from{opacity:0;transform:translateY(24px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)} }
.affmagic-card:active { transform: scale(.96); }

/* Subtle gradient glow behind hot cards */
.affmagic-card:nth-child(-n+4)::before {
    content:''; position:absolute; top:-2px; left:-2px; right:-2px; bottom:-2px;
    background:linear-gradient(135deg, rgba(255,77,79,.15), rgba(168,85,247,.1), rgba(250,173,20,.15));
    border-radius:calc(var(--am-radius) + 2px); z-index:-1;
    opacity:0; transition:opacity .3s;
}
.affmagic-card:nth-child(-n+4):hover::before { opacity:1; }

/* Badges */
.affmagic-badges { position:absolute; top:6px; left:6px; display:flex; flex-direction:column; gap:3px; z-index:5; }
.affmagic-badge { font-size:9px; font-weight:800; padding:2px 6px; border-radius:4px; text-transform:uppercase; letter-spacing:.5px; line-height:1.4; }
.badge-hot { background:linear-gradient(135deg,#ff4d4f,#ff7a45); color:#fff; animation:amGlow 1.5s ease-in-out infinite; }
@keyframes amGlow { 0%,100%{box-shadow:0 0 6px rgba(255,77,79,.5)}50%{box-shadow:0 0 14px rgba(255,77,79,.8)} }
.badge-new { background:linear-gradient(135deg,#667eea,#764ba2); color:#fff; }
.badge-discount {
    background:#ff4d4f; color:#fff; font-weight:900;
    animation:amBadgePop .6s ease-out both;
}
@keyframes amBadgePop { 0%{transform:scale(0) rotate(-20deg)}60%{transform:scale(1.2) rotate(3deg)}100%{transform:scale(1) rotate(0)} }
.badge-free { background:linear-gradient(135deg,#52c41a,#73d13d); color:#fff; }

/* Ribbon effect on discount badge */
.badge-discount::after {
    content:''; position:absolute; top:0; left:-60%; width:40%; height:100%;
    background:linear-gradient(90deg,transparent,rgba(255,255,255,.4),transparent);
    animation:amBadgeShine 2.5s infinite;
}
@keyframes amBadgeShine { 0%{left:-60%}100%{left:120%} }

/* ================================================================
   IMAGE — 0 VIDE, 0 GAP — méthode la plus simple et fiable
   padding-top:100% = carré relatif à la largeur du PARENT
   img en position:absolute remplit tout le conteneur
   La carte parent (overflow:hidden + border-radius) clippe les coins
   ================================================================ */
.affmagic-card-img {
    position: relative;
    display: block;
    width: 100%;
    margin: 0;
    padding: 0;
    padding-top: 100%; /* 100% de la largeur parent = carré parfait */
    overflow: hidden;
    background: linear-gradient(135deg,#e8dff5,#fce7f3);
    text-decoration: none;
    /* Pas de border-radius ici : la carte parent le fait déjà avec overflow:hidden */
}
.affmagic-card-img img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%  !important;  /* force: le thème WP met souvent width:auto */
    height: 100% !important;  /* force: le thème WP met height:auto sur img */
    max-width: none  !important;  /* neutralise theme max-width */
    max-height: none !important;  /* neutralise theme max-height:100% */
    min-height: 0;
    object-fit: cover;
    object-position: center center;
    transition: transform .6s cubic-bezier(.25,.46,.45,.94), filter .4s;
    display: block;
}
.affmagic-card:hover .affmagic-card-img img { transform:scale(1.05); filter:brightness(1.03) saturate(1.05); }
.affmagic-card-img-placeholder {
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 100%;
    display: flex; align-items: center; justify-content: center;
    background: linear-gradient(135deg,#a78bfa,#ec4899); font-size: 48px;
}

/* Subtle shine on hover only — keep image clean */
.affmagic-card-img::after {
    content:''; position:absolute; top:0; left:0; width:100%; height:100%; z-index:1; pointer-events:none;
    background:linear-gradient(105deg, transparent 40%, rgba(255,255,255,.12) 45%, rgba(255,255,255,.2) 50%, rgba(255,255,255,.12) 55%, transparent 60%);
    background-size:300% 100%;
    opacity:0; transition:opacity .4s;
}
.affmagic-card:hover .affmagic-card-img::after { opacity:1; animation:amImgShimmer 1.5s ease-out; }
@keyframes amImgShimmer { 0%{background-position:200% 0} 100%{background-position:-200% 0} }

/* Overlay — completely hidden */
.affmagic-card-overlay { display:none !important; }

/* ── WOW EFFECT on ALL cards ──
   Animated rainbow border glow + lift on hover */
.affmagic-card {
    border:2px solid transparent;
    background-clip:padding-box;
}
.affmagic-card::after {
    content:''; position:absolute; top:-3px; left:-3px; right:-3px; bottom:-3px;
    border-radius:calc(var(--am-radius) + 3px); z-index:-1;
    background:linear-gradient(135deg, #a855f7, #ec4899, #f59e0b, #3b82f6, #a855f7);
    background-size:300% 300%;
    opacity:0;
    transition:opacity .4s;
    animation:amRainbowBorder 3s ease infinite paused;
}
.affmagic-card:hover::after {
    opacity:1;
    animation-play-state:running;
}
.affmagic-card:hover {
    transform:translateY(-8px) scale(1.03) !important;
    box-shadow:0 12px 35px rgba(168,85,247,.25), 0 0 20px rgba(236,72,153,.15) !important;
}
@keyframes amRainbowBorder {
    0%{background-position:0% 50%} 50%{background-position:100% 50%} 100%{background-position:0% 50%}
}

/* Viewers */
.affmagic-viewers {
    position:absolute; bottom:4px; left:4px;
    display:flex; align-items:center; gap:4px;
    background:rgba(0,0,0,.65); color:#fff; font-size:9px; font-weight:600;
    padding:2px 6px; border-radius:20px; backdrop-filter:blur(4px);
}
.affmagic-viewers-dot { width:5px; height:5px; background:#52c41a; border-radius:50%; animation:amDotPulse 1.5s infinite; }
@keyframes amDotPulse { 0%,100%{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(.7)} }

/* Card Info — COMPACT */
.affmagic-card-info { padding: 6px 7px 8px; }
.affmagic-card-title {
    font-size: 11px; font-weight: 700; line-height: 1.3; margin: 0 0 2px;
    display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}
.affmagic-card-child { font-size:9px; color:var(--am-primary); margin:0 0 3px; font-weight:600; }

/* Meta row: features + rating inline */
.affmagic-card-meta-row {
    display: flex; flex-wrap: wrap; align-items: center; gap: 3px; margin-bottom: 4px;
}
.affmagic-feature { font-size:8px; color:#6b5ce7; background:#f5f0ff; padding:1px 4px; border-radius:3px; font-weight:600; white-space:nowrap; }
.affmagic-card-rating-inline { display:flex; align-items:center; gap:2px; margin-left:auto; }
.star-full { color:#fbbf24; font-size:10px; }
.affmagic-rating-num { font-size:9px; font-weight:700; color:var(--am-accent); }
.affmagic-review-count { font-size:8px; color:var(--am-text-light); }

/* Price */
.affmagic-card-price { display:flex; align-items:baseline; gap:4px; flex-wrap:wrap; margin-bottom:3px; }
.affmagic-price-original { font-size:10px; color:#9ca3af; text-decoration:line-through; }
.affmagic-price-current {
    font-size:16px; font-weight:900; color:var(--am-primary); letter-spacing:-.5px; line-height:1;
    animation:amPriceIn .5s ease-out;
}
@keyframes amPriceIn { from{transform:scale(.5);opacity:0}60%{transform:scale(1.15)}to{transform:scale(1);opacity:1} }
.affmagic-price-save { font-size:8px; color:#fff; background:var(--am-primary); padding:1px 4px; border-radius:3px; font-weight:700; }

/* Sold bar */
.affmagic-sold-bar { position:relative; height:14px; background:#ffeae8; border-radius:10px; overflow:hidden; margin-bottom:5px; }
.affmagic-sold-progress { height:100%; background:linear-gradient(90deg,#ff4d4f,#ff9a45); border-radius:10px; animation:amProgress 1.5s ease-out; position:relative; }
@keyframes amProgress { from{width:0} }
.affmagic-sold-progress::after { content:''; position:absolute; top:0; right:0; bottom:0; width:30px; background:linear-gradient(90deg,transparent,rgba(255,255,255,.4)); animation:amShine 2s infinite; }
@keyframes amShine { 0%{opacity:0}50%{opacity:1}100%{opacity:0} }
.affmagic-sold-text { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; font-size:8px; font-weight:700; color:var(--am-primary-dark); }

/* CTA */
.affmagic-card-actions { display:flex; gap:4px; }
.affmagic-btn-buy {
    flex:1; display:flex; align-items:center; justify-content:center; gap:3px;
    padding:7px 4px; background:var(--am-gradient); color:#fff !important;
    font-size:10px; font-weight:800; border:none; border-radius:var(--am-radius-sm);
    cursor:pointer; text-decoration:none !important; transition:all .3s;
    position:relative; overflow:hidden; text-align:center; line-height:1.2;
}
.affmagic-btn-buy::before {
    content:''; position:absolute; top:0; left:-100%; width:100%; height:100%;
    background:linear-gradient(90deg,transparent,rgba(255,255,255,.3),transparent); transition:left .5s;
}
.affmagic-btn-buy:hover::before { left:100%; }
.affmagic-btn-buy:hover { transform:translateY(-2px); box-shadow:0 6px 18px rgba(255,77,79,.45); }

/* Pulse attention effect on buy buttons */
.affmagic-btn-buy { animation: amBtnPulse 3s ease-in-out infinite; }
@keyframes amBtnPulse { 0%,100%{box-shadow:0 2px 8px rgba(255,77,79,.2)}50%{box-shadow:0 2px 16px rgba(255,77,79,.45)} }
.affmagic-btn-icon { font-size:13px; }

.affmagic-btn-preview {
    display:flex; align-items:center; justify-content:center;
    padding:7px 8px; background:#f5f0ff; color:#7c3aed !important;
    font-size:10px; font-weight:700; border:1px solid #e9d5ff; border-radius:var(--am-radius-sm);
    cursor:pointer; text-decoration:none !important; transition:all .2s; white-space:nowrap;
}
.affmagic-btn-preview:hover { background:#ede9fe; transform:translateY(-1px); }

.affmagic-btn-read-free {
    flex:1; display:flex; align-items:center; justify-content:center; gap:4px;
    padding:7px 4px; background:linear-gradient(135deg,#52c41a,#73d13d); color:#fff !important;
    font-size:10px; font-weight:800; border:none; border-radius:var(--am-radius-sm);
    cursor:pointer; text-decoration:none !important; transition:all .3s;
}
.affmagic-btn-read-free:hover { transform:translateY(-1px); box-shadow:0 4px 12px rgba(82,196,26,.3); }

/* ================================================================
   SIDEBAR AD CARDS
   ================================================================ */
.affmagic-ad-card {
    background: #fff;
    border-radius: var(--am-radius);
    padding: 16px 14px;
    margin-bottom: 10px;
    box-shadow: var(--am-shadow);
    text-align: center;
    position: relative;
    overflow: hidden;
}
.affmagic-ad-card strong { display:block; font-size:14px; margin:6px 0 8px; color:var(--am-text); }
.affmagic-ad-card p { font-size:12px; color:var(--am-text-light); margin:0 0 10px; line-height:1.5; }
.affmagic-ad-emoji { font-size:32px; display:block; }
.affmagic-ad-glow {
    position:absolute; top:-50%; left:-50%; width:200%; height:200%;
    background:conic-gradient(transparent, rgba(168,85,247,.08), transparent 30%);
    animation:amRotateShine 6s linear infinite; pointer-events:none;
}
@keyframes amRotateShine { to{transform:rotate(360deg)} }
.affmagic-ad-btn {
    display:inline-block; padding:8px 18px; background:var(--am-gradient); color:#fff !important;
    font-size:12px; font-weight:800; border-radius:25px; text-decoration:none !important;
    transition:all .3s; box-shadow:0 3px 12px rgba(255,77,79,.3);
}
.affmagic-ad-btn:hover { transform:translateY(-2px); box-shadow:0 6px 20px rgba(255,77,79,.4); }
.affmagic-ad-btn-gold { background:linear-gradient(135deg,#fbbf24,#f59e0b,#d97706) !important; box-shadow:0 3px 12px rgba(245,158,11,.4) !important; }

/* Note: sidebar itself is sticky, individual cards inside don't need sticky */
.affmagic-sticky-ad { /* reserved for future use */ }

/* Stats */
.affmagic-ad-stats .affmagic-stat-row {
    display:flex; justify-content:space-between; align-items:center;
    padding:6px 0; border-bottom:1px solid #f3f0ff; font-size:12px; color:var(--am-text-light);
}
.affmagic-stat-num { font-size:16px; font-weight:900; color:var(--am-primary); }

/* Promo countdown */
.affmagic-promo-price { font-size:14px; margin:8px 0 !important; }
.affmagic-old-p { text-decoration:line-through; color:#9ca3af; font-size:12px; }
.affmagic-new-p { font-size:20px; font-weight:900; color:var(--am-primary); }
.affmagic-countdown { display:flex; justify-content:center; gap:4px; margin:10px 0; }
.affmagic-cd-block { background:#1e0a3c; color:#fff; padding:4px 8px; border-radius:6px; font-weight:800; }
.affmagic-cd-num { font-size:16px; }
.affmagic-cd-label { font-size:9px; color:rgba(255,255,255,.6); margin-left:1px; }
.affmagic-cd-sep { color:var(--am-primary); font-weight:900; font-size:18px; line-height:30px; }

/* Premium list */
.affmagic-premium-list { list-style:none; padding:0; margin:8px 0 12px; text-align:left; }
.affmagic-premium-list li { font-size:12px; padding:4px 0; color:var(--am-text); }

/* Bestsellers */
.affmagic-best-item {
    display:flex; align-items:center; gap:8px; padding:8px 4px; border-bottom:1px solid #f3f0ff;
    text-decoration:none !important; transition:background .2s;
}
.affmagic-best-item:hover { background:#f8f5ff; }
.affmagic-best-rank { font-size:14px; font-weight:900; color:var(--am-accent); min-width:24px; }
.affmagic-best-img { width:36px; height:36px; border-radius:6px; object-fit:cover; }
.affmagic-best-info { flex:1; min-width:0; }
.affmagic-best-title { font-size:11px; font-weight:600; color:var(--am-text); display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.affmagic-best-price { font-size:12px; font-weight:800; color:var(--am-primary); }
.affmagic-free-label { color:var(--am-success) !important; }

/* Theme tags */
.affmagic-theme-tags { display:flex; flex-wrap:wrap; gap:4px; margin:8px 0 12px; justify-content:center; }
.affmagic-theme-tag {
    font-size:10px; font-weight:600; background:#f5f0ff; color:#6b5ce7;
    padding:4px 8px; border-radius:15px; white-space:nowrap; cursor:pointer;
    transition:all .2s; border:1px solid transparent;
}
.affmagic-theme-tag:hover { background:#ede9fe; border-color:#c4b5fd; transform:translateY(-1px); }

/* ================================================================
   QUICK PREVIEW MODAL — WooCommerce Product Details
   ================================================================ */
.affmagic-modal-backdrop {
    position:fixed; inset:0; background:rgba(0,0,0,.6); z-index:10000;
    display:flex; align-items:center; justify-content:center; padding:12px;
    opacity:0; transition:opacity .3s; pointer-events:none;
    backdrop-filter:blur(4px);
}
.affmagic-modal-backdrop.am-active { opacity:1; pointer-events:all; }

.affmagic-modal {
    background:#fff; border-radius:20px; max-width:540px; width:100%;
    max-height:92vh; overflow-y:auto; position:relative;
    transform:translateY(30px) scale(.95); transition:transform .3s cubic-bezier(.34,1.56,.64,1);
    box-shadow:0 25px 60px rgba(0,0,0,.3);
    scroll-behavior:smooth;
    scrollbar-width:thin; scrollbar-color:rgba(168,85,247,.3) transparent;
}
.affmagic-modal::-webkit-scrollbar { width:5px; }
.affmagic-modal::-webkit-scrollbar-thumb { background:rgba(168,85,247,.3); border-radius:4px; }
.affmagic-modal-backdrop.am-active .affmagic-modal { transform:translateY(0) scale(1); }

.affmagic-modal-close {
    position:sticky; top:10px; float:right; margin:10px 10px 0 0; width:34px; height:34px;
    background:rgba(0,0,0,.55); color:#fff; border:none; border-radius:50%;
    font-size:18px; cursor:pointer; z-index:10; display:flex; align-items:center; justify-content:center;
    transition:background .2s; backdrop-filter:blur(4px);
}
.affmagic-modal-close:hover { background:rgba(0,0,0,.85); }

/* Modal cover image — portrait, fills width */
.affmagic-modal-cover { position:relative; }
.affmagic-modal-img {
    display:block; width:100%; aspect-ratio:3/4; object-fit:cover;
    border-radius:20px 20px 0 0;
}
.affmagic-modal-img-placeholder {
    width:100%; aspect-ratio:3/4; display:flex; align-items:center; justify-content:center;
    background:linear-gradient(135deg,#a78bfa,#ec4899); font-size:64px; border-radius:20px 20px 0 0;
}

.affmagic-modal-body { padding:16px; }
.affmagic-modal-title { font-size:18px; font-weight:800; margin:0 0 6px; line-height:1.3; }
.affmagic-modal-child { font-size:13px; color:var(--am-primary); font-weight:600; margin:0 0 8px; }
.affmagic-modal-features { display:flex; flex-wrap:wrap; gap:6px; margin-bottom:10px; }
.affmagic-modal-feat { font-size:11px; color:#6b5ce7; background:#f5f0ff; padding:3px 8px; border-radius:12px; font-weight:600; }

.affmagic-modal-rating { display:flex; align-items:center; gap:4px; margin-bottom:10px; }
.affmagic-modal-stars { color:#fbbf24; font-size:16px; }
.affmagic-modal-rating-num { font-size:13px; font-weight:700; }
.affmagic-modal-reviews { font-size:12px; color:var(--am-text-light); }

.affmagic-modal-price-row { display:flex; align-items:baseline; gap:8px; margin-bottom:12px; }
.affmagic-modal-price-old { font-size:14px; color:#9ca3af; text-decoration:line-through; }
.affmagic-modal-price-new { font-size:26px; font-weight:900; color:var(--am-primary); }
.affmagic-modal-discount { font-size:11px; color:#fff; background:var(--am-primary); padding:2px 8px; border-radius:10px; font-weight:700; }

.affmagic-modal-desc { font-size:13px; color:var(--am-text-light); line-height:1.6; margin-bottom:14px; }
.affmagic-modal-desc strong { color:var(--am-text); }

.affmagic-modal-actions { display:flex; gap:8px; }
.affmagic-modal-btn-buy {
    flex:1; padding:12px; background:var(--am-gradient); color:#fff !important;
    font-size:15px; font-weight:800; border:none; border-radius:12px;
    cursor:pointer; text-decoration:none !important; text-align:center;
    transition:all .3s; display:flex; align-items:center; justify-content:center; gap:6px;
}
.affmagic-modal-btn-buy:hover { transform:translateY(-2px); box-shadow:0 8px 25px rgba(255,77,79,.4); }
.affmagic-modal-btn-read {
    padding:12px 18px; background:#f5f0ff; color:#7c3aed !important;
    font-size:14px; font-weight:700; border:1px solid #e9d5ff; border-radius:12px;
    cursor:pointer; text-decoration:none !important; text-align:center; transition:all .2s;
}
.affmagic-modal-btn-read:hover { background:#ede9fe; }

.affmagic-modal-trust { display:flex; justify-content:center; gap:16px; margin-top:12px; padding-top:12px; border-top:1px solid #f0f0f0; }
.affmagic-modal-trust span { font-size:10px; color:var(--am-text-light); font-weight:600; }

/* ================================================================
   PRODUCT FICHE — WooCommerce details (scroll down in modal)
   ================================================================ */
.affmagic-modal-fiche {
    border-top:3px solid #f0f0f0;
}

.affmagic-fiche-divider {
    text-align:center; padding:14px 0 6px;
    position:relative;
}
.affmagic-fiche-divider span {
    display:inline-block; font-size:11px; font-weight:700; color:var(--am-text-light);
    background:#fff; padding:0 12px; position:relative; z-index:1;
    letter-spacing:.5px; text-transform:uppercase;
    animation:amBounceDown 2s ease-in-out infinite;
}
@keyframes amBounceDown { 0%,100%{transform:translateY(0)}50%{transform:translateY(4px)} }
.affmagic-fiche-divider::before {
    content:''; position:absolute; left:20%; right:20%; top:50%;
    border-top:1px dashed #e5e7eb; z-index:0;
}

.affmagic-fiche-section {
    padding:14px 18px;
    border-bottom:1px solid #f5f5f5;
}
.affmagic-fiche-title {
    font-size:14px; font-weight:800; color:var(--am-text); margin:0 0 8px;
    display:flex; align-items:center; gap:6px;
}
.affmagic-fiche-desc {
    font-size:13px; color:var(--am-text-light); line-height:1.7; margin:0;
}
.affmagic-fiche-desc strong { color:var(--am-text); }

/* Story excerpt — italic, styled quote */
.affmagic-fiche-story {
    background:linear-gradient(135deg,#faf5ff,#fce7f3 50%,#fef3c7);
}
.affmagic-fiche-excerpt {
    font-size:14px; color:#6d28d9; font-style:italic; line-height:1.7;
    margin:0 0 8px; padding:12px 16px;
    background:rgba(255,255,255,.6); border-radius:10px;
    border-left:3px solid #a855f7;
    font-family:Georgia,'Times New Roman',serif;
}
.affmagic-fiche-teaser {
    font-size:12px; color:#db2777; font-weight:700; text-align:center;
    margin:0; padding:4px 0 0;
}

/* Specs grid */
.affmagic-fiche-specs {
    display:grid; grid-template-columns:1fr 1fr; gap:8px;
}
.affmagic-spec-item {
    display:flex; align-items:center; gap:8px;
    background:#f8f5ff; border-radius:10px; padding:8px 10px;
    font-size:12px;
}
.affmagic-spec-icon { font-size:18px; flex-shrink:0; }
.affmagic-spec-label { font-size:10px; color:var(--am-text-light); }
.affmagic-spec-val { font-size:12px; font-weight:700; color:var(--am-text); margin-left:auto; }

/* Feature list */
.affmagic-fiche-list {
    list-style:none; padding:0; margin:0;
}
.affmagic-fiche-list li {
    font-size:13px; color:var(--am-text); line-height:1.6; padding:4px 0;
    border-bottom:1px solid #faf5ff;
}
.affmagic-fiche-list li:last-child { border-bottom:none; }
.affmagic-fiche-list li strong { color:var(--am-text); }

/* Gift idea */
.affmagic-fiche-gift {
    display:flex; align-items:flex-start; gap:12px;
    padding:16px 18px; margin:0;
    background:linear-gradient(135deg,#faf5ff,#fce7f3);
    border-bottom:1px solid #f5f5f5;
}
.affmagic-fiche-gift span:first-child { font-size:28px; flex-shrink:0; }
.affmagic-fiche-gift strong { display:block; font-size:14px; color:var(--am-text); margin-bottom:4px; }
.affmagic-fiche-gift p { font-size:12px; color:var(--am-text-light); line-height:1.5; margin:0; }

/* Bottom CTA in fiche */
.affmagic-fiche-bottom-cta {
    padding:16px 18px 20px; text-align:center;
    background:linear-gradient(to top, #faf5ff, #fff);
}
.affmagic-fiche-buy-btn {
    display:block !important; width:100%; padding:14px !important;
    font-size:16px !important; border-radius:14px !important;
    box-shadow:0 6px 25px rgba(255,77,79,.3) !important;
}
.affmagic-fiche-woo-link {
    display:inline-block; margin-top:10px; font-size:11px; color:#7c3aed !important;
    text-decoration:underline !important; font-weight:600;
}

/* ================================================================
   BOTTOM CTA
   ================================================================ */
.affmagic-bottom-cta { background:linear-gradient(135deg,#1e0a3c 0%,#4a1a7a 50%,#7c3aed 100%); padding:20px 12px; margin-top:8px; }
.affmagic-bottom-inner { max-width:1200px; margin:0 auto; display:flex; flex-direction:column; align-items:center; gap:12px; text-align:center; }
.affmagic-bottom-text { display:flex; flex-direction:column; align-items:center; gap:6px; color:#fff; }
.affmagic-bottom-icon { font-size:32px; animation:amSparkle 2s ease-in-out infinite; }
.affmagic-bottom-text strong {
    font-size:16px; font-weight:800;
    background:linear-gradient(90deg,#fbbf24,#f472b6); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text;
}
.affmagic-bottom-text p { font-size:12px; color:rgba(255,255,255,.8); margin:0; line-height:1.5; }
.affmagic-btn-create {
    display:inline-flex; align-items:center; gap:6px; padding:12px 24px;
    background:var(--am-gradient); color:#fff !important; font-size:14px; font-weight:800;
    border:none; border-radius:30px; cursor:pointer; text-decoration:none !important;
    transition:all .3s; box-shadow:0 4px 20px rgba(255,77,79,.4); position:relative; overflow:hidden;
}
.affmagic-btn-create:hover { transform:translateY(-2px) scale(1.03); box-shadow:0 6px 25px rgba(255,77,79,.5); }

/* ================================================================
   IMMERSIVE BOOK READER — Full-screen embedded
   ================================================================ */
.affmagic-reader-backdrop {
    position:fixed; inset:0; background:rgba(10,5,30,.92); z-index:10001;
    display:flex; align-items:center; justify-content:center;
    opacity:0; transition:opacity .3s; pointer-events:none;
    backdrop-filter:blur(8px);
}
.affmagic-reader-backdrop.am-active { opacity:1; pointer-events:all; }

.affmagic-reader {
    width:100%; max-width:640px; height:95vh; max-height:95vh;
    display:flex; flex-direction:column;
    background:linear-gradient(180deg,#1a0533 0%,#0f0620 100%);
    border-radius:20px; overflow:hidden;
    box-shadow:0 30px 80px rgba(0,0,0,.6);
    transform:scale(.92); transition:transform .4s cubic-bezier(.34,1.56,.64,1);
}
.affmagic-reader-backdrop.am-active .affmagic-reader { transform:scale(1); }

.affmagic-reader-header {
    display:flex; align-items:center; justify-content:space-between;
    padding:12px 16px; background:rgba(255,255,255,.06);
    border-bottom:1px solid rgba(255,255,255,.08);
    flex-shrink:0;
}
.affmagic-reader-header h3 {
    font-size:14px; font-weight:700; color:#e2d6f8; margin:0;
    white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:60%;
}
.affmagic-reader-controls { display:flex; align-items:center; gap:10px; }
#affmagic-reader-counter {
    font-size:12px; color:rgba(255,255,255,.5); font-weight:600;
    background:rgba(255,255,255,.08); padding:3px 10px; border-radius:20px;
}
.affmagic-reader-close-btn {
    width:32px; height:32px; background:rgba(255,255,255,.1); color:#fff;
    border:none; border-radius:50%; font-size:20px; cursor:pointer;
    display:flex; align-items:center; justify-content:center; transition:background .2s;
}
.affmagic-reader-close-btn:hover { background:rgba(255,77,79,.6); }

/* Viewport */
.affmagic-reader-viewport {
    flex:1; overflow-y:auto; overflow-x:hidden;
    padding:0; display:flex; flex-direction:column;
    -webkit-overflow-scrolling:touch;
    cursor:grab; user-select:none;
}
.affmagic-reader-viewport:active { cursor:grabbing; }

.affmagic-reader-loading {
    flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center;
    color:rgba(255,255,255,.6); font-size:14px; gap:8px;
}

/* Nav bar */
.affmagic-reader-nav {
    display:flex; align-items:center; justify-content:space-between;
    padding:10px 12px; background:rgba(255,255,255,.05);
    border-top:1px solid rgba(255,255,255,.08); flex-shrink:0;
}
.affmagic-reader-nav-btn {
    padding:8px 16px; background:rgba(255,255,255,.1); color:#e2d6f8;
    border:1px solid rgba(255,255,255,.15); border-radius:10px;
    font-size:12px; font-weight:700; cursor:pointer; transition:all .2s;
    white-space:nowrap;
}
.affmagic-reader-nav-btn:hover:not(:disabled) { background:rgba(168,85,247,.3); border-color:rgba(168,85,247,.5); }
.affmagic-reader-nav-btn:disabled { opacity:.3; cursor:default; }

/* Dots */
.affmagic-reader-dots { display:flex; gap:4px; align-items:center; overflow-x:auto; max-width:50%; scrollbar-width:none; }
.affmagic-reader-dots::-webkit-scrollbar { display:none; }
.affmagic-reader-dot {
    width:8px; height:8px; border-radius:50%; background:rgba(255,255,255,.2);
    flex-shrink:0; cursor:pointer; transition:all .2s;
}
.affmagic-reader-dot.active { background:#a78bfa; transform:scale(1.3); box-shadow:0 0 8px rgba(167,139,250,.5); }

/* ── Reader Pages ── */
/* Cover */
.affmagic-rp-cover {
    flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center;
    padding:24px; text-align:center;
}
.affmagic-rp-cover-img {
    width:100%; max-width:360px; max-height:55vh; object-fit:contain;
    border-radius:16px; box-shadow:0 12px 40px rgba(0,0,0,.4);
    margin-bottom:16px;
}
.affmagic-rp-cover-placeholder {
    width:240px; height:320px; display:flex; align-items:center; justify-content:center;
    background:linear-gradient(135deg,#a78bfa,#ec4899); border-radius:16px;
    font-size:64px; margin-bottom:16px;
}
.affmagic-rp-cover-title {
    font-size:22px; font-weight:900; color:#fff; margin:0 0 6px;
    background:linear-gradient(90deg,#fbbf24,#f472b6,#a78bfa);
    -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text;
}
.affmagic-rp-cover-child { font-size:14px; color:rgba(255,255,255,.6); margin:0; }

/* Story page */
.affmagic-rp-page { flex:1; display:flex; flex-direction:column; }
.affmagic-rp-page-img {
    width:100%; max-height:50vh; object-fit:cover;
}
.affmagic-rp-page-img-placeholder {
    width:100%; height:200px; display:flex; flex-direction:column; align-items:center; justify-content:center;
    background:linear-gradient(135deg,#2d1259,#4a1a7a); color:rgba(255,255,255,.4); gap:4px; font-size:40px;
}
.affmagic-rp-page-img-placeholder small { font-size:11px; }
.affmagic-rp-page-text { padding:16px 20px; flex:1; }
.affmagic-rp-chapter {
    font-size:16px; font-weight:800; color:#c4b5fd; margin:0 0 8px;
}
.affmagic-rp-story {
    font-size:15px; line-height:1.75; color:rgba(255,255,255,.85); margin:0;
    font-family:Georgia,'Times New Roman',serif;
}

/* Locked page */
.affmagic-rp-locked {
    flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center;
    padding:32px; text-align:center; color:#fff;
}
.affmagic-rp-locked h3 { font-size:20px; font-weight:800; margin:12px 0 8px; }
.affmagic-rp-locked p { font-size:14px; color:rgba(255,255,255,.6); margin:0 0 16px; }

/* ================================================================
   STYLE VARIANTS
   ================================================================ */
[data-style="pinduoduo"] { --am-primary:#e02e24; --am-bg:#fef5f0; --am-gradient:linear-gradient(135deg,#e02e24,#ff6034); }
[data-style="pinduoduo"] .affmagic-topbar { background:linear-gradient(135deg,#c41d13,#e02e24); }
[data-style="magic"] { --am-primary:#8b5cf6; --am-primary-dark:#6d28d9; --am-bg:#f5f0ff; --am-gradient:linear-gradient(135deg,#8b5cf6,#ec4899 50%,#f59e0b); }
[data-style="magic"] .affmagic-topbar { background:linear-gradient(135deg,#1e0533,#3b0764 50%,#6b21a8); }

/* ================================================================
   MOBILE ≤480px
   ================================================================ */
@media (max-width:480px) {
    .affmagic-grid { gap:5px; padding:5px; grid-template-columns:repeat(2,1fr); }
    .affmagic-card-title { font-size:10px; }
    .affmagic-card-info { padding:5px 6px 7px; }
    .affmagic-price-current { font-size:14px; }
    .affmagic-btn-buy, .affmagic-btn-preview, .affmagic-btn-read-free { font-size:9px; padding:6px 3px; }
    .affmagic-badge { font-size:7px; padding:1px 4px; }
    .affmagic-sold-bar { height:12px; }
    .affmagic-sold-text { font-size:7px; }
    .affmagic-card-meta-row { gap:2px; }
    .affmagic-feature { font-size:7px; padding:1px 3px; }

    /* Mobile modal: slides up from bottom like a sheet */
    .affmagic-modal-backdrop { align-items:flex-end; padding:0; }
    .affmagic-modal {
        max-width:100%; max-height:95vh; border-radius:20px 20px 0 0;
        transform:translateY(100%);
    }
    .affmagic-modal-backdrop.am-active .affmagic-modal { transform:translateY(0); }
    .affmagic-modal-img { aspect-ratio:4/3; border-radius:20px 20px 0 0; }
    .affmagic-modal-title { font-size:16px; }
    .affmagic-modal-price-new { font-size:22px; }
    .affmagic-modal-actions { flex-direction:column; }
    .affmagic-fiche-specs { grid-template-columns:1fr 1fr; }
    .affmagic-spec-item { padding:6px 8px; }
    .affmagic-fiche-section { padding:12px 14px; }

    /* Reader mobile */
    .affmagic-reader { border-radius:0; height:100vh; max-height:100vh; }
    .affmagic-reader-header h3 { font-size:12px; max-width:50%; }
    .affmagic-reader-nav-btn { padding:6px 10px; font-size:11px; }
    .affmagic-rp-cover-title { font-size:18px; }
    .affmagic-rp-story { font-size:14px; line-height:1.7; }
    .affmagic-rp-page-text { padding:12px 14px; }
    .affmagic-rp-chapter { font-size:14px; }
}

/* ≤360px */
@media (max-width:360px) {
    .affmagic-grid { gap:4px; padding:4px; }
    .affmagic-card-title { font-size:9px; }
    .affmagic-price-current { font-size:13px; }
    .affmagic-btn-text { display:none; }
    .affmagic-btn-icon { font-size:14px; }
    .affmagic-card-meta-row { display:none; }
}

/* ================================================================
   TABLET 481-768
   ================================================================ */
@media (min-width:481px) and (max-width:768px) {
    .affmagic-grid { grid-template-columns:repeat(2,1fr); gap:8px; padding:8px; }
    .affmagic-card-title { font-size:12px; }
    .affmagic-price-current { font-size:17px; }
    .affmagic-fire-badge { display:inline-block; }
}

/* ================================================================
   TABLET-LARGE 769-1099: Show sidebars as horizontal strip
   ================================================================ */
@media (min-width:769px) and (max-width:1099px) {
    .affmagic-grid { grid-template-columns:repeat(3,1fr); gap:10px; padding:10px; }
    .affmagic-card:hover { transform:translateY(-4px) scale(1.02); box-shadow:var(--am-shadow-hover); }
    .affmagic-card-title { font-size:13px; }
    .affmagic-card-info { padding:8px 10px 10px; }
    .affmagic-price-current { font-size:18px; }
    .affmagic-fire-badge { display:inline-block; }
}

/* ================================================================
   DESKTOP 1100px+ — Show sidebars sticky + desktop widgets
   ================================================================ */
@media (min-width:1100px) {
    /* Desktop: sidebars visible & static, center scrolls alone */
    .affmagic-main-layout {
        height: calc(100vh - 100px); /* fills viewport minus topbar+promo strip */
    }
    .affmagic-sidebar {
        display: block;
        width: 210px;
        overflow-y: hidden;
    }
    .affmagic-center {
        height: 100%;
        overflow-y: auto;
        scrollbar-width: thin;
    }
    .affmagic-center::-webkit-scrollbar { width:6px; }
    .affmagic-center::-webkit-scrollbar-track { background:transparent; }
    .affmagic-center::-webkit-scrollbar-thumb { background:rgba(168,85,247,.25); border-radius:3px; }
    .affmagic-center::-webkit-scrollbar-thumb:hover { background:rgba(168,85,247,.45); }
    .affmagic-grid { grid-template-columns:repeat(3,1fr); gap:12px; padding:10px; }

    .affmagic-card { border-radius:14px; }
    .affmagic-card:hover { transform:translateY(-6px) scale(1.02); box-shadow:var(--am-shadow-hover); }
    .affmagic-card-title { font-size:13px; }
    .affmagic-card-info { padding:8px 10px 12px; }
    .affmagic-price-current { font-size:18px; }
    .affmagic-btn-buy { font-size:11px; padding:8px 6px; }
    .affmagic-fire-badge { display:inline-block; }

    .affmagic-bottom-inner { flex-direction:row; text-align:left; }
    .affmagic-bottom-text { flex-direction:row; align-items:center; }

    /* Modal on desktop: horizontal layout, fiche scrollable */
    .affmagic-modal { max-width:600px; }
    .affmagic-fiche-specs { grid-template-columns:1fr 1fr 1fr; }
}

/* ================================================================
   LARGE DESKTOP 1400px+
   ================================================================ */
@media (min-width:1400px) {
    .affmagic-sidebar { width:240px; }
    .affmagic-grid { grid-template-columns:repeat(4,1fr); gap:14px; padding:12px; }
    .affmagic-card-title { font-size:14px; }
    .affmagic-price-current { font-size:20px; }
}

/* ================================================================
   EXTRA LARGE 1700px+
   ================================================================ */
@media (min-width:1700px) {
    .affmagic-sidebar { width:280px; }
    .affmagic-grid { grid-template-columns:repeat(5,1fr); }
}

/* ================================================================
   EFFECTS
   ================================================================ */
.affmagic-price-changing { animation:amPriceChange .4s ease; }
@keyframes amPriceChange { 0%{transform:scale(1);color:var(--am-primary)}30%{transform:scale(1.3);color:var(--am-accent)}100%{transform:scale(1)} }

.affmagic-confetti-particle { position:fixed; width:8px; height:8px; border-radius:2px; pointer-events:none; z-index:9999; }

.affmagic-card.am-visible { animation:amSlideUp .5s ease-out both; }
@keyframes amSlideUp { from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)} }

/* Toast */
.affmagic-toast {
    position:fixed; bottom:20px; left:50%; transform:translateX(-50%) translateY(100px);
    background:#1e0a3c; color:#fff; padding:12px 24px; border-radius:30px;
    font-size:14px; font-weight:700; z-index:10001; box-shadow:0 8px 30px rgba(0,0,0,.3);
    transition:transform .4s cubic-bezier(.34,1.56,.64,1); white-space:nowrap; pointer-events:none;
}
.affmagic-toast.am-show { transform:translateX(-50%) translateY(0); }

/* ================================================================
   READER EXTRAS
   ================================================================ */
.affmagic-rp-cover-pages { font-size:12px; color:rgba(255,255,255,.4); margin:6px 0 0; }
.affmagic-rp-pagenum { display:block; font-size:10px; color:rgba(255,255,255,.3); margin-top:12px; text-align:center; font-style:italic; }
.affmagic-reader-dot.locked-dot { background:rgba(255,77,79,.3); }
.affmagic-rp-locked-sub { font-size:12px; color:rgba(255,255,255,.4); margin:4px 0 0; }
.affmagic-rp-locked-create { display:block; margin-top:12px; font-size:12px; color:#a78bfa !important; text-decoration:underline !important; }

/* ================================================================
   MOBILE PROMO WIDGETS — Pinduoduo style between book rows
   ================================================================ */
.affmagic-mobile-widget {
    grid-column: 1 / -1;  /* ALWAYS span full width in grid */
    border-radius:var(--am-radius);
    overflow:hidden;
    margin:4px 0;
    animation: amWidgetSlideIn .6s ease-out both;
}
@keyframes amWidgetSlideIn { from{opacity:0;transform:translateY(16px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)} }

/* Character slider */
.affmagic-widget-characters {
    background:linear-gradient(135deg,#1e0a3c,#4a1a7a);
    padding:10px;
}
.affmagic-mw-header {
    display:flex; align-items:center; gap:6px;
    font-size:13px; color:#fff; margin-bottom:8px; font-weight:700;
}
.affmagic-mw-header strong { color:#fbbf24; }
.affmagic-char-slider {
    display:flex; gap:8px; overflow-x:auto;
    -webkit-overflow-scrolling:touch; scrollbar-width:none;
    scroll-behavior:smooth;
}
.affmagic-char-slider::-webkit-scrollbar { display:none; }
.affmagic-char-slide {
    flex-shrink:0; width:80px; height:80px; border-radius:12px; overflow:hidden;
    border:2px solid rgba(255,255,255,.2); transition:transform .3s;
}
.affmagic-char-slide img { width:100%; height:100%; object-fit:cover; }
.affmagic-char-slide:hover { transform:scale(1.1); border-color:#fbbf24; }

/* Promo banner widget */
.affmagic-widget-promo {
    background:var(--am-gradient); padding:0;
}
.affmagic-mw-promo-inner {
    display:flex; align-items:center; gap:10px; padding:10px 12px;
}
.affmagic-mw-promo-icon { font-size:28px; flex-shrink:0; }
.affmagic-mw-promo-text { flex:1; min-width:0; }
.affmagic-mw-promo-text strong { display:block; font-size:12px; color:#fff; font-weight:800; }
.affmagic-mw-promo-text p { font-size:10px; color:rgba(255,255,255,.8); margin:2px 0 0; }
.affmagic-mw-promo-btn {
    flex-shrink:0; padding:6px 14px; background:rgba(0,0,0,.3); color:#fff !important;
    font-size:11px; font-weight:800; border-radius:20px; text-decoration:none !important;
    transition:all .2s;
}
.affmagic-mw-promo-btn:hover { background:rgba(0,0,0,.5); }

/* Scenes grid widget */
.affmagic-widget-scenes {
    background:#fff; padding:10px;
}
.affmagic-scene-grid {
    display:grid; grid-template-columns:repeat(4,1fr); gap:6px;
}
.affmagic-scene-item {
    position:relative; border-radius:10px; overflow:hidden; aspect-ratio:1/1;
}
.affmagic-scene-item img { width:100%; height:100%; object-fit:cover; }
.affmagic-scene-label {
    position:absolute; bottom:0; left:0; right:0;
    background:linear-gradient(transparent,rgba(0,0,0,.7));
    color:#fff; font-size:8px; font-weight:700; padding:12px 4px 4px; text-align:center;
}

/* Stats badge bar */
.affmagic-widget-badges { background:linear-gradient(135deg,#1e0a3c,#2d1259); padding:12px 10px; }
.affmagic-badge-strip {
    display:flex; justify-content:space-around;
}
.affmagic-badge-item { text-align:center; color:rgba(255,255,255,.6); font-size:9px; }
.affmagic-badge-num { display:block; font-size:16px; font-weight:900; color:#fbbf24; margin-bottom:2px; animation:amCountUp .8s ease-out both; }
@keyframes amCountUp { from{opacity:0;transform:translateY(8px) scale(.8)}to{opacity:1;transform:translateY(0) scale(1)} }

/* ================================================================
   EXTRA WOW EFFECTS — Professional polish
   ================================================================ */

/* Floating sparkle particles on wrapper background */
.affmagic-wrapper::before {
    content:''; position:absolute; top:0; left:0; right:0; bottom:0; pointer-events:none; z-index:0;
    background-image:
        radial-gradient(2px 2px at 10% 20%, rgba(168,85,247,.25) 50%, transparent 50%),
        radial-gradient(2px 2px at 80% 10%, rgba(250,173,20,.2) 50%, transparent 50%),
        radial-gradient(1.5px 1.5px at 50% 60%, rgba(236,72,153,.2) 50%, transparent 50%),
        radial-gradient(2px 2px at 20% 80%, rgba(102,126,234,.25) 50%, transparent 50%),
        radial-gradient(1.5px 1.5px at 70% 50%, rgba(168,85,247,.15) 50%, transparent 50%);
    animation:amSparkleFloat 12s linear infinite;
}
.affmagic-wrapper { position:relative; }
@keyframes amSparkleFloat { 0%{transform:translateY(0)}100%{transform:translateY(-30px)} }

/* Clean card style — no rainbow/floating effects for Elementor-like presentation */

/* Price tag pop-in for current price */
.affmagic-price-current {
    display:inline-block;
    background:linear-gradient(135deg,#ff4d4f,#ff6b35);
    -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text;
}

/* Star rating sparkle */
.star-full { animation:amStarTwinkle 2s ease-in-out infinite; }
.affmagic-card:nth-child(1) .star-full { animation-delay:0s; }
.affmagic-card:nth-child(2) .star-full { animation-delay:.2s; }
.affmagic-card:nth-child(3) .star-full { animation-delay:.4s; }
@keyframes amStarTwinkle { 0%,100%{opacity:1;transform:scale(1)}50%{opacity:.7;transform:scale(1.15)} }

/* Sold progress bar — animated gradient */
.affmagic-sold-progress {
    background-size:200% 100%;
    animation:amProgressFlow 2s linear infinite, amProgress 1.5s ease-out;
}
@keyframes amProgressFlow { 0%{background-position:0% 0}100%{background-position:200% 0} }

/* Card shadow depth on scroll-reveal */
.affmagic-card.am-visible {
    box-shadow:0 2px 12px rgba(0,0,0,0.06), 0 0 0 1px rgba(168,85,247,0.04);
}

/* Character slider item glow */
.affmagic-char-slide {
    box-shadow:0 0 10px rgba(168,85,247,.3);
}
.affmagic-char-slide:nth-child(1) { animation-delay:.1s; }
.affmagic-char-slide:nth-child(2) { animation-delay:.2s; }
.affmagic-char-slide:nth-child(3) { animation-delay:.3s; }

/* Promo widget breathing glow */
.affmagic-widget-promo {
    animation:amPromoGlow 3s ease-in-out infinite;
}
@keyframes amPromoGlow { 0%,100%{box-shadow:0 0 15px rgba(255,77,79,.2)}50%{box-shadow:0 0 30px rgba(255,77,79,.4),0 0 60px rgba(250,173,20,.15)} }

/* Scene items hover zoom */
.affmagic-scene-item img { transition:transform .5s cubic-bezier(.25,.46,.45,.94); }
.affmagic-scene-item:hover img { transform:scale(1.15); }
.affmagic-scene-item::after {
    content:''; position:absolute; inset:0;
    background:linear-gradient(to top, rgba(0,0,0,.5) 0%, transparent 50%);
    pointer-events:none;
}

/* "Livres créés" badge item counter animation */
.affmagic-badge-item:nth-child(1) .affmagic-badge-num { animation-delay:.1s; }
.affmagic-badge-item:nth-child(2) .affmagic-badge-num { animation-delay:.25s; }
.affmagic-badge-item:nth-child(3) .affmagic-badge-num { animation-delay:.4s; }
.affmagic-badge-item:nth-child(4) .affmagic-badge-num { animation-delay:.55s; }

/* Micro-interaction: buy button ripple on click */
.affmagic-btn-buy:active::after {
    content:''; position:absolute; inset:0;
    background:radial-gradient(circle at center, rgba(255,255,255,.5) 0%, transparent 60%);
    animation:amRipple .4s ease-out;
}
@keyframes amRipple { from{transform:scale(0);opacity:1}to{transform:scale(2.5);opacity:0} }

/* Card title gradient on hover */
.affmagic-card:hover .affmagic-card-title {
    background:linear-gradient(90deg,#7c3aed,#ec4899);
    -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text;
}

/* Free badge pulse */
.badge-free { animation:amFreePulse 2s ease-in-out infinite; }
@keyframes amFreePulse { 0%,100%{box-shadow:0 0 4px rgba(82,196,26,.3)}50%{box-shadow:0 0 12px rgba(82,196,26,.6)} }