@props([
    'image' => null,
    'rotate' => '45deg', 
    'spacing' => '150px',
    'size' => '120px',
    'opacity' => '0.07'
])

@if($image)
<div {{ $attributes->merge(['class' => 'watermark-overlay']) }}>
    <style>
        .watermark-overlay {
            position: absolute;
            inset: 0;
            pointer-events: none;
            background-image: url('{{ $image }}');
            background-repeat: space;
            background-size: {{ $size }};
            opacity: {{ $opacity }};
            mix-blend-mode: normal;
            transform: rotate({{ $rotate }});
            background-position: center;
            background-position-y: calc(50% - {{ $spacing }});
            background-position-x: calc(50% - {{ $spacing }});
        }
    </style>
</div>
@endif