/* Base Layout */
.ct-cat-container-63ab0b21 { font-family: system-ui, sans-serif; color: #111; }
.ct-catalog-layout { display: flex; gap: 40px; align-items: flex-start; }
.ct-sidebar-filters { width: 280px; flex-shrink: 0; position: sticky; top: 100px; max-height: calc(100vh - 120px); overflow-y: auto; padding-right: 15px; }
.ct-main-grid-area { flex-grow: 1; display: flex; flex-direction: column;}
.ct-grid-toolbar { margin-bottom: 30px; }
#ct-smart-search { padding: 15px 20px; border-radius: 8px; font-size: 1rem; border: 1px solid #ccc; box-sizing: border-box;}
.ct-products-grid { display: grid; gap: 30px; transition: all 0.3s ease; margin-bottom: 30px;}
#ct-infinite-trigger { width: 100%; height: 60px; display: flex; justify-content: center; align-items: center; }

@media (max-width: 768px) { 
    .ct-catalog-layout { flex-direction: column; }
    .ct-sidebar-filters { width: 100%; position: static; max-height: none; padding-right: 0;}
}

/* Base Product Card */
.ct-product-card { display: flex; flex-direction: column; position: relative; height: 100%; overflow: hidden;}
.ct-product-img { position: relative; padding-top: 100%; }
.ct-product-img img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; }
.ct-badge { position: absolute; top: 10px; right: 10px; z-index: 2; padding: 4px 8px; font-size: 12px; font-weight: bold;}
.ct-product-info { padding: 20px; display: flex; flex-direction: column; flex-grow: 1; }
.ct-product-title { font-size: 1.1rem; margin-bottom: 10px; font-weight: bold; }
.ct-product-sku { font-size: 0.8rem; margin-bottom: 15px; opacity: 0.7; }
.ct-product-actions { margin-top: auto; }
.ct-btn-view { display: block; text-align: center; padding: 10px; cursor: pointer; text-decoration: none; font-weight: bold;}


/* =========================================
   10 NEW FILTER STYLES
   ========================================= */

