/* Logo Styles for New Just Workflow PNG Logo */

.logo-link {
    display: inline-flex;
    align-items: center;
    text-decoration: none;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    padding: 0;
    position: relative;
}

/* Removed hover box effect */

.logo-image {
    display: block;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    filter: drop-shadow(0 4px 8px rgba(150, 15, 201, 0.2))
            drop-shadow(0 0 12px rgba(238, 137, 104, 0.1));
}

.logo-link:hover .logo-image {
    transform: translateY(-2px) scale(1.05);
    filter: drop-shadow(0 8px 16px rgba(150, 15, 201, 0.35))
            drop-shadow(0 0 20px rgba(238, 137, 104, 0.25));
}

/* Header specific styles */
header .logo-link {
    padding: 0;
}

header .logo-image {
    height: 60px;
    width: auto;
}

/* Footer specific styles */
footer .logo-link {
    margin-bottom: 1rem;
}

footer .logo-image {
    height: 50px;
    width: auto;
}

/* Theme-specific adjustments */

/* Dark Theme - Keep current filter effects */
:root[data-theme="dark"] .logo-image {
    filter: drop-shadow(0 4px 8px rgba(150, 15, 201, 0.25))
            drop-shadow(0 0 12px rgba(238, 137, 104, 0.15));
}

:root[data-theme="dark"] .logo-link:hover .logo-image {
    filter: drop-shadow(0 8px 16px rgba(150, 15, 201, 0.4))
            drop-shadow(0 0 24px rgba(238, 137, 104, 0.3));
}

/* Blue Theme - Match logo colors (orange to purple gradient) */
:root[data-theme="blue"] .logo-image {
    filter: drop-shadow(0 4px 8px rgba(150, 15, 201, 0.3))
            drop-shadow(0 0 12px rgba(238, 137, 104, 0.15));
}

:root[data-theme="blue"] .logo-link:hover .logo-image {
    filter: drop-shadow(0 8px 16px rgba(150, 15, 201, 0.45))
            drop-shadow(0 0 24px rgba(238, 137, 104, 0.35));
}

/* Mobile responsive - More prominent logo sizes */
@media (max-width: 768px) {
    header .logo-image {
        height: 48px;
    }

    footer .logo-image {
        height: 45px;
    }
}

@media (max-width: 480px) {
    header .logo-image {
        height: 42px; /* Increased from 28px for better visibility */
    }

    footer .logo-image {
        height: 40px;
    }
}

/* Accessibility - Reduce motion */
@media (prefers-reduced-motion: reduce) {
    .logo-image {
        transition-duration: 0.1s;
    }

    .logo-link:hover .logo-image {
        transform: none;
    }
}

/* Print styles */
@media print {
    .logo-image {
        filter: none !important;
    }
}

/* Focus states for accessibility */
.logo-link:focus-visible {
    outline: 2px solid var(--primary, #960FC9);
    outline-offset: 4px;
    border-radius: 12px;
}

/* Loading optimization */
.logo-image {
    image-rendering: -webkit-optimize-contrast;
    image-rendering: crisp-edges;
}
