<div components="popup confirm-dialog"
     @if($id ?? false) id="{{ $id }}" @endif
     refs="confirm-dialog@popup {{ $ref ?? false }}"
     class="popup-background">
    <div class="popup-body very-small" tabindex="-1">

        <div class="popup-header primary-background">
            <div class="popup-title">{{ $title }}</div>
            <button refs="popup@hide" type="button" class="popup-header-close">@icon('close')</button>
        </div>

        <div class="px-m py-m">
            {{ $slot }}

            <div class="text-right">
                <button type="button" class="button outline" refs="popup@hide">{{ trans('common.cancel') }}</button>
                <button type="button" class="button" refs="confirm-dialog@confirm">{{ trans('common.continue') }}</button>
            </div>
        </div>

    </div>
</div>