/* 1: Cyber Neon */
.filter-style-new-1 { background: #0a0a0a; color: #0ff; padding: 20px; border: 1px solid #0ff; box-shadow: 0 0 10px rgba(0,255,255,0.2); }
.filter-style-new-1 h3 { color: #f0f; text-shadow: 0 0 5px #f0f; }
.filter-style-new-1 .ct-simple-filter-cb { display: none; }
.filter-style-new-1 .ct-filter-text { display: block; padding: 10px; border: 1px solid transparent; color: #0ff; cursor: pointer;}
.filter-style-new-1 .ct-simple-filter-cb:checked + .ct-filter-text { background: rgba(0,255,255,0.1); border-color: #0ff; box-shadow: 0 0 10px #0ff inset; }

/* 2: Glassmorphism Blur */
.filter-style-new-2 { background: rgba(255,255,255,0.1); backdrop-filter: blur(10px); padding: 25px; border-radius: 20px; border: 1px solid rgba(255,255,255,0.2); box-shadow: 0 8px 32px rgba(0,0,0,0.1); }
.filter-style-new-2 .ct-filter-label { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; }
.filter-style-new-2 .ct-simple-filter-cb { width: 20px; height: 20px; accent-color: #ffb6ff; }

/* 3: Brutalism Bold */
.filter-style-new-3 { background: #fff; padding: 20px; border: 4px solid #000; box-shadow: 8px 8px 0 #000; }
.filter-style-new-3 h3 { font-size: 2rem; font-weight: 900; text-transform: uppercase; border-bottom: 4px solid #000; }
.filter-style-new-3 .ct-filter-label { display: block; border-bottom: 2px solid #000; padding: 15px 0; font-weight: 800; font-size: 1.2rem; cursor: pointer;}
.filter-style-new-3 .ct-simple-filter-cb { width: 24px; height: 24px; border: 2px solid #000; appearance: none; background: #fff; vertical-align: middle; margin-right: 10px;}
.filter-style-new-3 .ct-simple-filter-cb:checked { background: #000; }

/* 4: Retro Mac OS */
.filter-style-new-4 { background: #ccc; border-top: 2px solid #fff; border-left: 2px solid #fff; border-bottom: 2px solid #666; border-right: 2px solid #666; padding: 15px; font-family: "Courier New", Courier, monospace;}
.filter-style-new-4 h3 { background: #0000a0; color: #fff; padding: 5px 10px; font-size: 1rem;}
.filter-style-new-4 .ct-filter-label { display: flex; gap: 10px; margin-bottom: 10px; }

/* 5: Holographic */
.filter-style-new-5 { background: linear-gradient(135deg, #ff9a9e 0%, #fecfef 99%, #fecfef 100%); padding: 25px; border-radius: 15px; }
.filter-style-new-5 .ct-simple-filter-cb { display: none; }
.filter-style-new-5 .ct-filter-text { display: inline-block; padding: 8px 20px; background: rgba(255,255,255,0.5); border-radius: 30px; margin: 5px; font-weight: bold; cursor: pointer;}
.filter-style-new-5 .ct-simple-filter-cb:checked + .ct-filter-text { background: #fff; box-shadow: 0 4px 15px rgba(0,0,0,0.1); }

/* 6: Wireframe */
.filter-style-new-6 { border: 1px dashed #444; padding: 20px; background: transparent; }
.filter-style-new-6 h3 { font-family: monospace; font-weight: normal; letter-spacing: 2px; text-align: center; }
.filter-style-new-6 .ct-filter-text { display: block; border: 1px solid #ccc; padding: 10px; margin-bottom: 10px; text-align: center; transition: all 0.2s;}
.filter-style-new-6 .ct-simple-filter-cb { display: none; }
.filter-style-new-6 .ct-simple-filter-cb:checked + .ct-filter-text { border-style: dashed; border-color: #000; font-style: italic; }

/* 7: Soft Claymorphism */
.filter-style-new-7 { background: #f0f0f3; padding: 30px; border-radius: 30px; box-shadow: inset 5px 5px 10px #d1d1d4, inset -5px -5px 10px #ffffff; }
.filter-style-new-7 .ct-simple-filter-cb { display: none; }
.filter-style-new-7 .ct-filter-text { display: block; padding: 15px; margin-bottom: 15px; border-radius: 15px; background: #f0f0f3; box-shadow: 5px 5px 10px #d1d1d4, -5px -5px 10px #ffffff; text-align: center; font-weight: 600; cursor: pointer;}
.filter-style-new-7 .ct-simple-filter-cb:checked + .ct-filter-text { box-shadow: inset 5px 5px 10px #d1d1d4, inset -5px -5px 10px #ffffff; color: #ff6b6b; }

/* 8: Matrix Terminal */
.filter-style-new-8 { background: #000; color: #0f0; font-family: monospace; padding: 20px; border-left: 5px solid #0f0;}
.filter-style-new-8 .ct-filter-label { display: block; margin-bottom: 10px; }
.filter-style-new-8 .ct-simple-filter-cb { display: none; }
.filter-style-new-8 .ct-filter-text::before { content: "> "; opacity: 0; }
.filter-style-new-8 .ct-simple-filter-cb:checked + .ct-filter-text { color: #fff; }
.filter-style-new-8 .ct-simple-filter-cb:checked + .ct-filter-text::before { opacity: 1; color: #0f0; }

/* 9: Bubblegum Pop */
.filter-style-new-9 { background: #ffebf0; border: 3px solid #ff6b9d; border-radius: 20px; padding: 20px; }
.filter-style-new-9 h3 { color: #ff6b9d; font-family: "Comic Sans MS", cursive, sans-serif; text-align: center;}
.filter-style-new-9 .ct-simple-filter-cb { display: none; }
.filter-style-new-9 .ct-filter-text { display: inline-block; padding: 10px 15px; background: #fff; border: 2px solid #ff6b9d; border-radius: 50px; margin: 5px; color: #ff6b9d; font-weight: 800; cursor: pointer;}
.filter-style-new-9 .ct-simple-filter-cb:checked + .ct-filter-text { background: #ff6b9d; color: #fff; transform: scale(1.1); }

/* 10: Space Grey Minimal */
.filter-style-new-10 { background: #fdfdfd; padding: 40px 20px; border-right: 1px solid #eee; }
.filter-style-new-10 h3 { font-size: 12px; letter-spacing: 3px; color: #999; margin-bottom: 30px; }
.filter-style-new-10 .ct-filter-label { display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid #f5f5f5; padding: 15px 0; color: #444;}
.filter-style-new-10 .ct-simple-filter-cb { accent-color: #000; transform: scale(1.2); }


/* =========================================
   10 NEW CARD STYLES
   ========================================= */

/* 1: Cyberpunk */
.card-style-new-1 { background: #000; border: 1px solid #0ff; box-shadow: 4px 4px 0 #f0f; color: #fff; clip-path: polygon(0 0, 100% 0, 100% 90%, 90% 100%, 0 100%); }
.card-style-new-1 .ct-product-img { filter: contrast(1.2) saturate(1.2); border-bottom: 1px solid #0ff;}
.card-style-new-1 .ct-product-title { color: #0ff; text-transform: uppercase; letter-spacing: 1px;}
.card-style-new-1 .ct-badge { background: #f0f; color: #000; }
.card-style-new-1 .ct-btn-view { background: #0ff; color: #000; text-transform: uppercase; font-weight: 900;}
.card-style-new-1:hover { box-shadow: -4px -4px 0 #0ff, 4px 4px 0 #f0f; transform: translate(2px, 2px);}

/* 2: Frosted Glass */
.card-style-new-2 { background: rgba(255,255,255,0.6); backdrop-filter: blur(20px); border: 1px solid rgba(255,255,255,0.8); border-radius: 15px; box-shadow: 0 10px 30px rgba(0,0,0,0.05); }
.card-style-new-2 .ct-product-img { border-radius: 15px 15px 0 0; }
.card-style-new-2 .ct-btn-view { background: rgba(0,0,0,0.8); color: #fff; border-radius: 10px;}

/* 3: Neo Brutalism */
.card-style-new-3 { border: 3px solid #000; background: #fff; box-shadow: 6px 6px 0 #000; border-radius: 0; transition: transform 0.1s;}
.card-style-new-3 .ct-product-img { border-bottom: 3px solid #000; }
.card-style-new-3 .ct-btn-view { background: #ffe600; color: #000; border: 3px solid #000; box-shadow: 3px 3px 0 #000; font-weight: 900;}
.card-style-new-3 .ct-btn-view:active { box-shadow: 0 0 0 #000; transform: translate(3px,3px);}

/* 4: 90s Arcade */
.card-style-new-4 { background: #222; border: 4px solid #ff0055; color: #fff; border-radius: 10px;}
.card-style-new-4 .ct-product-title { font-family: 'Courier New', Courier, monospace; color: #00ffcc;}
.card-style-new-4 .ct-btn-view { background: transparent; border: 2px dashed #00ffcc; color: #00ffcc; text-transform: uppercase;}
.card-style-new-4 .ct-btn-view:hover { background: #00ffcc; color: #000;}

/* 5: Holographic Foil */
.card-style-new-5 { background: linear-gradient(120deg, #fdfbfb 0%, #ebedee 100%); border: none; border-radius: 20px; position: relative; z-index: 1;}
.card-style-new-5::before { content: ""; position: absolute; inset: -3px; border-radius: 23px; background: linear-gradient(45deg, #ff0000, #ff7300, #fffb00, #48ff00, #00ffd5, #002bff, #7a00ff, #ff00c8, #ff0000); filter: blur(5px); z-index: -1; opacity: 0.3; transition: opacity 0.3s;}
.card-style-new-5:hover::before { opacity: 1; }
.card-style-new-5 .ct-btn-view { background: #fff; color: #000; box-shadow: 0 5px 15px rgba(0,0,0,0.1); border-radius: 50px;}

/* 6: Blueprint Wireframe */
.card-style-new-6 { background: #0d2a4a; border: 1px solid #4a90e2; color: #4a90e2; }
.card-style-new-6 .ct-product-img { opacity: 0.8; mix-blend-mode: luminosity; border-bottom: 1px solid #4a90e2;}
.card-style-new-6 .ct-product-title { color: #fff; font-family: monospace;}
.card-style-new-6 .ct-btn-view { background: transparent; border: 1px solid #4a90e2; color: #4a90e2; font-family: monospace;}

/* 7: Puffy Clay */
.card-style-new-7 { background: #fafafa; border-radius: 30px; border: none; box-shadow: 10px 10px 20px #d9d9d9, -10px -10px 20px #ffffff; }
.card-style-new-7 .ct-product-img img { border-radius: 30px 30px 0 0; padding: 10px;}
.card-style-new-7 .ct-btn-view { background: #fafafa; color: #333; border-radius: 20px; box-shadow: 5px 5px 10px #d9d9d9, -5px -5px 10px #ffffff; border: none;}
.card-style-new-7 .ct-btn-view:active { box-shadow: inset 5px 5px 10px #d9d9d9, inset -5px -5px 10px #ffffff;}

/* 8: Hacker Terminal */
.card-style-new-8 { background: #000; border: none; border-left: 2px solid #0f0; color: #0f0; font-family: monospace;}
.card-style-new-8 .ct-product-img { filter: grayscale(100%) sepia(100%) hue-rotate(90deg) brightness(0.8) contrast(1.5); }
.card-style-new-8 .ct-product-title { font-size: 0.9rem; }
.card-style-new-8 .ct-product-title::before { content: "root@store:~$ "; }
.card-style-new-8 .ct-btn-view { background: #0f0; color: #000; border-radius: 0;}

/* 9: Vaporwave */
.card-style-new-9 { background: linear-gradient(to bottom, #ff9a9e 0%, #fecfef 99%, #fecfef 100%); border: none; border-radius: 5px;}
.card-style-new-9 .ct-product-title { font-family: "Times New Roman", Times, serif; font-style: italic; font-size: 1.4rem; color: #333; text-shadow: 2px 2px 0 #0ff;}
.card-style-new-9 .ct-product-img img { mix-blend-mode: multiply; }
.card-style-new-9 .ct-btn-view { background: #fff; color: #ff9a9e; border: 1px solid #ff9a9e; letter-spacing: 5px;}

/* 10: Zen Garden */
.card-style-new-10 { border: none; border-bottom: 1px solid #eee; background: transparent; padding-bottom: 20px;}
.card-style-new-10 .ct-product-img { background: #f9f9f9; border-radius: 50%; width: 80%; margin: 0 auto; padding-top: 80%; overflow: hidden;}
.card-style-new-10 .ct-product-info { align-items: center; text-align: center;}
.card-style-new-10 .ct-product-title { font-weight: normal; letter-spacing: 2px; text-transform: uppercase; font-size: 0.9rem;}
.card-style-new-10 .ct-btn-view { background: transparent; color: #000; border-bottom: 1px solid #000; padding: 5px 0; border-radius: 0;}