/* Modern Category Page - Your existing CSS here */
:root {
  --ps-blue: #006fcd;
  --ps5-blue: #003087;
  --xbox-green: #107C10;
  --dark-bg: #0a0a14;
  --glass-bg: rgba(255, 255, 255, 0.08);
  --glass-border: rgba(255, 255, 255, 0.15);
}

/*body {*/
/*  background: radial-gradient(circle at 20% 20%, #0f172a, #020617);*/
/*  overflow-x: hidden;*/
/*  position: relative;*/
/*  color: #fff;*/
/*  font-family: 'Oxanium', sans-serif;*/
/*}*/

/*body::before {*/
/*  content: "";*/
/*  position: fixed;*/
/*  inset: 0;*/
/*  background: linear-gradient(*/
/*    120deg,*/
/*    rgba(0,111,205,0.2),*/
/*    rgba(16,124,16,0.2),*/
/*    rgba(255,71,87,0.2)*/
/*  );*/
/*  background-size: 300% 300%;*/
/*  animation: moveGradient 12s ease infinite;*/
/*  z-index: -2;*/
/*}*/

/*@keyframes moveGradient {*/
/*  0% { background-position: 0% 50%; }*/
/*  50% { background-position: 100% 50%; }*/
/*  100% { background-position: 0% 50%; }*/
/*}*/



.floating-bg {
  position: fixed;
  inset: 0;
  z-index: -1;
  overflow: hidden;
}


/* Multi-Color Badge and Colors Indicators */
.multi-color-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: linear-gradient(135deg, #8b5cf6, #6366f1);
    color: white;
    padding: 0.25rem 0.75rem;
    border-radius: 20px;
    font-size: 0.7rem;
    font-weight: 600;
    margin-top: 0.5rem;
    width: fit-content;
    animation: pulseGlow 2s infinite;
}

@keyframes pulseGlow {
    0%, 100% { box-shadow: 0 0 0 0 rgba(139, 92, 246, 0.4); }
    50% { box-shadow: 0 0 0 5px rgba(139, 92, 246, 0); }
}

.color-dots{
    display:flex;
    align-items:center;
    gap:6px;
    margin-top:10px;
}

.color-image-dot{
    width:26px;
    height:26px;
    border-radius:50%;
    overflow:hidden;
    border:2px solid rgba(255,255,255,.15);
    background:#222;
    flex-shrink:0;
    transition:.2s;
}

.color-image-dot img{
    width:100%;
    height:100%;
    object-fit:cover;
}

.color-image-dot:hover{
    transform:scale(1.08);
    border-color:#fff;
}

.more-dot{
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:11px;
    font-weight:700;
    background:#2a2a2a;
    color:#fff;
}


/*.product-card::after {*/
/*  pointer-events: none;*/
/*  content: "";*/
/*  position: absolute;*/
/*  inset: 0;*/
/*  border-radius: 20px;*/
/*  background: linear-gradient(120deg, transparent, rgba(255,255,255,0.1), transparent);*/
/*  opacity: 0;*/
/*  transition: 0.4s;*/
/*}*/

/*.product-card:hover::after {*/
/*  opacity: 1;*/
/*}*/
/* Page Header */
.page-header {
    
  background: rgba(255,255,255,0.05);
  backdrop-filter: blur(25px);
  border-radius: 25px;
  padding: 3rem;
  position: relative;
  overflow: hidden;
  border: 1px solid var(--glass-border);
  margin: 2rem auto;
  text-align: center;
}
.page-header::before {
  content: "";
  position: absolute;
  width: 200%;
  height: 200%;
  background: radial-gradient(circle, rgba(0,111,205,0.2), transparent);
  animation: rotateGlow 20s linear infinite;
}

