////
///
/// Compatibility Overrides
/// ===========================================================================
///
/// Browser compatibility and legacy support overrides.
/// Should remain minimal.
///
/// @group Overrides
/// @author Scape Press
/// @link https://scape.style
/// @since 0.1.0 initial release
/// @access public
///
////

// ============================================================================
// Browser Compatibility
// ============================================================================

// Safari flexbox gap fallback
@use "../01-core/external" as *;

@layer ss.overrides {
    @supports not (gap: q(16)) {
        .ss-f-cluster > * {
            margin: calc(var(--ss-f-cluster-gap, var(--ss-spacing-4)) / 2);
        }
    
        .ss-f-cluster {
            margin: calc(var(--ss-f-cluster-gap, var(--ss-spacing-4)) / -2);
        }
    }
    
    // Aspect ratio fallback
    @supports not (aspect-ratio: 1 / 1) {
        .ss-f-frame {
            position: relative;
    
            &::before {
                content: "";
                display: block;
                padding-block-start: 56.25%; // 16:9 default
            }
    
            > * {
                position: absolute;
                inset: 0;
            }
        }
    }
    
    // ============================================================================
    // Print Compatibility
    // ============================================================================
    
    @media print {
        .ss-u-no-print {
            display: none !important;
        }
    
        .ss-u-print-only {
            display: block !important;
        }
    }
    
    // ============================================================================
    // Reduced Motion
    // ============================================================================
    
    @media (prefers-reduced-motion: reduce) {
        *,
        *::before,
        *::after {
            animation-duration: 0.01ms !important;
            animation-iteration-count: 1 !important;
            transition-duration: 0.01ms !important;
            scroll-behavior: auto !important;
        }
    }
}