/* ─── B2 Loyalty v2.0 – Cagnotte simple, thème clair, typo Blocksy ─────────── */

/* ══ Widget compte client ═══════════════════════════════════════════════════════ */
.b2-loyalty-widget {
    background: #fff;
    border: 1px solid #e8e8ee;
    border-radius: 16px;
    padding: 32px;
    margin: 0 0 32px;
    color: #1a1a2e;
    position: relative;
    overflow: hidden;
    box-shadow: 0 4px 24px rgba(0,0,0,.06);
}
.b2-loyalty-widget::before {
    content: '';
    position: absolute; inset: 0;
    background:
        radial-gradient(ellipse 55% 45% at 100% 0%,   rgba(255,200,50,.07) 0%, transparent 55%),
        radial-gradient(ellipse 40% 35% at 0%   100%, rgba(180,160,255,.06) 0%, transparent 55%);
    pointer-events: none;
}

/* Header */
.b2lw-header { display:flex; justify-content:space-between; align-items:center; margin-bottom:28px; }
.b2lw-title-block { display:flex; align-items:center; gap:14px; }
.b2lw-icon { font-size:2.6rem; line-height:1; animation:b2Float 3s ease-in-out infinite; }
@keyframes b2Float { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-5px)} }
.b2lw-title { font-size:.7rem; font-weight:700; color:#9898aa; margin:0 0 2px; letter-spacing:.1em; text-transform:uppercase; }
.b2lw-subtitle { font-size:.82rem; color:#7a7a90; }
.b2lw-points-badge { text-align:right; background:#f5f5fa; border:1px solid #e4e4ef; border-radius:12px; padding:12px 20px; }
.b2lw-points-number { display:block; font-size:2rem; font-weight:800; color:#1a1a2e; line-height:1; }
.b2lw-points-label { font-size:.7rem; color:#9898aa; text-transform:uppercase; letter-spacing:.1em; }

/* Barre de progression */
.b2lw-progress-section { margin-bottom:28px; }
.b2lw-progress-labels { display:flex; justify-content:space-between; font-size:.72rem; color:#9898aa; text-transform:uppercase; letter-spacing:.07em; margin-bottom:10px; font-weight:600; }
.b2lw-progress-track { height:10px; background:#ebebf3; border-radius:100px; overflow:visible; position:relative; }
.b2lw-progress-fill {
    height:100%; border-radius:100px; position:relative;
    background: linear-gradient(90deg, #f0b429, #f6d860);
    transition:width 1.3s cubic-bezier(.34,1.56,.64,1);
    min-width:4px; overflow:visible;
}
.b2lw-progress-fill::after {
    content:''; position:absolute; right:-2px; top:50%; transform:translateY(-50%);
    width:16px; height:16px; background:#fff; border-radius:50%;
    border:3px solid #f0b429; box-shadow:0 2px 8px rgba(0,0,0,.15);
}
.b2lw-progress-glow {
    position:absolute; inset:0; border-radius:100px;
    background:linear-gradient(90deg,transparent,rgba(255,255,255,.5),transparent);
    animation:b2Shimmer 2.5s infinite;
}
@keyframes b2Shimmer { 0%{transform:translateX(-100%)} 100%{transform:translateX(300%)} }
.b2lw-progress-info { display:flex; justify-content:space-between; margin-top:10px; font-size:.82rem; color:#7a7a90; }
.b2lw-progress-info strong { color:#1a1a2e; }

/* Récompenses */
.b2lw-rewards { margin-bottom:24px; }
.b2lw-rewards-title { font-size:.75rem; font-weight:700; color:#5a5a72; text-transform:uppercase; letter-spacing:.08em; margin:0 0 12px; }
.b2lw-reward-row {
    display:flex; align-items:center; justify-content:space-between; gap:12px;
    padding:14px 16px; border-radius:10px; margin-bottom:8px;
    border:1.5px solid #e8e8f0; background:#f9f9fc;
    transition:all .2s ease;
}
.b2lw-reward-row.affordable {
    border-color:#f0b429;
    background:linear-gradient(135deg, #fffdf0, #fff9e0);
    box-shadow:0 2px 12px rgba(240,180,40,.12);
}
.b2lw-reward-info { display:flex; flex-direction:column; gap:3px; }
.b2lw-reward-label { font-weight:700; font-size:.95rem; color:#1a1a2e; }
.b2lw-reward-cost { font-size:.75rem; color:#9898aa; }
.b2lw-reward-row.affordable .b2lw-reward-cost { color:#9a6f00; }
.b2lw-reward-missing { font-size:.78rem; color:#b0b0c0; font-style:italic; }

/* Bouton dépenser */
.b2lw-btn-spend {
    display:inline-flex; align-items:center; gap:6px;
    background:#1a1a2e; color:#fff; border:none; border-radius:8px;
    padding:9px 16px; font-size:.82rem; font-weight:600;
    cursor:pointer; transition:background .2s, transform .1s;
    white-space:nowrap;
}
.b2lw-btn-spend:hover { background:#2e2e50; transform:translateY(-1px); }
.b2lw-btn-spend:active { transform:translateY(0); }
.b2lw-btn-spend:disabled { opacity:.6; cursor:wait; transform:none; }

/* Footer */
.b2lw-footer { display:flex; justify-content:space-between; padding-top:18px; border-top:1px solid #ebebf3; font-size:.78rem; color:#9898aa; }

/* ══ Confirmation commande ═══════════════════════════════════════════════════════ */
.b2-order-loyalty {
    background:#fff; border:1.5px solid #e8e8f0; border-radius:14px;
    padding:24px 28px; margin:24px 0;
    box-shadow:0 4px 20px rgba(0,0,0,.05);
    position:relative; overflow:hidden;
}
.b2-order-loyalty::before {
    content:''; position:absolute; top:0; left:0; right:0; height:3px;
    background:linear-gradient(90deg,#f0b429,#f6d860,#f0b429);
    background-size:200% 100%; animation:b2GoldFlow 3s linear infinite;
}
@keyframes b2GoldFlow { 0%{background-position:0%} 100%{background-position:200%} }

.b2-order-loyalty-header { display:flex; align-items:center; gap:12px; margin-bottom:18px; }
.b2ol-icon { font-size:2rem; }
.b2-order-loyalty-header h3 { margin:0; font-size:1rem; font-weight:700; color:#1a1a2e; }
.b2-order-loyalty-header p  { margin:3px 0 0; font-size:.82rem; color:#7a7a90; }

.b2ol-earned {
    display:inline-flex; align-items:center; gap:6px;
    background:rgba(240,180,40,.1); border:1px solid rgba(200,150,0,.2);
    color:#8a6000; font-weight:700; font-size:.85rem;
    border-radius:100px; padding:5px 14px; margin-bottom:18px;
}

.b2ol-progress-wrap { margin-bottom:18px; }
.b2ol-progress-labels { display:flex; justify-content:space-between; font-size:.7rem; color:#9898aa; text-transform:uppercase; letter-spacing:.07em; font-weight:600; margin-bottom:8px; }
.b2ol-progress-track { height:8px; background:#ebebf3; border-radius:100px; overflow:hidden; }
.b2ol-progress-fill { height:100%; border-radius:100px; background:linear-gradient(90deg,#f0b429,#f6d860); transition:width 1.2s cubic-bezier(.34,1.56,.64,1); }
.b2ol-progress-info { display:flex; justify-content:space-between; margin-top:7px; font-size:.78rem; color:#7a7a90; }
.b2ol-progress-info strong { color:#1a1a2e; }

.b2ol-rewards-section { margin-top:16px; }
.b2ol-rewards-title { font-size:.78rem; font-weight:700; color:#5a5a72; text-transform:uppercase; letter-spacing:.07em; margin:0 0 10px; }
.b2ol-reward-item { display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; padding:12px 0; border-top:1px solid #ebebf3; }
.b2ol-reward-name { font-weight:700; font-size:.9rem; color:#1a1a2e; }
.b2ol-reward-tier { font-size:.72rem; color:#9898aa; }

/* Feedback coupon généré */
.b2-reward-confirmed {
    display:flex; align-items:center; gap:10px; flex-wrap:wrap;
    background:#f0fff0; border:1px solid #b0e0b0; border-radius:8px;
    padding:10px 14px; margin-top:8px; font-size:.85rem; color:#1a5c1a;
}
.b2-reward-confirmed code { background:#e0f5e0; border-radius:4px; padding:2px 8px; font-weight:700; letter-spacing:.04em; }
.b2lw-btn-copy {
    background:#fff; color:#3a3a52; border:1.5px solid #dcdcec; border-radius:6px;
    padding:4px 10px; font-size:.75rem; font-weight:600; cursor:pointer;
}
.b2lw-btn-copy:hover { border-color:#aaa; }

/* ══ Bandeau panier / checkout ═══════════════════════════════════════════════════ */
.b2-cart-banner {
    display:flex; align-items:flex-start; gap:16px;
    background:#fffdf0; border:1.5px solid rgba(200,150,0,.25);
    border-radius:12px; padding:18px 22px; margin-bottom:24px;
    position:relative; overflow:hidden;
}
.b2-cart-banner::before {
    content:''; position:absolute; top:0; left:0; right:0; height:3px;
    background:linear-gradient(90deg,#f0b429,#f6d860,#f0b429);
    background-size:200% 100%; animation:b2GoldFlow 3s linear infinite;
}
.b2-cart-banner-icon { font-size:2rem; flex-shrink:0; margin-top:2px; }
.b2-cart-banner-content { flex:1; }
.b2-cart-banner-content > strong { display:block; font-size:.95rem; color:#7a5000; margin-bottom:12px; }
.b2-cart-banner-next { margin:4px 0 0; font-size:.85rem; color:#9a6f00; }
.b2-cart-banner-rewards { display:flex; flex-direction:column; gap:8px; }
.b2-cart-reward-row {
    display:flex; align-items:center; justify-content:space-between; gap:10px; flex-wrap:wrap;
    background:#fff; border:1px solid #e8e8f0; border-radius:8px; padding:10px 14px;
}
.b2-cart-reward-row > span { font-size:.88rem; font-weight:600; color:#3a3a52; }
.b2-cart-reward-actions { display:flex; align-items:center; gap:8px; }
.b2-cart-btn { padding:6px 14px; font-size:.8rem; border-radius:7px; border:1.5px solid #1a1a2e; background:#1a1a2e; color:#fff; cursor:pointer; font-weight:600; transition:all .2s; }
.b2-cart-btn:hover { background:#2e2e50; }
.b2-cart-btn:disabled { opacity:.6; cursor:wait; }
.b2-cart-btn.success { background:#2a7a2a; border-color:#2a7a2a; cursor:default; }

/* ══ Responsive ══════════════════════════════════════════════════════════════════ */
@media (max-width:640px) {
    .b2-loyalty-widget { padding:20px 16px; }
    .b2lw-header { flex-direction:column; align-items:flex-start; gap:14px; }
    .b2lw-points-badge { align-self:stretch; text-align:center; }
    .b2-order-loyalty { padding:18px 16px; }
    .b2-cart-banner { flex-direction:column; }
    .b2lw-reward-row { flex-direction:column; align-items:flex-start; }
    .b2lw-btn-spend { width:100%; justify-content:center; }
}

/* ══ Codes sauvegardés (compte client) ══════════════════════════════════════════ */
.b2lw-coupon-wallet {
    margin-bottom: 20px;
    background: #f9f9fc;
    border: 1.5px solid #e8e8f0;
    border-radius: 12px;
    padding: 16px 18px;
}
.b2lw-coupon-wallet--used { opacity: .55; }

.b2lw-saved-coupon {
    display: flex; align-items: center; justify-content: space-between;
    gap: 12px; flex-wrap: wrap;
    padding: 12px 0; border-top: 1px solid #ebebf3;
}
.b2lw-saved-coupon:first-of-type { border-top: none; padding-top: 0; }
.b2lw-saved-coupon--used { opacity: .7; }

.b2lw-saved-coupon-info { display: flex; flex-direction: column; gap: 3px; }
.b2lw-saved-coupon-actions { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }

.b2lw-coupon-code {
    background: #f0f0f8; border: 1px solid #dcdcec; border-radius: 6px;
    padding: 4px 12px; font-size: .88rem; font-weight: 700;
    letter-spacing: .05em; color: #1a1a2e; font-family: monospace;
}
.b2lw-coupon-code--used {
    background: #f0f0f0; color: #aaa;
    text-decoration: line-through;
}

.b2lw-btn-apply-cart {
    background: #fff; color: #1a1a2e;
    border: 1.5px solid #1a1a2e; border-radius: 7px;
    padding: 5px 12px; font-size: .78rem; font-weight: 600;
    cursor: pointer; transition: all .2s;
}
.b2lw-btn-apply-cart:hover { background: #1a1a2e; color: #fff; }
.b2lw-btn-apply-cart.success { background: #2a7a2a; border-color: #2a7a2a; color: #fff; cursor: default; }

/* Bandeau panier : séparateur + sous-titre */
.b2-cart-banner-rewards--sep { margin-top: 12px; padding-top: 12px; border-top: 1px solid rgba(200,150,0,.2); }
.b2-cart-subsection-title { font-size: .78rem; color: #9a6f00; font-weight: 600; margin: 0 0 8px; }
.b2-cart-coupon-code { background: rgba(255,255,255,.7); border: 1px solid rgba(200,150,0,.3); border-radius: 5px; padding: 3px 10px; font-size: .82rem; font-weight: 700; font-family: monospace; }
.b2-cart-btn--apply { background: #1a1a2e; color: #fff; border-color: #1a1a2e; }
.b2-cart-btn--apply:hover { background: #2e2e50; }
.b2-cart-btn--apply.success { background: #2a7a2a; border-color: #2a7a2a; cursor: default; }
.b2-cart-btn--spend { background: transparent; color: #7a5000; border-color: rgba(200,150,0,.4); }
.b2-cart-btn--spend:hover { background: rgba(255,200,50,.1); }