@keyframes rotateGlow {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

.page-header h1 {
  font-size: 3rem;
  font-weight: 800;
  background: linear-gradient(45deg, #fff, var(--ps-blue));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  margin-bottom: 1rem;
}

.page-header .lead {
  color: rgba(255,255,255,0.7);
  font-size: 1.2rem;
}

/* Filter Section */
.filter-section {
  background: var(--glass-bg);
  backdrop-filter: blur(20px);
  border: 1px solid var(--glass-border);
  border-radius: 20px;
  padding: 2rem;
  margin-bottom: 3rem;
}

.filter-label {
  color: rgba(255,255,255,0.9);
  font-weight: 600;
  margin-bottom: 0.75rem;
  display: block;
}

/* Price Slider */
#priceRangeSlider {
  margin: 1.5rem 0;
  background: rgba(255,255,255,0.1);
  border-radius: 10px;
  height: 6px;
  border: none;
}

.noUi-connect {
  background: linear-gradient(90deg, var(--ps-blue), var(--xbox-green));
}

.noUi-handle {
  width: 20px;
  height: 20px;
  background: white;
  border: 2px solid var(--ps-blue);
  border-radius: 50%;
  box-shadow: 0 2px 5px rgba(0,0,0,0.2);
  top: -7px;
  cursor: pointer;
}

.noUi-handle:before,
.noUi-handle:after {
  display: none;
}

.noUi-tooltip {
  background: rgba(0,0,0,0.8);
  color: white;
  border: 1px solid var(--ps-blue);
  border-radius: 5px;
  padding: 5px 10px;
  font-size: 0.85rem;
}

.price-labels {
  display: flex;
  justify-content: space-between;
  margin-top: 1rem;
  color: rgba(255,255,255,0.8);
}

/* Sort Select */
.form-select {
  background: rgba(255,255,255,0.1);
  border: 1px solid var(--glass-border);
  color: white;
  border-radius: 12px;
  padding: 0.75rem 1.5rem;
  cursor: pointer;
}

.form-select:focus {
  background: rgba(255,255,255,0.15);
  border-color: var(--ps-blue);
  box-shadow: 0 0 0 0.25rem rgba(0, 111, 205, 0.25);
  color: white;
}

.form-select option {
  background: #1a1a2e;
  color: white;
}

/* Filter Button */
.btn-filter {
  background: linear-gradient(135deg, var(--ps-blue), #0056b3);
  border: none;
  border-radius: 12px;
  padding: 0.75rem 2rem;
  font-weight: 600;
  transition: all 0.3s ease;
  width: 100%;
  color: white;
}

.btn-filter:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 20px rgba(0, 111, 205, 0.3);
  color: white;
}

/* Product Cards */
/*.product-card{*/
/*    background: rgba(255,255,255,0.06);*/
/*    border: 1px solid rgba(255,255,255,0.08);*/
/*    border-radius: 24px;*/
/*    overflow: hidden;*/
/*    transition: .35s ease;*/
/*    backdrop-filter: blur(18px);*/
/*    position: relative;*/
/*    height: 100%;*/
/*}*/

/*.product-card:hover{*/
/*    transform: translateY(-8px);*/
/*    border-color: rgba(255,255,255,0.2);*/
/*    box-shadow: 0 20px 50px rgba(0,0,0,.35);*/
/*}*/

/*.product-image{*/
/*    height: 260px;*/
/*    position: relative;*/
/*    padding: 20px;*/
/*    display:flex;*/
/*    align-items:center;*/
/*    justify-content:center;*/
/*    background:*/
/*    radial-gradient(circle at top,*/
/*    rgba(255,255,255,.08),*/
/*    transparent);*/
/*}*/

/*.product-image img{*/
/*    max-width:100%;*/
/*    max-height:100%;*/
/*    object-fit:contain;*/
/*    transition:.4s;*/
/*}*/

/*.product-card:hover img{*/
/*    transform:scale(1.06);*/
/*}*/

/*.card-actions-top{*/
/*    position:absolute;*/
/*    top:14px;*/
/*    right:14px;*/
/*    z-index:5;*/
/*}*/

/*.icon-btn{*/
/*    width:42px;*/
/*    height:42px;*/
/*    border:none;*/
/*    border-radius:50%;*/
/*    background:rgba(0,0,0,.45);*/
/*    color:#fff;*/
/*    backdrop-filter:blur(10px);*/
/*    transition:.25s;*/
/*}*/

/*.icon-btn:hover{*/
/*    background:#006fcd;*/
/*    transform:scale(1.08);*/
/*}*/

/*.product-badges{*/
/*    position:absolute;*/
/*    top:14px;*/
/*    left:14px;*/
/*    display:flex;*/
/*    gap:8px;*/
/*    z-index:5;*/
/*}*/

/*.badge-new,*/
/*.badge-used,*/
/*.badge-sale{*/
/*    padding:6px 12px;*/
/*    border-radius:30px;*/
/*    font-size:.7rem;*/
/*    font-weight:700;*/
/*}*/

/*.badge-new{*/
/*    background:#006fcd;*/
/*}*/

/*.badge-used{*/
/*    background:#555;*/
/*}*/

/*.badge-sale{*/
/*    background:#ff3b5c;*/
/*}*/

/*.stock-pill{*/
/*    position:absolute;*/
/*    bottom:14px;*/
/*    left:14px;*/
/*    z-index:5;*/
/*    padding:6px 14px;*/
/*    border-radius:30px;*/
/*    font-size:.75rem;*/
/*    font-weight:600;*/
/*    backdrop-filter:blur(10px);*/
/*}*/

/*.stock-pill.out{*/
/*    background:rgba(255,59,92,.2);*/
/*    color:#ff7d93;*/
/*    border:1px solid rgba(255,59,92,.3);*/
/*}*/

/*.product-content{*/
/*    padding:20px;*/
/*}*/

/*.product-title{*/
/*    font-size:1.08rem;*/
/*    font-weight:700;*/
/*    line-height:1.4;*/
/*    margin-bottom:8px;*/
/*    color:#fff;*/
/*}*/

/*.product-studio{*/
/*    color:rgba(255,255,255,.6);*/
/*    font-size:.88rem;*/
/*}*/

/*.old-price{*/
/*    color:#888;*/
/*    text-decoration:line-through;*/
/*    font-size:.9rem;*/
/*}*/

/*.new-price{*/
/*    color:#00bfff;*/
/*    font-size:1.4rem;*/
/*    font-weight:800;*/
/*}*/

/*.product-bottom-actions{*/
/*    display:flex;*/
/*    gap:10px;*/
/*    margin-top:20px;*/
/*}*/

/*.modern-cart-btn{*/
/*    flex:1;*/
/*    border:none;*/
/*    border-radius:14px;*/
/*    padding:13px;*/
/*    background:linear-gradient(135deg,#006fcd,#004ea3);*/
/*    color:white;*/
/*    font-weight:700;*/
/*    transition:.3s;*/
/*}*/

/*.modern-cart-btn:hover{*/
/*    transform:translateY(-2px);*/
/*    box-shadow:0 10px 25px rgba(0,111,205,.3);*/
/*}*/

/*.details-btn{*/
/*    width:52px;*/
/*    display:flex;*/
/*    align-items:center;*/
/*    justify-content:center;*/
/*    border-radius:14px;*/
/*    background:rgba(255,255,255,.08);*/
/*    color:#fff;*/
/*    text-decoration:none;*/
/*    transition:.3s;*/
/*}*/

/*.details-btn:hover{*/
/*    background:rgba(255,255,255,.15);*/
/*    color:#fff;*/
/*}*/
/*.product-badges {*/
/*  position: absolute;*/
/*  top: 15px;*/
/*  left: 15px;*/
/*  right: 15px;*/
/*  display: flex;*/
/*  justify-content: space-between;*/
/*}*/

/*.product-badge {*/
/*  padding: 0.4rem 1rem;*/
/*  border-radius: 10px;*/
/*  font-size: 0.8rem;*/
/*  font-weight: 600;*/
/*  text-transform: uppercase;*/
/*  letter-spacing: 0.5px;*/
/*}*/

/*.badge-new {*/
/*  background: linear-gradient(135deg, var(--ps-blue), #0056b3);*/
/*  color: white;*/
/*}*/

/*.badge-used {*/
/*  background: linear-gradient(135deg, #6c757d, #495057);*/
/*  color: white;*/
/*}*/

/*.badge-outofstock {*/
/*  background: linear-gradient(135deg, #dc3545, #a71d2a);*/
/*  color: white;*/
/*}*/

/*.badge-sale {*/
/*  background: linear-gradient(135deg, #ff4757, #ff3838);*/
/*  color: white;*/
/*}*/

/*.product-content {*/
/*  padding: 1.5rem;*/
/*}*/

/*.product-title {*/
/*  font-size: 1.2rem;*/
/*  font-weight: 600;*/
/*  margin-bottom: 0.5rem;*/
/*  color: white;*/
/*  display: -webkit-box;*/
/*  -webkit-line-clamp: 2;*/
/*  -webkit-box-orient: vertical;*/
/*  overflow: hidden;*/
/*  text-decoration: none;*/
/*}*/

/*.product-studio {*/
/*  color: rgba(255,255,255,0.7);*/
/*  font-size: 0.9rem;*/
/*  margin-bottom: 1rem;*/
/*}*/

/*.product-price {*/
/*  display: flex;*/
/*  align-items: center;*/
/*  justify-content: space-between;*/
/*  margin-top: 1rem;*/
/*}*/

/*.price-amount {*/
/*  font-size: 1.4rem;*/
/*  font-weight: 700;*/
/*  color: var(--ps-blue);*/
/*}*/

/*.price-amount del {*/
/*  color: rgba(255,255,255,0.5);*/
/*  font-size: 1.1rem;*/
/*  margin-right: 0.5rem;*/
/*}*/

/* Favorite Button */
/*.favorite-btn {*/
/*  background: rgba(255,255,255,0.1);*/
/*  border: 1px solid var(--glass-border);*/
/*  border-radius: 50%;*/
/*  width: 40px;*/
/*  height: 40px;*/
/*  display: flex;*/
/*  align-items: center;*/
/*  justify-content: center;*/
/*  color: rgba(255,255,255,0.7);*/
/*  transition: all 0.3s ease;*/
/*  padding: 0;*/
/*}*/

/*.favorite-btn:hover {*/
/*  background: rgba(220, 53, 69, 0.2);*/
/*  border-color: rgba(220, 53, 69, 0.3);*/
/*  color: #dc3545;*/
/*}*/

/*.favorite-btn .fa-heart.filled {*/
/*  color: #dc3545;*/
/*}*/

/* Pagination */
.pagination-container {
  margin: 4rem 0;
}

.pagination {
  justify-content: center;
  gap: 0.5rem;
}

.page-item .page-link {
  background: rgba(255,255,255,0.1);
  border: 1px solid var(--glass-border);
  color: white;
  border-radius: 10px;
  padding: 0.75rem 1.25rem;
  transition: all 0.3s ease;
  text-decoration: none;
}

.page-item .page-link:hover {
  background: rgba(255,255,255,0.2);
  border-color: var(--ps-blue);
  color: white;
}

.page-item.active .page-link {
  background: linear-gradient(135deg, var(--ps-blue), #0056b3);
  border-color: var(--ps-blue);
  color: white;
}

.page-item.disabled .page-link {
  opacity: 0.5;
  cursor: not-allowed;
  pointer-events: none;
}

/* No Results */
.no-results {
  text-align: center;
  padding: 4rem;
  background: var(--glass-bg);
  backdrop-filter: blur(20px);
  border: 1px solid var(--glass-border);
  border-radius: 20px;
  margin: 2rem 0;
}

.no-results i {
  font-size: 4rem;
  color: rgba(255,255,255,0.3);
  margin-bottom: 1.5rem;
}

/* Responsive */
@media (max-width: 768px) {
  .page-header {
    padding: 2rem 1rem;
  }
  
  .page-header h1 {
    font-size: 2.2rem;
  }
  
  .filter-section {
    padding: 1.5rem;
  }
  
  /*.product-image {*/
  /*  height: 180px;*/
  /*}*/
}



/*.product-actions {*/
/*    opacity: 1 !important;*/
/*    transform: none !important;*/
/*}*/

/*.product-actions .btn {*/
/*    border-radius: 14px;*/
/*    font-weight: 600;*/
/*    padding: 12px;*/
/*}*/

/*.new-price {*/
/*    font-size: 1.5rem;*/
/*    font-weight: 700;*/
/*    color: #00bfff;*/
/*}*/

/*.product-price del {*/
/*    font-size: 0.95rem;*/
/*}*/

/*.product-card {*/
/*    border-radius: 24px;*/
/*}*/

/*.product-image {*/
/*    border-bottom: 1px solid rgba(255,255,255,0.06);*/
/*}*/

.qa-btn {
    backdrop-filter: blur(14px);
}

.wishlist-count {
    font-size: 0.8rem;
    opacity: 0.7;
    margin-top: 12px;
}

.btn-outline-light:hover {
    background: white;
    color: black;
}


.out-overlay {
    position: absolute;
    inset: 0;
    background: rgba(0,0,0,0.6);
    color: white;
    font-weight: 700;
    font-size: 1.2rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 20px 20px 0 0;
    text-transform: uppercase;
    letter-spacing: 1px;
}

/*.product-actions .btn {*/
/*    border-radius: 10px;*/
/*    font-weight: 600;*/
/*}*/

/*.product-actions .btn:disabled {*/
/*    background: #555;*/
/*    border: none;*/
/*    cursor: not-allowed;*/
/*    opacity: 0.6;*/
/*}*/

.wishlist-count {
    margin-top: 8px;
    font-size: 0.85rem;
    color: rgba(255,255,255,0.7);
    display: flex;
    align-items: center;
    gap: 6px;
}

.wishlist-count i {
    color: #dc3545;
}


/*edits*/
/*.product-card {*/
/*    transition: all 0.35s ease;*/
/*    overflow: hidden;*/
/*}*/

/*.product-card:hover {*/
/*    transform: translateY(-10px) scale(1.02);*/
/*}*/

/*.product-card .product-actions {*/
/*    opacity: 0;*/
/*    transform: translateY(20px);*/
/*    transition: 0.3s;*/
/*}*/

/*.product-card:hover .product-actions {*/
/*    opacity: 1;*/
/*    transform: translateY(0);*/
/*}*/

/*.quick-actions {*/
/*    position: absolute;*/
/*    top: 10px;*/
/*    right: 10px;*/
/*    display: flex;*/
/*    flex-direction: column;*/
/*    gap: 8px;*/
/*}*/

.qa-btn {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    border: none;
    background: rgba(0,0,0,0.6);
    color: white;
    backdrop-filter: blur(10px);
    transition: 0.3s;
}

.qa-btn:hover {
    background: #006fcd;
    transform: scale(1.1);
}

.favorite-btn .filled {
    animation: popHeart 0.3s ease;
}

@keyframes popHeart {
    0% { transform: scale(0.7); }
    100% { transform: scale(1.2); }
}

.skeleton {
  background: linear-gradient(90deg, #222, #333, #222);
  animation: loading 1.5s infinite;
}

.quick-view-btn {
  position: absolute;
  bottom: 10px;
  right: 60px;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: rgba(0,0,0,0.6);
  color: #fff;
  border: none;
  opacity: 0;
  transition: 0.3s;
}

/*.product-card:hover .quick-view-btn {*/
/*  opacity: 1;*/
/*  transform: translateY(-5px);*/
/*}*/
/*.modal-content {*/
/*  animation: zoomIn 0.3s ease;*/
/*}*/

/*.product-card {*/
/*  cursor: pointer;*/
/*}*/

/*.modal-content {*/
/*    background: rgba(15,15,25,0.9);*/
/*    backdrop-filter: blur(20px);*/
/*    border-radius: 20px;*/
/*    border: 1px solid rgba(255,255,255,0.1);*/
/*    box-shadow: 0 30px 80px rgba(0,0,0,0.6);*/
/*}*/

.quick-img-wrapper {
    background: rgba(255,255,255,0.05);
    padding: 20px;
    border-radius: 20px;
}

.quick-img {
    transition: 0.4s;
}

.quick-img:hover {
    transform: scale(1.1);
}

.price-box del {
    color: #aaa;
    margin-right: 10px;
}

.new-price {
    font-size: 1.6rem;
    font-weight: bold;
    color: #00bfff;
}

.qty-input {
    background: rgba(255,255,255,0.1);
    border: none;
    color: white;
    border-radius: 10px;
    text-align: center;
}

.qty-input:focus {
    outline: none;
    box-shadow: 0 0 0 2px #006fcd;
}

/*.modal.fade .modal-dialog {*/
/*    transform: scale(0.8);*/
/*    transition: 0.3s;*/
/*}*/
/*.modal.show .modal-dialog {*/
/*    transform: scale(1);*/
/*}*/


/*.color-options-grid{*/
/*    display:grid;*/
/*    grid-template-columns:repeat(2,1fr);*/
/*    gap:16px;*/
/*}*/

/*.color-option-card{*/
/*    background:#1e1e1e;*/
/*    border-radius:18px;*/
/*    overflow:hidden;*/
/*    border:1px solid rgba(255,255,255,.08);*/
/*}*/

/*.color-option-image img{*/
/*    width:100%;*/
/*    height:160px;*/
/*    object-fit:cover;*/
/*}*/

/*.color-option-info{*/
/*    padding:14px;*/
/*}*/

/*.color-option-info h6{*/
/*    margin-bottom:12px;*/
/*    font-weight:600;*/
/*}*/


/* =========================================
   LOAD MORE BUTTON
========================================= */

.load-more-wrapper {

    display: flex;

    justify-content: center;

    margin: 50px 0 20px;
}

.load-more-btn {

    position: relative;

    display: inline-flex;

    align-items: center;

    justify-content: center;

    gap: 12px;

    min-width: 220px;

    height: 58px;

    padding: 0 32px;

    border: 1px solid rgba(255,255,255,.08);

    border-radius: 18px;

    background:
        linear-gradient(
            135deg,
            rgba(0,111,205,.18),
            rgba(0,166,255,.08)
        );

    backdrop-filter: blur(16px);

    color: #fff;

    font-size: .95rem;

    font-weight: 700;

    letter-spacing: .4px;

    overflow: hidden;

    transition: all .35s ease;

    box-shadow:
        0 10px 30px rgba(0,0,0,.25),
        inset 0 1px 0 rgba(255,255,255,.06);

    cursor: pointer;
}

/* glow */

.load-more-btn::before {

    content: '';

    position: absolute;

    inset: 0;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(255,255,255,.08),
            transparent
        );

    transform: translateX(-100%);

    transition: transform .8s ease;
}

.load-more-btn:hover::before {

    transform: translateX(100%);
}

/* hover */

.load-more-btn:hover {

    transform: translateY(-4px);

    border-color: rgba(0,166,255,.45);

    box-shadow:
        0 18px 45px rgba(0,111,205,.35),
        0 0 25px rgba(0,166,255,.25);

    background:
        linear-gradient(
            135deg,
            rgba(0,111,205,.28),
            rgba(0,166,255,.14)
        );
}

/* active */

.load-more-btn:active {

    transform: scale(.97);
}

/* text */

.load-more-text {

    position: relative;

    z-index: 2;
}

/* spinner */

.load-more-spinner {

    width: 22px;

    height: 22px;

    border-radius: 50%;

    border: 2px solid rgba(255,255,255,.2);

    border-top-color: #00a6ff;

    animation: loadMoreSpin .7s linear infinite;
}

/* animation */

@keyframes loadMoreSpin {

    to {

        transform: rotate(360deg);
    }
}

/* mobile */

@media (max-width: 768px) {

    .load-more-btn {

        width: 100%;

        min-width: unset;

        height: 54px;

        border-radius: 16px;
    }
}


/* CATEGORY PAGE FIX ONLY */

.category-page .card-img-top {

    width: 100%;

    height: 100%;

    object-fit: contain;

    padding: 18px;
}

/* prevent ultra tall images */

/*.category-page .image-container {*/

/*    min-height: 480px;*/

/*    max-height: 480px;*/

/*    overflow: hidden;*/
/*}*/

/* mobile */

/*@media (max-width:768px){*/

/*    .category-page .image-container {*/

/*        min-height: 330px;*/

/*        max-height: 330px;*/
/*    }*/
/*}*/