
        .sales-app{ --dark:#0f172a; --dark-2:#111827; --primary:#667eea; --white:#ffffff; --transition:all .3s ease; --shadow-lg:0 15px 35px rgba(0,0,0,.35); }
        .sales-app,.sales-app *{
            margin: 0;
            padding: 0;
            box-sizing: border-box;
            font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
            -webkit-tap-highlight-color: transparent;
        }
        
        body.sales-page{
            background: linear-gradient(135deg, #0f172a 0%, #111827 45%, #020617 100%);
            color: #333;
            min-height: 100vh;
            padding: 20px;
        }
        
        body.sales-page .sales-app .store-container{
            max-width: 1200px;
            margin: 0 auto;
        }
        
        body.sales-page .sales-app .logo-container{
            margin-bottom: 30px;
            text-align: center;
            position: relative;
        }
        
        body.sales-page .sales-app .logo-container img{
            max-width: 250px;
            height: auto;
            animation: logoPulse 3s ease-in-out infinite;
            position: relative;
            z-index: 2;
        }
        
        @keyframes logoPulse{
            0%{ transform: scale(1); filter: brightness(1) drop-shadow(0 0 10px rgba(255, 255, 255, 0.3)); }
            50%{ transform: scale(1.05); filter: brightness(1.1) drop-shadow(0 0 20px rgba(255, 255, 255, 0.6)); }
            100%{ transform: scale(1); filter: brightness(1) drop-shadow(0 0 10px rgba(255, 255, 255, 0.3)); }
        }
        
        body.sales-page .sales-app .logo-glow{
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            width: 280px;
            height: 280px;
            border-radius: 50%;
            background: radial-gradient(circle, rgba(255, 255, 255, 0.4) 0%, rgba(255, 255, 255, 0) 70%);
            animation: glowPulse 4s ease-in-out infinite;
            z-index: 1;
            pointer-events: none;
        }
        
        @keyframes glowPulse{
            0%, 100%{ opacity: 0.3; transform: translate(-50%, -50%) scale(0.8); }
            50%{ opacity: 0.6; transform: translate(-50%, -50%) scale(1); }
        }
        
        /* HEADER MAIS ATRAENTE */
        body.sales-page .sales-app .header{
            background: rgba(255, 255, 255, 0.98);
            backdrop-filter: blur(15px);
            padding: 20px 25px;
            border-radius: 20px;
            margin-bottom: 30px;
            box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1), 0 2px 8px rgba(0, 0, 0, 0.05);
            display: flex;
            justify-content: space-between;
            align-items: center;
            flex-wrap: wrap;
            gap: 15px;
            border: 1px solid rgba(255, 255, 255, 0.2);
            position: relative;
            overflow: hidden;
        }

        body.sales-page .sales-app .header::before{
            content: "";
            position: absolute;
            top: 0;
            left: -100%;
            width: 100%;
            height: 100%;
            background: linear-gradient(90deg, transparent, rgba(255,255,255,0.4), transparent);
            transition: left 0.6s ease;
        }

        body.sales-page .sales-app .header:hover::before{
            left: 100%;
        }
        
        body.sales-page .sales-app .search-container{
            flex: 1;
            max-width: 400px;
            position: relative;
        }
        
        body.sales-page .sales-app .search-input{
            width: 100%;
            padding: 12px 20px;
            border: 2px solid #e0e0e0;
            border-radius: 25px;
            font-size: 1rem;
            transition: all 0.3s ease;
            background: rgba(255, 255, 255, 0.9);
        }
        
        body.sales-page .sales-app .search-input:focus{
            outline: none;
            border-color: #667eea;
            box-shadow: 0 0 20px rgba(102, 126, 234, 0.3);
            background: white;
        }
        
        body.sales-page .sales-app .carrinho-btn{
            background: linear-gradient(45deg, #FF6B6B, #FF8E53);
            color: white;
            border: none;
            padding: 12px 25px;
            border-radius: 25px;
            cursor: pointer;
            font-weight: bold;
            display: flex;
            align-items: center;
            gap: 8px;
            transition: all 0.3s ease;
            position: relative;
            overflow: hidden;
        }
        
        body.sales-page .sales-app .carrinho-btn::before{
            content: "";
            position: absolute;
            top: 0;
            left: -100%;
            width: 100%;
            height: 100%;
            background: linear-gradient(90deg, transparent, rgba(255,255,255,0.3), transparent);
            transition: left 0.5s;
        }
        
        body.sales-page .sales-app .carrinho-btn:hover::before{
            left: 100%;
        }
        
        body.sales-page .sales-app .carrinho-btn:hover{
            transform: translateY(-2px);
            box-shadow: 0 8px 20px rgba(255, 107, 107, 0.4);
        }
        
        body.sales-page .sales-app .carrinho-count{
            background: white;
            color: #FF6B6B;
            border-radius: 50%;
            width: 24px;
            height: 24px;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 0.8rem;
            font-weight: bold;
            animation: pulse 2s infinite;
        }
        
        body.sales-page .sales-app .categorias{
            display: flex;
            gap: 10px;
            margin-bottom: 30px;
            flex-wrap: wrap;
            justify-content: center;
        }
        
        body.sales-page .sales-app .categoria-btn{
            background: rgba(255, 255, 255, 0.9);
            border: none;
            padding: 12px 20px;
            border-radius: 20px;
            cursor: pointer;
            transition: all 0.3s ease;
            font-weight: 500;
            position: relative;
            overflow: hidden;
        }
        
        body.sales-page .sales-app .categoria-btn::before{
            content: "";
            position: absolute;
            top: 50%;
            left: 50%;
            width: 0;
            height: 0;
            background: rgba(102, 126, 234, 0.1);
            border-radius: 50%;
            transform: translate(-50%, -50%);
            transition: width 0.3s, height 0.3s;
        }
        
        body.sales-page .sales-app .categoria-btn:hover::before{
            width: 100px;
            height: 100px;
        }
        
        body.sales-page .sales-app .categoria-btn.active, body.sales-page .sales-app .categoria-btn:hover{
            background: #667eea;
            color: white;
            transform: translateY(-2px);
            box-shadow: 0 5px 15px rgba(102, 126, 234, 0.3);
        }
        
        /* ANIMAÇÕES DE ENTRADA */
        body.sales-page .sales-app .produtos-grid{
            display: grid;
            grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
            gap: 25px;
            margin-bottom: 40px;
        }
        
        body.sales-page .sales-app .produto-card{
            background: rgba(255, 255, 255, 0.95);
            border-radius: 15px;
            overflow: hidden;
            box-shadow: 0 8px 25px rgba(0, 0, 0, 0.1);
            transition: all 0.3s ease;
            display: flex;
            flex-direction: column;
            cursor: pointer;
            position: relative;
            animation: fadeInUp 0.6s ease-out;
            opacity: 0;
            transform: translateY(30px);
        }

        body.sales-page .sales-app .produto-card.visible{
            opacity: 1;
            transform: translateY(0);
        }
        
        @keyframes fadeInUp{
            from{
                opacity: 0;
                transform: translateY(30px);
            }
            to{
                opacity: 1;
                transform: translateY(0);
            }
        }
        
        /* EFEITOS VISUAIS MELHORADOS */
        body.sales-page .sales-app .produto-card::before{
            content: "";
            position: absolute;
            top: 0;
            left: -100%;
            width: 100%;
            height: 100%;
            background: linear-gradient(90deg, transparent, rgba(255,255,255,0.3), transparent);
            transition: left 0.5s;
            z-index: 1;
        }
        
        body.sales-page .sales-app .produto-card:hover::before{
            left: 100%;
        }
        
        body.sales-page .sales-app .produto-card:hover{
            transform: translateY(-8px) scale(1.02);
            box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15);
        }
        
        body.sales-page .sales-app .produto-badge{
            position: absolute;
            top: 10px;
            right: 10px;
            background: linear-gradient(45deg, #ff4444, #ff6b6b);
            color: white;
            padding: 6px 12px;
            border-radius: 15px;
            font-size: 0.8rem;
            font-weight: bold;
            z-index: 2;
            animation: pulse 2s infinite;
            box-shadow: 0 4px 12px rgba(255, 68, 68, 0.3);
        }
        
        @keyframes pulse{
            0%{ transform: scale(1); box-shadow: 0 4px 12px rgba(255, 68, 68, 0.3); }
            50%{ transform: scale(1.05); box-shadow: 0 6px 16px rgba(255, 68, 68, 0.5); }
            100%{ transform: scale(1); box-shadow: 0 4px 12px rgba(255, 68, 68, 0.3); }
        }
        
        body.sales-page .sales-app .produto-destaque{
            position: absolute;
            top: 10px;
            left: 10px;
            background: linear-gradient(45deg, #ffd700, #ffed4e);
            color: #333;
            padding: 6px 12px;
            border-radius: 15px;
            font-size: 0.7rem;
            font-weight: bold;
            z-index: 2;
            box-shadow: 0 4px 12px rgba(255, 215, 0, 0.3);
        }

        /* Indicador de vídeo no card do produto */
        body.sales-page .sales-app .produto-video-indicador{
            position: absolute;
            top: 10px;
            left: 50px;
            background: linear-gradient(45deg, #ff0000, #cc0000);
            color: white;
            padding: 4px 8px;
            border-radius: 12px;
            font-size: 0.7rem;
            font-weight: bold;
            z-index: 2;
            display: flex;
            align-items: center;
            gap: 4px;
            box-shadow: 0 2px 8px rgba(255, 0, 0, 0.3);
        }
        
        body.sales-page .sales-app .produto-imagem-container{
            width: 100%;
            height: 200px;
            position: relative;
            overflow: hidden;
            background: #f5f5f5;
            display: flex;
            align-items: center;
            justify-content: center;
        }
        
        /* LOADING STATES */
        body.sales-page .sales-app .produto-imagem{
            width: 100%;
            height: 100%;
            object-fit: cover;
            transition: transform 0.3s ease;
            background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
            background-size: 200% 100%;
        }
        
        body.sales-page .sales-app .produto-imagem.loading{
            animation: loading 1.5s infinite;
        }
        
        @keyframes loading{
            0%{ background-position: 200% 0; }
            100%{ background-position: -200% 0; }
        }
        
        body.sales-page .sales-app .produto-card:hover .produto-imagem{
            transform: scale(1.08);
        }
        
        body.sales-page .sales-app .produto-icone{
            font-size: 3rem;
            color: #667eea;
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
        }
        
        body.sales-page .sales-app .produto-info{
            padding: 20px;
            flex: 1;
            display: flex;
            flex-direction: column;
        }
        
        body.sales-page .sales-app .produto-nome{
            font-size: 1.2rem;
            font-weight: 600;
            margin-bottom: 10px;
            color: #333;
        }
        
        body.sales-page .sales-app .produto-descricao{
            color: #666;
            font-size: 0.9rem;
            margin-bottom: 15px;
            flex: 1;
            line-height: 1.4;
            display: -webkit-box;
            -webkit-line-clamp: 2;
            -webkit-box-orient: vertical;
            overflow: hidden;
        }
        
        body.sales-page .sales-app .produto-preco{
            font-size: 1.4rem;
            font-weight: bold;
            color: #FF6B6B;
            margin-bottom: 15px;
        }
        
        body.sales-page .sales-app .produto-preco-original{
            text-decoration: line-through;
            color: #999;
            font-size: 1rem;
            margin-right: 8px;
        }
        
        body.sales-page .sales-app .produto-desconto{
            background: #ff4444;
            color: white;
            padding: 4px 8px;
            border-radius: 12px;
            font-size: 0.8rem;
            font-weight: bold;
            margin-left: 8px;
        }
        
        body.sales-page .sales-app .add-carrinho-btn{
            background: linear-gradient(45deg, #4facfe, #00f2fe);
            color: white;
            border: none;
            padding: 12px;
            border-radius: 10px;
            cursor: pointer;
            font-weight: bold;
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 8px;
            transition: all 0.3s ease;
            position: relative;
            overflow: hidden;
        }
        
        body.sales-page .sales-app .add-carrinho-btn::before{
            content: "";
            position: absolute;
            top: 0;
            left: -100%;
            width: 100%;
            height: 100%;
            background: linear-gradient(90deg, transparent, rgba(255,255,255,0.3), transparent);
            transition: left 0.5s;
        }
        
        body.sales-page .sales-app .add-carrinho-btn:hover::before{
            left: 100%;
        }
        
        body.sales-page .sales-app .add-carrinho-btn:hover{
            background: linear-gradient(45deg, #3a9dfc, #00d9e6);
            transform: translateY(-2px);
            box-shadow: 0 5px 15px rgba(74, 172, 254, 0.4);
        }

        /* BOTÃO FAVORITOS */
        body.sales-page .sales-app .favorito-btn{
            position: absolute;
            top: 10px;
            right: 50px;
            background: rgba(255, 255, 255, 0.9);
            border: none;
            width: 36px;
            height: 36px;
            border-radius: 50%;
            cursor: pointer;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 1rem;
            color: #ccc;
            transition: all 0.3s ease;
            z-index: 2;
            backdrop-filter: blur(10px);
        }
        
        body.sales-page .sales-app .favorito-btn:hover{
            background: rgba(255, 255, 255, 1);
            transform: scale(1.1);
        }
        
        body.sales-page .sales-app .favorito-btn.ativo{
            color: #ff6b6b;
            animation: heartBeat 0.6s ease;
        }
        
        @keyframes heartBeat{
            0%{ transform: scale(1); }
            25%{ transform: scale(1.3); }
            50%{ transform: scale(1); }
            75%{ transform: scale(1.2); }
            100%{ transform: scale(1); }
        }
        
        body.sales-page .sales-app .modal{
            display: none;
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: rgba(0, 0, 0, 0.9);
            z-index: 1000;
            align-items: center;
            justify-content: center;
            padding: 10px;
            animation: fadeIn 0.3s ease;
        }
        
        @keyframes fadeIn{
            from{ opacity: 0; }
            to{ opacity: 1; }
        }
        
        body.sales-page .sales-app .modal-content{
            background: white;
            border-radius: 18px;
            max-width: 980px;
            width: min(94vw, 980px);
            max-height: 92dvh;
            overflow-y: auto;
            position: relative;
            animation: slideUp 0.4s ease;
            scroll-behavior: smooth;
            -webkit-overflow-scrolling: touch;
        }
        
        @keyframes slideUp{
            from{ 
                opacity: 0;
                transform: translateY(50px) scale(0.9);
            }
            to{ 
                opacity: 1;
                transform: translateY(0) scale(1);
            }
        }
        
        body.sales-page .sales-app .modal-detalhes{
            display: flex;
            flex-direction: column;
        }
        
        /* Container do vídeo no modal */
        body.sales-page .sales-app .video-container{
            position: relative;
            width: 100%;
            aspect-ratio: 16 / 9;
            max-height: 52vh;
            margin-bottom: 20px;
            border-radius: 14px;
            overflow: hidden;
            background: #000;
        }

        body.sales-page .sales-app .video-container iframe{
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: #000;
            border: none;
        }

        body.sales-page .sales-app .youtube-fallback-link{
            position: absolute;
            right: 12px;
            bottom: 12px;
            z-index: 2;
            background: rgba(255,255,255,.95);
            color: #cc0000;
            text-decoration: none;
            padding: 8px 12px;
            border-radius: 999px;
            font-weight: 700;
            font-size: .85rem;
            box-shadow: 0 4px 12px rgba(0,0,0,.18);
        }

        /* Alternador entre galeria e vídeo */
        body.sales-page .sales-app .modo-exibicao{
            display: flex;
            gap: 10px;
            margin-bottom: 15px;
            background: #f8f9fa;
            padding: 10px;
            border-radius: 8px;
        }

        body.sales-page .sales-app .modo-btn{
            background: #e9ecef;
            border: none;
            padding: 8px 15px;
            border-radius: 6px;
            cursor: pointer;
            font-weight: 500;
            transition: all 0.3s ease;
            display: flex;
            align-items: center;
            gap: 5px;
        }

        body.sales-page .sales-app .modo-btn.active{
            background: #667eea;
            color: white;
        }

        body.sales-page .sales-app .modo-btn:hover:not(.active){
            background: #dee2e6;
        }
        
        body.sales-page .sales-app .modal-galeria-container{
            position: relative;
            background: #f5f5f5;
            border-radius: 15px 15px 0 0;
        }
        
        body.sales-page .sales-app .modal-imagem-principal{
            width: 100%;
            height: clamp(240px, 46vh, 480px);
            object-fit: contain;
            background: #f5f5f5;
            cursor: zoom-in;
            transition: transform .2s ease;
        }
        body.sales-page .sales-app .modal-imagem-principal.zoomed{ transform: scale(1.35); cursor: zoom-out; }
        
        body.sales-page .sales-app .modal-navegacao{
            position: absolute;
            top: 50%;
            width: 100%;
            display: flex;
            justify-content: space-between;
            padding: 0 15px;
            transform: translateY(-50%);
        }
        
        body.sales-page .sales-app .nav-btn{
            background: rgba(255, 255, 255, 0.95);
            border: none;
            width: 44px;
            height: 44px;
            border-radius: 50%;
            cursor: pointer;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 1.1rem;
            color: #333;
            transition: all 0.3s ease;
            box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
            -webkit-tap-highlight-color: transparent;
        }
        
        body.sales-page .sales-app .nav-btn:hover{
            background: white;
            transform: scale(1.1);
        }
        
        body.sales-page .sales-app .modal-miniaturas-container{
            padding: 12px 15px;
            background: white;
            border-bottom: 1px solid #eee;
        }
        
        body.sales-page .sales-app .modal-miniaturas{
            display: flex;
            gap: 8px;
            overflow-x: auto;
            padding: 5px 0;
            scrollbar-width: thin;
            scrollbar-color: #667eea #f0f0f0;
        }
        
        body.sales-page .sales-app .modal-miniaturas::-webkit-scrollbar{
            height: 6px;
        }
        
        body.sales-page .sales-app .modal-miniaturas::-webkit-scrollbar-track{
            background: #f0f0f0;
            border-radius: 3px;
        }
        
        body.sales-page .sales-app .modal-miniaturas::-webkit-scrollbar-thumb{
            background: #667eea;
            border-radius: 3px;
        }
        
        body.sales-page .sales-app .miniatura{
            width: 70px;
            height: 70px;
            min-width: 70px;
            object-fit: cover;
            border-radius: 8px;
            cursor: pointer;
            border: 2px solid transparent;
            transition: all 0.3s ease;
            background: #f5f5f5;
        }
        
        body.sales-page .sales-app .miniatura.active, body.sales-page .sales-app .miniatura:hover{
            border-color: #667eea;
            transform: scale(1.05);
        }
        
        body.sales-page .sales-app .modal-info{
            padding: 25px;
            display: flex;
            flex-direction: column;
        }
        
        body.sales-page .sales-app .modal-categoria{
            background: #f0f4ff;
            color: #667eea;
            padding: 6px 12px;
            border-radius: 15px;
            font-size: 0.85rem;
            display: inline-block;
            margin-bottom: 15px;
            align-self: flex-start;
        }
        
        body.sales-page .sales-app .modal-nome{
            font-size: 1.6rem;
            font-weight: 700;
            margin-bottom: 12px;
            color: #333;
            line-height: 1.2;
        }
        
        body.sales-page .sales-app .modal-preco{
            font-size: 1.8rem;
            font-weight: bold;
            color: #FF6B6B;
            margin-bottom: 20px;
        }
        
        body.sales-page .sales-app .modal-preco-original{
            text-decoration: line-through;
            color: #999;
            font-size: 1.2rem;
            margin-right: 12px;
        }
        
        body.sales-page .sales-app .modal-desconto{
            background: #ff4444;
            color: white;
            padding: 6px 12px;
            border-radius: 15px;
            font-size: 1rem;
            font-weight: bold;
            margin-left: 12px;
        }
        
        body.sales-page .sales-app .modal-descricao{
            color: #555;
            line-height: 1.7;
            margin-bottom: 25px;
            font-size: 1.05rem;
            background: #f8f9fa;
            padding: 20px;
            border-radius: 10px;
            border-left: 4px solid #667eea;
            white-space: pre-line;
            word-wrap: break-word;
        }

        body.sales-page .sales-app .modal-acoes{
            display: flex;
            gap: 15px;
            margin-top: auto;
            flex-wrap: wrap;
        }
        
        body.sales-page .sales-app .modal-add-carrinho{
            background: linear-gradient(45deg, #4facfe, #00f2fe);
            color: white;
            border: none;
            padding: 15px 25px;
            border-radius: 10px;
            cursor: pointer;
            font-weight: bold;
            font-size: 1.1rem;
            display: flex;
            align-items: center;
            gap: 10px;
            transition: all 0.3s ease;
            flex: 1;
            min-width: 200px;
            justify-content: center;
            position: relative;
            overflow: hidden;
        }
        
        body.sales-page .sales-app .modal-add-carrinho::before{
            content: "";
            position: absolute;
            top: 0;
            left: -100%;
            width: 100%;
            height: 100%;
            background: linear-gradient(90deg, transparent, rgba(255,255,255,0.3), transparent);
            transition: left 0.5s;
        }
        
        body.sales-page .sales-app .modal-add-carrinho:hover::before{
            left: 100%;
        }
        
        body.sales-page .sales-app .modal-add-carrinho:hover{
            background: linear-gradient(45deg, #3a9dfc, #00d9e6);
            transform: translateY(-2px);
            box-shadow: 0 5px 15px rgba(74, 172, 254, 0.4);
        }
        
        body.sales-page .sales-app .modal-fechar{
            background: #666;
            color: white;
            border: none;
            padding: 15px 25px;
            border-radius: 10px;
            cursor: pointer;
            font-weight: bold;
            display: flex;
            align-items: center;
            gap: 8px;
            transition: all 0.3s ease;
            min-width: 120px;
            justify-content: center;
        }
        
        body.sales-page .sales-app .modal-fechar:hover{
            background: #555;
            transform: translateY(-2px);
        }
        
        body.sales-page .sales-app .close-modal{
            position: absolute;
            top: 15px;
            right: 15px;
            background: rgba(0, 0, 0, 0.7);
            color: white;
            border: none;
            width: 40px;
            height: 40px;
            border-radius: 50%;
            cursor: pointer;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 1.2rem;
            z-index: 10;
            transition: all 0.3s ease;
            -webkit-tap-highlight-color: transparent;
        }
        
        body.sales-page .sales-app .close-modal:hover{
            background: rgba(0, 0, 0, 0.9);
            transform: scale(1.1);
        }
        
        body.sales-page .sales-app .carrinho-item{
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding: 15px 0;
            border-bottom: 1px solid #eee;
        }
        
        body.sales-page .sales-app .carrinho-total{
            font-size: 1.3rem;
            font-weight: bold;
            text-align: right;
            margin: 20px 0;
            color: #FF6B6B;
        }
        
        body.sales-page .sales-app .finalizar-btn{
            background: linear-gradient(45deg, #00b09b, #96c93d);
            color: white;
            border: none;
            padding: 15px 30px;
            border-radius: 10px;
            cursor: pointer;
            font-weight: bold;
            width: 100%;
            font-size: 1.1rem;
            transition: all 0.3s ease;
            position: relative;
            overflow: hidden;
        }
        
        body.sales-page .sales-app .finalizar-btn::before{
            content: "";
            position: absolute;
            top: 0;
            left: -100%;
            width: 100%;
            height: 100%;
            background: linear-gradient(90deg, transparent, rgba(255,255,255,0.3), transparent);
            transition: left 0.5s;
        }
        
        body.sales-page .sales-app .finalizar-btn:hover::before{
            left: 100%;
        }
        
        body.sales-page .sales-app .finalizar-btn:hover{
            transform: translateY(-2px);
            box-shadow: 0 8px 20px rgba(0, 176, 155, 0.4);
        }
        
        body.sales-page .sales-app .quantidade-controller{
            display: flex;
            align-items: center;
            gap: 10px;
        }
        
        body.sales-page .sales-app .quantidade-btn{
            background: #667eea;
            color: white;
            border: none;
            width: 30px;
            height: 30px;
            border-radius: 50%;
            cursor: pointer;
            display: flex;
            align-items: center;
            justify-content: center;
            transition: all 0.3s ease;
        }
        
        body.sales-page .sales-app .quantidade-btn:hover{
            transform: scale(1.1);
            box-shadow: 0 2px 8px rgba(102, 126, 234, 0.3);
        }

        /* FEEDBACK VISUAL MELHORADO */
        body.sales-page .sales-app .notificacao{
            position: fixed;
            top: 20px;
            right: 20px;
            background: #4CAF50;
            color: white;
            padding: 15px 25px;
            border-radius: 10px;
            z-index: 1000;
            animation: slideInRight 0.3s ease, slideOutRight 0.3s ease 2.7s;
            box-shadow: 0 8px 25px rgba(76, 175, 80, 0.3);
            display: flex;
            align-items: center;
            gap: 10px;
        }
        
        @keyframes slideInRight{
            from{ transform: translateX(100%); opacity: 0; }
            to{ transform: translateX(0); opacity: 1; }
        }
        
        @keyframes slideOutRight{
            from{ transform: translateX(0); opacity: 1; }
            to{ transform: translateX(100%); opacity: 0; }
        }
        
        body.sales-page .sales-app .confetti{
            position: fixed;
            width: 10px;
            height: 10px;
            background: #ff6b6b;
            animation: confettiFall 1s ease-out forwards;
            z-index: 1001;
        }
        
        @keyframes confettiFall{
            0%{ transform: translateY(-100px) rotate(0deg); opacity: 1; }
            100%{ transform: translateY(100vh) rotate(360deg); opacity: 0; }
        }


        body.sales-page .sales-app .produto-selo{ position:absolute; bottom:10px; left:10px; background:linear-gradient(45deg,#00b09b,#96c93d); color:white; padding:6px 12px; border-radius:15px; font-size:.75rem; font-weight:800; z-index:2; box-shadow:0 4px 12px rgba(0,176,155,.3); }
        body.sales-page .sales-app .produto-selo.acessado{ background:linear-gradient(45deg,#667eea,#764ba2); }
        body.sales-page .sales-app .preco-economia{ display:block; color:#00a86b; font-size:.82rem; font-weight:700; margin-top:4px; }
        body.sales-page .sales-app .carrinho-actions{ display:flex; gap:10px; flex-wrap:wrap; margin-top:14px; }
        body.sales-page .sales-app .limpar-carrinho-btn{ background:linear-gradient(45deg,#666,#999); color:white; border:none; padding:12px 18px; border-radius:10px; cursor:pointer; font-weight:700; flex:1; }
        body.sales-page .sales-app .modal-content{ scroll-behavior:smooth; -webkit-overflow-scrolling:touch; }
        @media (max-width:768px){
            body.sales-page{padding-bottom:calc(96px + env(safe-area-inset-bottom));}
            body.sales-page .sales-app .header{display:grid;grid-template-columns:1fr;gap:12px;align-items:stretch;overflow:visible;}
            body.sales-page .sales-app .header::before{display:none;}
            body.sales-page .sales-app .search-container{width:100%;max-width:none;min-width:0;order:1;}
            body.sales-page .sales-app .search-input{width:100%;min-height:52px;border-radius:16px;font-size:16px;padding:14px 18px;}
            body.sales-page .sales-app .carrinho-btn{position:relative;order:2;width:100%;justify-content:center;min-height:52px;border-radius:16px;padding:14px 18px;z-index:2;box-shadow:0 8px 22px rgba(255,107,107,.28);}
            body.sales-page .sales-app .carrinho-count{position:static;flex:0 0 auto;}
            body.sales-page .sales-app .modal-content{overflow-y:auto;-webkit-overflow-scrolling:touch;}
            body.sales-page .sales-app .finalizar-btn, body.sales-page .sales-app .limpar-carrinho-btn, body.sales-page .sales-app .add-carrinho-btn{min-height:50px;font-size:1rem;}
            body.sales-page .sales-app .carrinho-actions{flex-direction:column;}
        }



        body.sales-page .sales-app .footer{
            background: #0f172a;
            color: #ffffff;
            padding: 3rem 0 1rem;
            margin: 36px -20px -20px;
            border-top: 1px solid rgba(255,255,255,.08);
        }
        body.sales-page .sales-app .footer .container{ max-width: 1200px; margin: 0 auto; padding: 0 20px; }
        body.sales-page .sales-app .footer-content{ text-align: center; margin-bottom: 2rem; }
        body.sales-page .sales-app .footer-logo{ font-size: 1.8rem; font-weight: bold; margin-bottom: 1rem; }
        body.sales-page .sales-app .footer-logo i{ color: #667eea; margin-right: .5rem; }
        body.sales-page .sales-app .footer p{ color: rgba(255,255,255,.8); max-width: 560px; margin: 0 auto 1.5rem; }
        body.sales-page .sales-app .social-links{ display:flex; justify-content:center; gap:1rem; }
        body.sales-page .sales-app .social-links a{ display:flex; align-items:center; justify-content:center; width:42px; height:42px; background:rgba(255,255,255,.1); color:#fff; border-radius:50%; text-decoration:none; transition:all .3s ease; }
        body.sales-page .sales-app .social-links a:hover{ background:#667eea; transform:translateY(-3px); }
        body.sales-page .sales-app .footer-bottom{ border-top:1px solid rgba(255,255,255,.1); padding-top:1.5rem; text-align:center; font-size:.85rem; color:rgba(255,255,255,.6); }
        body.sales-page .sales-app .whatsapp-float{ position:fixed; bottom:2rem; right:2rem; background:#25D366; color:white; width:60px; height:60px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:1.8rem; box-shadow:0 15px 35px rgba(0,0,0,.35); transition:all .3s ease; z-index:999; text-decoration:none; }
        body.sales-page .sales-app .whatsapp-float:hover{ transform:scale(1.1); background:#128C7E; }
        @media (max-width:768px){ body.sales-page .sales-app .footer{margin-left:-10px;margin-right:-10px;padding-bottom:calc(1.2rem + env(safe-area-inset-bottom));}body.sales-page .sales-app .whatsapp-float{width:54px;height:54px;right:14px;bottom:calc(82px + env(safe-area-inset-bottom));font-size:1.55rem;} }

        body.sales-page .sales-app .form-group{
            margin-bottom: 20px;
        }

        body.sales-page .sales-app .form-group label{
            display: block;
            margin-bottom: 8px;
            font-weight: 600;
            color: #333;
        }

        body.sales-page .sales-app .form-group input, body.sales-page .sales-app .form-group textarea{
            width: 100%;
            padding: 12px 15px;
            border: 2px solid #e0e0e0;
            border-radius: 8px;
            font-size: 1rem;
            transition: all 0.3s ease;
        }

        body.sales-page .sales-app .form-group input:focus, body.sales-page .sales-app .form-group textarea:focus{
            outline: none;
            border-color: #667eea;
            box-shadow: 0 0 10px rgba(102, 126, 234, 0.2);
        }

        body.sales-page .sales-app .resumo-pedido{
            background: #f8f9fa;
            padding: 15px;
            border-radius: 8px;
            margin: 15px 0;
            border-left: 4px solid #667eea;
        }

        body.sales-page .sales-app .resumo-item{
            display: flex;
            justify-content: space-between;
            margin-bottom: 8px;
            padding-bottom: 8px;
            border-bottom: 1px solid #e0e0e0;
        }

        body.sales-page .sales-app .resumo-item:last-child{
            border-bottom: none;
            margin-bottom: 0;
        }

        body.sales-page .sales-app .btn{
            background: linear-gradient(45deg, #667eea, #764ba2);
            color: white;
            border: none;
            padding: 12px 20px;
            border-radius: 8px;
            cursor: pointer;
            text-decoration: none;
            display: inline-flex;
            align-items: center;
            gap: 8px;
            font-weight: 500;
            transition: all 0.3s ease;
        }

        body.sales-page .sales-app .btn:hover{
            transform: translateY(-2px);
            box-shadow: 0 5px 15px rgba(102, 126, 234, 0.4);
        }

        body.sales-page .sales-app .btn-logout{
            background: linear-gradient(45deg, #666, #999);
        }
        
        @media (max-width: 768px){
            body.sales-page{ padding: 10px; }
            body.sales-page .sales-app .header{ 
                flex-direction: column; 
                padding: 15px;
                border-radius: 15px;
            }
            body.sales-page .sales-app .search-container{ max-width: none; width: 100%; }
            body.sales-page .sales-app .produtos-grid{ 
                grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); 
                gap: 15px; 
            }
            body.sales-page .sales-app .categorias{ 
                justify-content: flex-start; 
                overflow-x: auto; 
                padding-bottom: 10px; 
                margin-bottom: 20px; 
            }
            body.sales-page .sales-app .logo-container img{ max-width: 200px; }
            body.sales-page .sales-app .logo-glow{ width: 230px; height: 230px; }
            body.sales-page .sales-app .modal-content{ 
                max-width: 100%; 
                width: 100%; 
                max-height: 92dvh; 
                height: auto; 
                border-radius: 16px; 
            }
            body.sales-page .sales-app .modal-detalhes{ height: 100%; }
            body.sales-page .sales-app .modal-imagem-principal{ height: clamp(220px, 36vh, 360px); }
            body.sales-page .sales-app .miniatura{ width: 60px; height: 60px; min-width: 60px; }
            body.sales-page .sales-app .modal-info{ padding: 20px 15px; flex: 1; overflow-y: auto; }
            body.sales-page .sales-app .modal-nome{ font-size: 1.4rem; }
            body.sales-page .sales-app .modal-preco{ font-size: 1.6rem; }
            body.sales-page .sales-app .modal-descricao{ padding: 15px; font-size: 1rem; }
            body.sales-page .sales-app .modal-acoes{ flex-direction: column; gap: 10px; }
            body.sales-page .sales-app .modal-add-carrinho, body.sales-page .sales-app .modal-fechar{ min-width: 100%; padding: 12px 20px; }
            body.sales-page .sales-app .nav-btn{ width: 40px; height: 40px; font-size: 1rem; }
            body.sales-page .sales-app .favorito-btn{
                right: 45px;
                width: 32px;
                height: 32px;
            }
            body.sales-page .sales-app .produto-video-indicador{
                left: 45px;
                font-size: 0.6rem;
                padding: 3px 6px;
            }
        }
        
        @media (max-width: 480px){
            body.sales-page .sales-app .logo-container img{ max-width: 180px; }
            body.sales-page .sales-app .logo-glow{ width: 200px; height: 200px; }
            body.sales-page .sales-app .produtos-grid{ grid-template-columns: 1fr; }
            body.sales-page .sales-app .modal-imagem-principal{ height: clamp(210px, 34vh, 320px); }
            body.sales-page .sales-app .miniatura{ width: 55px; height: 55px; min-width: 55px; }
        }
    

/* PKaraokê V6 — integração visual da loja ao site principal */
body.sales-page{margin:0!important;padding:0!important;background:var(--soft)!important;color:var(--ink)!important;min-height:100vh}
.sales-app{--dark:#071b2d;--dark-2:#0d263b;--primary:#078fe5;--white:#fff;--transition:all .25s ease;--shadow-lg:0 18px 48px rgba(7,27,45,.17);display:block;background:linear-gradient(180deg,#f5f9fc 0%,#eef5f9 100%);color:var(--ink);min-height:70vh;padding:52px 0 86px}
.sales-app .store-container{width:min(1200px,calc(100% - 40px));max-width:none;margin:0 auto;padding:0}
.sales-intro{display:grid;grid-template-columns:1fr auto;align-items:end;gap:28px;margin:0 0 24px;padding:28px 30px;border:1px solid var(--line);border-radius:26px;background:linear-gradient(135deg,#fff,#f2f9fe);box-shadow:var(--shadow-soft)}
.sales-intro .eyebrow{margin-bottom:8px}.sales-intro h1{margin:0;font-size:clamp(2rem,4vw,3.55rem);line-height:1.02;letter-spacing:-.045em}.sales-intro p{max-width:720px;margin:12px 0 0;color:var(--muted)}.sales-intro-badge{display:grid;place-items:center;min-width:130px;min-height:92px;border-radius:22px;background:linear-gradient(135deg,var(--blue),#16abf8);color:#fff;text-align:center;box-shadow:0 16px 32px rgba(7,143,229,.23)}.sales-intro-badge strong{font-size:1.3rem}.sales-intro-badge small{font-weight:800;opacity:.85}
.sales-app .header{background:rgba(255,255,255,.96);border:1px solid var(--line);box-shadow:var(--shadow-soft);border-radius:22px;margin-bottom:22px;padding:18px 20px;overflow:visible}
.sales-app .search-input{background:#fff;color:var(--ink);border-color:#cddbe5}.sales-app .search-input:focus{border-color:var(--blue);box-shadow:0 0 0 4px rgba(7,143,229,.12)}
.sales-app .carrinho-btn{background:linear-gradient(135deg,var(--red),#f04455);box-shadow:0 10px 24px rgba(229,31,43,.22)}
.sales-app .categoria-btn{background:#fff;color:#304858;border:1px solid var(--line);box-shadow:0 7px 18px rgba(7,27,45,.06)}.sales-app .categoria-btn.active,.sales-app .categoria-btn:hover{background:linear-gradient(135deg,var(--blue),var(--blue-dark));color:#fff;border-color:transparent}
.sales-app .produto-card{background:#fff;color:var(--ink);border:1px solid var(--line);box-shadow:var(--shadow-soft);border-radius:24px}.sales-app .produto-card:hover{box-shadow:var(--shadow);transform:translateY(-5px)}
.sales-app .produto-imagem-container{background:linear-gradient(180deg,#fbfdfe,#edf4f8)}.sales-app .produto-imagem{object-fit:contain!important}.sales-app .produto-nome{color:var(--navy)}.sales-app .produto-descricao{color:var(--muted)}.sales-app .produto-preco{color:var(--red)}
.sales-app .add-carrinho-btn,.sales-app .modal-add-carrinho,.sales-app .finalizar-btn{background:linear-gradient(135deg,var(--blue),var(--blue-dark));box-shadow:0 10px 24px rgba(7,143,229,.22)}
.sales-app .modal{background:rgba(1,12,21,.78);backdrop-filter:blur(9px)}.sales-app .modal-content{background:#fff;color:var(--ink);border:1px solid var(--line);box-shadow:0 28px 78px rgba(0,0,0,.34)}.sales-app .modal-descricao,.sales-app .resumo-pedido,.sales-app .carrinho-item{background:#f4f8fb;color:var(--ink);border-color:var(--line)}.sales-app .form-group input,.sales-app .form-group textarea{background:#fff;color:var(--ink);border-color:#cbd9e3}
.sales-app .logo-container,.sales-app>.footer,.sales-app>.whatsapp-float{display:none!important}
html[data-theme="dark"] body.sales-page{background:#07131e!important;color:#e8f0f6!important}
html[data-theme="dark"] .sales-app{--white:#102433;background:linear-gradient(180deg,#07131e,#091a28);color:#e8f0f6}
html[data-theme="dark"] .sales-intro,html[data-theme="dark"] .sales-app .header,html[data-theme="dark"] .sales-app .produto-card,html[data-theme="dark"] .sales-app .modal-content{background:#102433;color:#e8f0f6;border-color:#294052}
html[data-theme="dark"] .sales-intro{background:linear-gradient(135deg,#102433,#0a1d2b)}html[data-theme="dark"] .sales-intro p,html[data-theme="dark"] .sales-app .produto-descricao{color:#9fb2c2}html[data-theme="dark"] .sales-app .search-input,html[data-theme="dark"] .sales-app .form-group input,html[data-theme="dark"] .sales-app .form-group textarea{background:#071b2a;color:#edf7fc;border-color:#355166}html[data-theme="dark"] .sales-app .categoria-btn{background:#102433;color:#d9e8f1;border-color:#294052}html[data-theme="dark"] .sales-app .produto-imagem-container{background:linear-gradient(180deg,#0d2434,#091825)}html[data-theme="dark"] .sales-app .produto-nome{color:#f4f9fc}html[data-theme="dark"] .sales-app .modal-descricao,html[data-theme="dark"] .sales-app .resumo-pedido,html[data-theme="dark"] .sales-app .carrinho-item{background:#0a1d2b;color:#e8f0f6;border-color:#294052}
@media(max-width:760px){.sales-app{padding:25px 0 62px}.sales-app .store-container{width:min(100% - 24px,1200px)}.sales-intro{grid-template-columns:1fr;padding:20px;border-radius:20px}.sales-intro-badge{display:none}.sales-intro h1{font-size:2rem}.sales-app .header{display:grid!important;grid-template-columns:1fr auto!important;gap:10px!important;padding:12px!important}.sales-app .search-container{width:100%;max-width:none}.sales-app .search-input{min-height:50px;font-size:16px}.sales-app .carrinho-btn{min-height:50px;padding:10px 14px}.sales-app .categorias{justify-content:flex-start;overflow:auto;flex-wrap:nowrap;scrollbar-width:none}.sales-app .categoria-btn{flex:0 0 auto}.sales-app .produtos-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.sales-app .produto-card{border-radius:18px}.sales-app .produto-info{padding:13px}.sales-app .produto-nome{font-size:.9rem}.sales-app .produto-descricao{font-size:.75rem;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.sales-app .produto-preco{font-size:1.02rem}.sales-app .add-carrinho-btn{padding:11px 7px;font-size:.78rem}.sales-app .produto-imagem-container{height:165px}.sales-app .modal-content{width:calc(100% - 16px);max-height:92dvh;border-radius:18px}}
@media(max-width:420px){.sales-app .produtos-grid{grid-template-columns:1fr}.sales-app .produto-imagem-container{height:220px}.sales-app .header{grid-template-columns:1fr}.sales-app .carrinho-btn{width:100%;justify-content:center}}


/* V8 — selo da Loja Oficial com destaque real */
.sales-intro-badge{display:flex!important;align-items:center!important;justify-content:flex-start!important;gap:15px!important;min-width:300px!important;min-height:122px!important;padding:20px 22px!important;border:1px solid rgba(255,255,255,.28)!important;border-radius:28px!important;background:linear-gradient(135deg,#057dc9 0%,#079be8 48%,#13b0f5 100%)!important;color:#fff!important;text-align:left!important;box-shadow:0 20px 46px rgba(7,143,229,.30)!important;position:relative;overflow:hidden}
.sales-intro-badge::after{content:"";position:absolute;width:140px;height:140px;right:-62px;top:-72px;border-radius:50%;background:rgba(255,255,255,.12)}
.sales-badge-icon{position:relative;z-index:1;display:grid;place-items:center;width:55px;height:55px;flex:0 0 55px;border-radius:18px;background:rgba(255,255,255,.18);box-shadow:inset 0 0 0 1px rgba(255,255,255,.18)}
.sales-badge-icon .icon{width:30px;height:30px}.sales-badge-copy{position:relative;z-index:1;display:grid;gap:2px}.sales-badge-copy small{font-size:.73rem!important;font-weight:900!important;letter-spacing:.09em;text-transform:uppercase;opacity:.9}.sales-badge-copy strong{font-size:1.55rem!important;line-height:1.05}.sales-badge-copy em{font-style:normal;font-size:.76rem;font-weight:750;opacity:.86}
html[data-theme="dark"] .sales-intro-badge{background:linear-gradient(135deg,#0c5f92,#087fb8 52%,#0a96d2)!important;border-color:rgba(137,215,255,.25)!important;box-shadow:0 20px 46px rgba(0,0,0,.28)!important}
@media(max-width:760px){.sales-intro-badge{display:flex!important;min-width:0!important;width:100%!important;min-height:94px!important;padding:15px 16px!important;border-radius:21px!important}.sales-badge-icon{width:46px;height:46px;flex-basis:46px;border-radius:15px}.sales-badge-copy strong{font-size:1.2rem!important}.sales-badge-copy em{font-size:.68rem}}
