/* ========================================
   LOGO SHADOW EFFECTS - E-NOGUEIRA
   Aplicação de sombras elegantes nos logos
   
   IMPLEMENTADO EM:
   ✅ Layout principal do site (site-tailwind.blade.php)
   ✅ Layout de autenticação (auth.blade.php)  
   ✅ Layout base dashboards (base.blade.php)
   ✅ Layout Bootstrap (app.blade.php)
   ✅ Header dashboards (dashboard/header.blade.php)
   
   LOCAIS ONDE LOGO APARECE:
   📍 Header navegação - get_logo() h-10 w-auto
   📍 Footer - get_logo_white() h-12 logo-transparent
   📍 Login/Auth - get_logo() h-12 w-auto
   📍 Dashboard header - get_logo() h-8 w-auto
   📍 Componentes header - get_logo() h-10 w-auto
   ======================================== */

/* Seletor universal para todos os logos */
img[src*="site_logo"],
img[src*="site_logo_white"],
img[alt*="E-Nogueira"],
img[src*="logo"],
.navbar-brand img,
.footer-logo img,
.logo-transparent,
a[href*="/"] > img[alt*="E-Nogueira"],
a[href*="/"] > img[src*="logo"] {
    /* Otimização de renderização para nitidez máxima */
    image-rendering: -webkit-optimize-contrast;
    image-rendering: crisp-edges;
    /* Sombra elegante e suave */
    filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.1)) 
            drop-shadow(0 1px 2px rgba(0, 0, 0, 0.06));
    
    /* Transição suave para interações */
    transition: filter 0.3s ease, transform 0.3s ease;
    
    /* Garantir qualidade da imagem */
    image-rendering: auto;
    -webkit-font-smoothing: antialiased;
}

/* Efeito hover para logos clicáveis */
a:hover img[src*="site_logo"],
a:hover img[src*="site_logo_white"],
a:hover img[alt*="E-Nogueira"],
a:hover img[src*="logo"],
.navbar-brand:hover img {
    /* Sombra mais intensa no hover */
    filter: drop-shadow(0 4px 8px rgba(0, 0, 0, 0.15)) 
            drop-shadow(0 2px 4px rgba(0, 0, 0, 0.1));
    
    /* Leve elevação visual */
    transform: translateY(-1px);
}

/* Específico para logos no header/navbar */
nav img[src*="site_logo"],
nav img[alt*="E-Nogueira"],
.navbar-brand img,
header img[src*="logo"] {
    /* Sombra mais sutil para header */
    filter: drop-shadow(0 1px 3px rgba(0, 0, 0, 0.12)) 
            drop-shadow(0 1px 2px rgba(0, 0, 0, 0.08));
}

/* Específico para logos no footer (fundo escuro) */
footer img[src*="site_logo_white"],
footer img.logo-transparent,
footer .footer-logo img {
    /* Sombra mais visível para logos brancos */
    filter: drop-shadow(0 2px 6px rgba(0, 0, 0, 0.3)) 
            drop-shadow(0 1px 3px rgba(0, 0, 0, 0.2));
    
    /* Garantir que a sombra não interfira na transparência */
    background: transparent !important;
    mix-blend-mode: normal !important;
}

/* Específico para logos de autenticação (login, register) */
.auth-container img[src*="site_logo"],
.login-container img[src*="logo"],
.auth-logo img {
    /* Sombra média para destaque */
    filter: drop-shadow(0 3px 6px rgba(0, 0, 0, 0.16)) 
            drop-shadow(0 1px 3px rgba(0, 0, 0, 0.1));
}

/* Sombras responsivas - ajuste para diferentes tamanhos */
@media (max-width: 768px) {
    /* Sombras mais suaves em mobile */
    img[src*="site_logo"],
    img[src*="site_logo_white"],
    img[alt*="E-Nogueira"],
    img[src*="logo"] {
        filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.1)) 
                drop-shadow(0 1px 1px rgba(0, 0, 0, 0.06));
    }
    
    /* Hover mais sutil em mobile */
    a:hover img[src*="site_logo"],
    a:hover img[src*="site_logo_white"],
    a:hover img[alt*="E-Nogueira"] {
        filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.12)) 
                drop-shadow(0 1px 2px rgba(0, 0, 0, 0.08));
        transform: translateY(0); /* Remove elevação em mobile */
    }
}

