/* ==========================================================
       1. ГЛУШИМО СТАНДАРТНИЙ ФОН САЙТУ ТІЛЬКИ ДЛЯ ЦІЄЇ СТОРІНКИ
       ========================================================== */
    html, body {
        background: transparent !important;
        background-color: transparent !important;
    }

    .bg-layer-dark, 
    .bg-layer-light,
    #dark-root, 
    #light-root {
        display: none !important;
        opacity: 0 !important;
        visibility: hidden !important;
    }

    /* ==========================================================
       2. КАСТОМНІ СТИЛІ СТОРІНКИ ТА WEBGL
       ========================================================== */
    .vendor-page {
        padding-top: 40px;
        padding-bottom: 60px;
        position: relative;
        display: flex;
        flex-direction: column;
        align-items: center;
        width: 100%;
        z-index: 2;
    }

    /* --- ФІКСОВАНИЙ ФОН (Метаболи) --- */
    #bg-canvas {
        position: fixed !important;
        top: 0 !important; 
        left: 0 !important; 
        width: 100vw !important; 
        height: 100vh !important;
        z-index: -999 !important; /* Під усіма елементами сайту */
        pointer-events: none; /* Пропускає кліки на товари */
    }

    /* --- БЛОК ДЛЯ ТЕКСТУ --- */
    .liquid-title-wrapper {
        width: 100%;
        max-width: 1200px;
        height: 35vh;
        min-height: 250px;
        position: relative;
        margin: 0 auto;
        padding: 40px 0;
        z-index: 10;
        display: flex;
        justify-content: center;
        align-items: center;
    }
    
    #title-canvas {
        width: 100%; 
        height: 100%; 
        cursor: crosshair;
        display: block;
    }
    
    #error-msg { display: none; color: #ff3366; text-align: center; position: absolute; z-index: 10; top: 50%; width: 100%; font-weight: bold;}

    /* --- БІГОВІ ДОРІЖКИ (MARQUEE) --- */
    .marquee-wrapper {
        width: 100%;
        display: flex;
        flex-direction: column;
        gap: 2px;
        margin-bottom: 40px;
        z-index: 10;
    }

    .marquee-container {
        width: 100%;
        overflow: hidden;
        background: rgba(0, 0, 0, 0.5);
        border-top: 1px solid rgba(255, 255, 255, 0.15);
        border-bottom: 1px solid rgba(255, 255, 255, 0.15);
        backdrop-filter: blur(5px);
        padding: 12px 0;
        display: flex;
        white-space: nowrap;
        transition: all 0.5s ease;
    }
    
    /* Світла тема для бігучої доріжки */
    body.light-theme .marquee-container {
        background: rgba(255, 255, 255, 0.5);
        border-color: rgba(0, 0, 0, 0.1);
    }
    body.light-theme .marquee-content {
        color: rgba(0, 0, 0, 0.9);
    }

    .marquee-content {
        display: flex;
        font-family: var(--font-header);
        font-size: 16px;
        letter-spacing: 2px;
        color: rgba(255, 255, 255, 0.9);
        text-transform: uppercase;
        animation: marquee-left 25s linear infinite;
    }
    
    .marquee-content.reverse { animation: marquee-right 25s linear infinite; }
    .marquee-item { padding: 0 20px; }

    @keyframes marquee-left { 0% { transform: translateX(0); } 100% { transform: translateX(-50%); } }
    @keyframes marquee-right { 0% { transform: translateX(-50%); } 100% { transform: translateX(0); } }
    
    /* --- ФІЛЬТРИ ТОВАРІВ --- */
    .vendor-filters { 
        display: flex; flex-direction: column; align-items: center; gap: 15px; margin-bottom: 40px; z-index: 10; 
    }
    .filter-row { display: flex; gap: 12px; flex-wrap: wrap; justify-content: center; }
    
    .v-filter-btn {
        background: rgba(255, 255, 255, 0.05);
        border: 1px solid rgba(255, 255, 255, 0.15);
        color: rgba(255, 255, 255, 0.8);
        padding: 10px 24px;
        border-radius: 30px;
        font-family: var(--font-main);
        font-size: 14px;
        font-weight: 600;
        cursor: pointer;
        transition: all 0.3s ease;
    }
    .v-filter-btn:hover { background: rgba(255, 255, 255, 0.1); color: white; }
    .v-filter-btn.active {
        background: rgba(230, 0, 126, 0.1);
        border-color: #E6007E;
        color: white;
        box-shadow: 0 0 15px rgba(230, 0, 126, 0.4), inset 0 0 10px rgba(230, 0, 126, 0.2);
    }