/* =============================================================================
   WORKFLOW LOGO OVERLAY
   Branding overlay for dashboards with workflow-specific logos
   ============================================================================= */

.workflow-logo-overlay {
    /* Positioning handled by parent div - this handles visual styling */
    opacity: 0.6;
    transition: opacity 0.3s ease, filter 0.3s ease;

    /* Prevent logo from interfering with dashboard interactions */
    pointer-events: none;
    user-select: none;

    /* Ensure proper image rendering */
    image-rendering: -webkit-optimize-contrast;
    image-rendering: crisp-edges;
}

.workflow-logo-overlay:hover {
    opacity: 0.9;
}

/* Theme-aware adjustments */
[data-mantine-color-scheme="dark"] .workflow-logo-overlay {
    /* Slightly increase brightness for dark theme visibility */
    filter: brightness(1.1);
    opacity: 0.5;
}

[data-mantine-color-scheme="dark"] .workflow-logo-overlay:hover {
    opacity: 0.8;
}

/* Responsive sizing for smaller screens */
@media (max-width: 768px) {
    .workflow-logo-overlay {
        max-width: 150px !important;
        max-height: 60px !important;
    }
}

@media (max-width: 480px) {
    .workflow-logo-overlay {
        max-width: 120px !important;
        max-height: 50px !important;
        opacity: 0.4;
    }
}