/* Dark mode adjustments */
@media (prefers-color-scheme: dark) {
    /* Logos em modo escuro - sombras mais sutis */
    img[src*="site_logo"]:not([src*="site_logo_white"]) {
        filter: drop-shadow(0 2px 4px rgba(255, 255, 255, 0.1)) 
                drop-shadow(0 1px 2px rgba(255, 255, 255, 0.06));
    }
}

/* Compatibilidade com tema dark do Tailwind */
.dark img[src*="site_logo"]:not([src*="site_logo_white"]) {
    filter: drop-shadow(0 2px 4px rgba(255, 255, 255, 0.1)) 
            drop-shadow(0 1px 2px rgba(255, 255, 255, 0.06));
}

/* Fallback para navegadores mais antigos */
@supports not (filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.1))) {
    img[src*="site_logo"],
    img[src*="site_logo_white"],
    img[alt*="E-Nogueira"],
    img[src*="logo"] {
        /* Box shadow como fallback */
        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    }
    
    a:hover img[src*="site_logo"],
    a:hover img[alt*="E-Nogueira"] {
        box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
        transform: translateY(-1px);
    }
}

/* Performance optimization */
img[src*="site_logo"],
img[src*="site_logo_white"],
img[alt*="E-Nogueira"],
img[src*="logo"] {
    /* GPU acceleration para transições suaves */
    will-change: filter, transform;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
}

/* Evitar sombras em logos muito pequenos (favicons, etc) */
img[src*="site_logo"][width="16"],
img[src*="site_logo"][height="16"],
img[src*="favicon"] {
    filter: none !important;
}

/* Classe utilitária para desabilitar sombra quando necessário */
.no-logo-shadow,
.no-logo-shadow img {
    filter: none !important;
    box-shadow: none !important;
}

/* Classe utilitária para sombra extra */
.logo-shadow-extra img {
    filter: drop-shadow(0 4px 12px rgba(0, 0, 0, 0.2)) 
            drop-shadow(0 2px 6px rgba(0, 0, 0, 0.12)) !important;
}

/* Específico para componentes Blade com get_logo() */
img[src*="/storage/settings/"],
img[src*="/storage/logos/"],
.site-logo,
.dashboard-logo {
    filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.1)) 
            drop-shadow(0 1px 2px rgba(0, 0, 0, 0.06));
    transition: filter 0.3s ease, transform 0.3s ease;
}

/* Melhoria para logos pequenos em mobile */
@media (max-width: 480px) {
    img[src*="site_logo"],
    img[src*="site_logo_white"] {
        filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.08)) 
                drop-shadow(0 0.5px 1px rgba(0, 0, 0, 0.04));
    }
}

/* Compatibilidade com imagens SVG inline */
svg[class*="logo"],
.logo svg {
    filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.1))
            drop-shadow(0 1px 2px rgba(0, 0, 0, 0.06));
    transition: filter 0.3s ease;
}

/* ========================================
   OTIMIZAÇÃO DE NITIDEZ PARA IMAGENS
   Aplica renderização de alta qualidade para
   evitar embaçamento em redimensionamentos
   ======================================== */

/* Logos e ícones pequenos - nitidez máxima */
.h-8.w-auto, .h-10.w-auto, .h-12.w-auto,
img.h-8, img.h-10, img.h-12 {
    image-rendering: -webkit-optimize-contrast;
    image-rendering: crisp-edges;
}

/* Imagens de capa/header - qualidade preservada */
img[src*="hero_image"],
img[src*="shop_header_image"],
img[src*="product_header_image"],
img[src*="services_header_image"],
img[src*="solar_header_image"],
img[src*="electrical_header_image"],
img[src*="climate_header_image"],
img[src*="security_header_image"],
img[src*="about_image"] {
    image-rendering: -webkit-optimize-contrast;
}

/* Favicon e ícones muito pequenos */
img.h-8.w-8, img.w-8.h-8 {
    image-rendering: -webkit-optimize-contrast;
    image-rendering: pixelated;
}