/* ============================================================= */
/*  STORE PAGE – COMPLETE & FINAL STYLES                        */
/* ============================================================= */

/* GENERAL */
.store-page { background:#000; color:#fff; font-family:'Poppins',sans-serif; min-height:100vh; }
.row { display:flex; margin:0; }

/* DESKTOP MENU BUTTON */
.desktop-menu-btn {
  position: fixed;
  top: 20px;
  left: 20px;
  background: #111;
  color: #fff;
  border: 1px solid #333;
  padding: 12px 18px;
  border-radius: 50px;
  font-weight: 600;
  font-size: 0.9rem;
  cursor: pointer;
  z-index: 999;
  display: flex;
  align-items: center;
  gap: 8px;
  transition: 0.3s;
  box-shadow: 0 0 15px rgba(255,0,0,0.3);
}
.desktop-menu-btn:hover {
  background: #FF0000;
  color: #fff;
  transform: scale(1.05);
}
.desktop-menu-btn i { font-size: 1.2rem; }
@media (max-width: 992px) { .desktop-menu-btn { display: none; } }
/* SIDEBAR */
.merch-sidebar {
  position:fixed; top:0; left:-300px; width:280px; height:100%; background:#111;
  padding:20px; transition:left .4s ease; z-index:1000; border-right:1px solid #333;
}
.merch-sidebar.active { left:0; }
.merch-sidebar-header { display:flex; justify-content:space-between; align-items:center; margin-bottom:30px; color:#FF0000; font-weight:900; font-size:1.4rem; }
.merch-close-btn { background:none; border:none; color:#aaa; font-size:1.5rem; cursor:pointer; }
.merch-categories a { display:block; padding:12px 0; color:#fff; text-decoration:none; font-weight:600; border-bottom:1px solid #222; transition:color .3s; }
.merch-categories a:hover { color:#FF0000; }
.merch-sidebar-footer { margin-top:40px; display:flex; flex-direction:column; gap:14px; }
.merch-sidebar-footer a { color:#aaa; text-decoration:none; font-size:.95rem; font-weight:500; transition:color .2s; }
.merch-sidebar-footer a:hover { color:#FF0000; }
.merch-newsletter { color:#FF0000 !important; font-weight:700 !important; font-size:1rem; }

/* MOBILE HEADER */
.merch-mobile-header { display:none; position:fixed; top:0; left:0; width:100%; background:#000; padding:15px 20px; justify-content:space-between; align-items:center; z-index:999; border-bottom:1px solid #222; font-weight:900; color:#FF0000; }
.merch-mobile-header button { background:none; border:none; color:#fff; font-size:1.5rem; cursor:pointer; }

/* OVERLAY */
.merch-overlay { display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,.8); z-index:998; }
.merch-overlay.active { display:block; }

/* MAIN */
.merch-main { flex:1; margin-left:0; transition:margin-left .4s; padding-top:80px; }
.merch-mobile-spacer { height:60px; }

/* HERO */
.merch-hero { position:relative; height:70vh; overflow:hidden; display:flex; align-items:center; justify-content:center; text-align:center; color:#fff; }
.merch-hero img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:.6; z-index:1; }
.merch-hero-text { position:relative; z-index:2; max-width:800px; padding:20px; }
.merch-hero-text h1 { font-size:4.5rem; font-weight:900; color:#FF0000; text-shadow:0 0 20px rgba(255,0,0,.8); margin-bottom:10px; letter-spacing:2px; }
.merch-hero-text p { font-size:1.4rem; margin-bottom:25px; font-weight:500; }
.merch-cta { background:#FF0000; color:#fff; padding:14px 32px; border-radius:50px; text-decoration:none; font-weight:700; font-size:1.1rem; display:inline-block; transition:.3s; }
.merch-cta:hover { background:#fff; color:#FF0000; transform:scale(1.05); }

/* FILTERS */
.merch-filters { display:flex; justify-content:center; gap:12px; padding:30px 20px; flex-wrap:wrap; background:#111; }
.filter-btn { background:#222; color:#aaa; border:1px solid #444; padding:10px 20px; border-radius:50px; font-size:.9rem; font-weight:600; cursor:pointer; transition:.3s; }
.filter-btn.active, .filter-btn:hover { background:#FF0000; color:#fff; border-color:#FF0000; }

/* GRID */
.merch-grid { max-width:1400px; margin:0 auto; padding:20px; }
.merch-category h2 { font-size:2.6rem; color:#FF0000; text-align:center; margin:50px 0 35px; text-shadow:0 0 15px #FF0000; font-weight:900; }
.merch-products { display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:28px; justify-items:center; }
.merch-product { background:#111; border-radius:14px; overflow:hidden; transition:all .3s; position:relative; width:100%; max-width:300px; }
.merch-product:hover { transform:translateY(-10px); box-shadow:0 0 30px rgba(255,0,0,.7); }
.merch-img { height:260px; overflow:hidden; position:relative; }
.merch-img img { width:100%; height:100%; object-fit:cover; transition:transform .4s; }
.merch-product:hover .merch-img img { transform:scale(1.1); }
.merch-tag { position:absolute; top:12px; left:12px; background:#FF0000; color:#fff; padding:4px 10px; font-size:.75rem; font-weight:700; border-radius:4px; z-index:2; }
.merch-overlay { position:absolute; inset:0; background:rgba(0,0,0,.7); display:flex; flex-direction:column; justify-content:center; align-items:center; gap:12px; opacity:0; transition:opacity .3s; z-index:3; }
.merch-product:hover .merch-overlay { opacity:1; }
.add-to-cart, .wishlist-btn { background:#FF0000; color:#fff; border:none; padding:10px 18px; border-radius:50px; font-weight:600; cursor:pointer; transition:.3s; font-size:.9rem; }
.wishlist-btn { background:rgba(255,255,255,.2); padding:10px; font-size:1.2rem; }
.add-to-cart:hover { background:#fff; color:#FF0000; }
.wishlist-btn:hover { background:#FF0000; color:#fff; }
.merch-product > p { text-align:center; margin:12px 0 6px; font-size:1.1rem; color:#fff; font-weight:500; }
.merch-price { text-align:center; color:#FF0000; font-size:1.4rem; font-weight:700; margin-bottom:12px; }

/* CART */
.cart-summary { position:fixed; right:20px; bottom:20px; background:#111; padding:20px; border-radius:16px; width:300px; max-height:80vh; overflow-y:auto; box-shadow:0 0 30px rgba(255,0,0,.4); z-index:997; border:1px solid #333; }
.cart-summary h3 { margin:0 0 15px; color:#FF0000; font-size:1.3rem; }
#cartItems:empty::after { content:"Your cart is empty"; color:#aaa; font-style:italic; display:block; text-align:center; padding:20px 0; }
.cart-total { margin:15px 0; font-weight:700; color:#FF0000; font-size:1.2rem; }
.cta-btn { width:100%; background:#FF0000; color:#fff; border:none; padding:12px; border-radius:50px; font-weight:600; cursor:pointer; margin-top:10px; transition:.3s; }
.cta-btn:hover { background:#fff; color:#FF0000; }

/* SUBSCRIBE */
.merch-subscribe { text-align:center; padding:70px 20px; background:#111; margin:50px 0; }
.merch-subscribe h2 { font-size:2.1rem; color:#FF0000; margin-bottom:12px; font-weight:900; }
.merch-subscribe p { color:#bbb; margin-bottom:22px; font-size:1rem; }
.merch-subscribe .input-wrap { display:flex; justify-content:center; max-width:420px; margin:0 auto; }
.merch-input { flex:1; padding:13px 18px; background:#222; border:none; border-radius:50px 0 0 50px; color:#fff; font-size:1rem; outline:none; }
.merch-sub-btn { background:#FF0000; color:#fff; border:none; padding:0 24px; border-radius:0 50px 50px 0; font-weight:600; cursor:pointer; transition:.3s; }
.merch-sub-btn:hover { background:#fff; color:#FF0000; }

/* MODAL */
.merch-modal { display:none; position:fixed; inset:0; background:rgba(0,0,0,.92); align-items:center; justify-content:center; z-index:1001; padding:20px; }
.merch-modal.active { display:flex; }
.merch-modal-content { background:#111; padding:32px 28px; border-radius:16px; max-width:380px; width:100%; text-align:center; position:relative; border:1px solid #333; }
.merch-modal-close { position:absolute; top:12px; right:16px; background:none; border:none; color:#aaa; font-size:1.6rem; cursor:pointer; }
.merch-modal-content h2 { color:#FF0000; margin-bottom:10px; font-size:1.8rem; font-weight:900; }
.merch-modal-content p { color:#bbb; margin-bottom:20px; font-size:.95rem; }
.merch-modal-content input { width:100%; padding:13px 16px; background:#222; border:none; border-radius:8px; color:#fff; margin-bottom:16px; font-size:1rem; }
.merch-modal-content button { background:#FF0000; color:#fff; border:none; padding:12px 28px; border-radius:50px; font-weight:600; cursor:pointer; width:100%; transition:.3s; }
.merch-modal-content button:hover { background:#fff; color:#FF0000; }

/* FLOATING CART */
.floating-cart { position:fixed; bottom:20px; left:20px; background:#FF0000; color:#fff; width:60px; height:60px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:1.5rem; cursor:pointer; box-shadow:0 0 20px rgba(255,0,0,.6); z-index:996; transition:.3s; }
.floating-cart:hover { transform:scale(1.1); }
#floatingCartCount { position:absolute; top:-8px; right:-8px; background:#fff; color:#FF0000; width:24px; height:24px; border-radius:50%; font-size:.8rem; font-weight:700; display:flex; align-items:center; justify-content:center; }

/* RESPONSIVE */
@media (max-width:992px) {
  .merch-hero-text h1 { font-size:3.5rem; }
  .merch-mobile-header { display:flex; }
  .merch-main { margin-left:0 !important; }
}
@media (max-width:768px) {
  .merch-hero { height:60vh; }
  .merch-hero-text h1 { font-size:2.8rem; }
}
@media (max-width:480px) {
  .merch-subscribe .input-wrap { flex-direction:column; }
  .merch-input { border-radius:50px; margin-bottom:12px; }
  .merch-sub-btn { border-radius:50px; }
  .cart-summary { width:90%; left:5%; right:5%; }
}