:root{--bg:#f6f7f9;--card:#ffffff;--text:#111827;--muted:#6b7280;--glass-bg: rgba(20,20,20,0.65);--glass-border: rgba(255,255,255,0.08);--accent:#00c851;--ghost:#374151;--danger:#ef4444}
*{box-sizing:border-box}html,body{height:100%}body{margin:0;font-family:Inter,system-ui,-apple-system,'Segoe UI',Roboto,'Helvetica Neue',Arial;background:var(--bg);color:var(--text)}
.container{width:92%;max-width:1100px;margin:0 auto}.site-header{background:var(--card);box-shadow:0 6px 22px rgba(10,10,10,0.04);position:sticky;top:0;z-index:60}.header-inner{display:flex;align-items:center;gap:16px;padding:12px 0;justify-content:space-between}.brand a{font-weight:700;color:var(--text);text-decoration:none;font-size:1.05rem}.main-nav{display:flex;gap:14px;align-items:center}.nav-link{color:var(--muted);text-decoration:none;font-weight:600}.nav-link.active,.nav-link:hover{color:var(--text)}.hero{padding:64px 0 36px;text-align:center}.hero .lead{color:var(--muted);max-width:760px;margin:12px auto 18px}.btn{display:inline-block;padding:10px 16px;border-radius:8px;font-weight:700;text-decoration:none;cursor:pointer}.btn.primary{background:#111827;color:#fff}.section{padding:34px 0}.grid{display:grid;gap:18px}.cols-3{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}.card{background:var(--card);border-radius:12px;padding:18px;box-shadow:0 8px 26px rgba(10,10,10,0.04);border:1px solid rgba(15,23,42,0.02);text-align:center}.card img{max-width:100%;border-radius:8px;height:160px;object-fit:cover;margin-bottom:10px}.price{font-weight:800;margin-top:8px}.cart-btn{background:transparent;border:none;position:relative;cursor:pointer;display:inline-flex;align-items:center;gap:8px}.cart-count{position:relative;top:-10px;left:-8px;background:#ef4444;color:#fff;font-size:11px;padding:3px 7px;border-radius:999px}.cart-panel{position:fixed;top:0;right:-420px;width:380px;max-width:92%;height:100%;background: rgba(20,20,20,0.75);color:#fff;backdrop-filter:blur(10px);box-shadow:-18px 10px 60px rgba(5,5,10,0.35);border-left:1px solid rgba(255,255,255,0.08);transition:right .38s;z-index:1200;display:flex;flex-direction:column;padding:18px}.cart-panel.open{right:0}.cart-items{flex:1;overflow:auto;margin-top:12px;padding-right:6px}.cart-item{display:flex;align-items:center;justify-content:space-between;padding:10px 6px;border-radius:8px;border:1px solid rgba(255,255,255,0.04);margin-bottom:10px;background:linear-gradient(180deg, rgba(255,255,255,0.03), rgba(255,255,255,0.01))}.cart-footer{margin-top:12px}.cart-actions{display:flex;gap:10px;justify-content:space-between}.cart-actions .btn{flex:1}@media(max-width:640px){.cart-panel{width:100%;right:-100%}.cart-panel.open{right:0}}

/* ✅ Payment success modal */
.success-modal {
  position: fixed;
  top: 0; left: 0;
  width: 100%; height: 100%;
  background: rgba(15,15,15,0.6);
  backdrop-filter: blur(8px);
  display: flex;
  justify-content: center;
  align-items: center;
  opacity: 0;
  visibility: hidden;
  transition: opacity .5s ease, visibility .5s ease;
  z-index: 2000;
}
.success-modal.show {
  opacity: 1;
  visibility: visible;
}
.success-modal .modal-content {
  background: rgba(255,255,255,0.1);
  border: 1px solid rgba(255,255,255,0.3);
  border-radius: 20px;
  padding: 30px 40px;
  text-align: center;
  color: #fff;
  box-shadow: 0 4px 30px rgba(0,0,0,0.3);
  animation: popin .4s ease;
}
.success-modal h2 {
  font-size: 1.4rem;
  margin-bottom: 10px;
}
.success-modal p.small {
  font-size: 0.8rem;
  color: #ccc;
  margin-top: 10px;
}
@keyframes popin {
  from { transform: scale(0.7); opacity: 0; }
  to { transform: scale(1); opacity: 1; }
}