<?php $attributes ??= new \Illuminate\View\ComponentAttributeBag;

$__newAttributes = [];
$__propNames = \Illuminate\View\ComponentAttributeBag::extractPropNames(([
    'id',
    'note',
    // Responsive, sensible defaults; override via attribute if needed
    'contentMaxWidth' => 'max-w-lg sm:max-w-xl md:max-w-2xl',
    'bodyMaxHeight' => 'max-h-[70vh] md:max-h-[75vh]',
]));

foreach ($attributes->all() as $__key => $__value) {
    if (in_array($__key, $__propNames)) {
        $$__key = $$__key ?? $__value;
    } else {
        $__newAttributes[$__key] = $__value;
    }
}

$attributes = new \Illuminate\View\ComponentAttributeBag($__newAttributes);

unset($__propNames);
unset($__newAttributes);

foreach (array_filter(([
    'id',
    'note',
    // Responsive, sensible defaults; override via attribute if needed
    'contentMaxWidth' => 'max-w-lg sm:max-w-xl md:max-w-2xl',
    'bodyMaxHeight' => 'max-h-[70vh] md:max-h-[75vh]',
]), 'is_string', ARRAY_FILTER_USE_KEY) as $__key => $__value) {
    $$__key = $$__key ?? $__value;
}

$__defined_vars = get_defined_vars();

foreach ($attributes->all() as $__key => $__value) {
    if (array_key_exists($__key, $__defined_vars)) unset($$__key);
}

unset($__defined_vars, $__key, $__value); ?>

<?php if(filled($note)): ?>
	
	<button type="button" aria-label="Show note"
		class="group inline-flex h-8 items-center gap-2 rounded-md px-2 bg-gray-100 hover:bg-gray-200 text-gray-700 dark:bg-white/10 dark:text-gray-200 dark:hover:bg-white/20"
		data-hs-overlay="#note-modal-<?php echo e($id); ?>">
		<i class="ti ti-info-square text-[18px] opacity-80 group-hover:opacity-100"></i>
		<span class="hidden sm:inline">Note</span>
	</button>
	<style>
		.ti-modal-body p {
			overflow-wrap: anywhere;
			word-break: break-word;
		}
	</style>
	
	<div id="note-modal-<?php echo e($id); ?>" class="hs-overlay ti-modal hidden" tabindex="-1" aria-modal="true" role="dialog"
		aria-labelledby="note-modal-title-<?php echo e($id); ?>">
		<div class="hs-overlay-open:mt-7 ti-modal-box mt-0 ease-out min-h-[calc(100%-3.5rem)] flex items-center">
			
			<div class="ti-modal-content mx-auto w-full <?php echo e($contentMaxWidth); ?> flex flex-col">
				<div class="ti-modal-header shrink-0">
					<h3 id="note-modal-title-<?php echo e($id); ?>" class="ti-modal-title">NOTE</h3>
					<button type="button" class="hs-dropdown-toggle ti-modal-close-btn"
						data-hs-overlay="#note-modal-<?php echo e($id); ?>" aria-label="Close">
						<span class="sr-only">Close</span>
						<svg class="w-3.5 h-3.5" width="8" height="8" viewBox="0 0 8 8" fill="none"
							xmlns="http://www.w3.org/2000/svg">
							<path
								d="M0.258206 1.00652C0.351976 0.912791 0.479126 0.860131 0.611706 0.860131C0.744296 0.860131 0.871447 0.912791 0.965207 1.00652L3.61171 3.65302L6.25822 1.00652C6.30432 0.958771 6.35952 0.920671 6.42052 0.894471C6.48152 0.868271 6.54712 0.854471 6.61352 0.853901C6.67992 0.853321 6.74572 0.865971 6.80722 0.891111C6.86862 0.916251 6.92442 0.953381 6.97142 1.00032C7.01832 1.04727 7.05552 1.1031 7.08062 1.16454C7.10572 1.22599 7.11842 1.29183 7.11782 1.35822C7.11722 1.42461 7.10342 1.49022 7.07722 1.55122C7.05102 1.61222 7.01292 1.6674 6.96522 1.71352L4.31871 4.36002L6.96522 7.00648C7.05632 7.10078 7.10672 7.22708 7.10552 7.35818C7.10442 7.48928 7.05182 7.61468 6.95912 7.70738C6.86642 7.80018 6.74102 7.85268 6.60992 7.85388C6.47882 7.85498 6.35252 7.80458 6.25822 7.71348L3.61171 5.06702L0.965207 7.71348C0.870907 7.80458 0.744606 7.85498 0.613506 7.85388C0.482406 7.85268 0.357007 7.80018 0.264297 7.70738C0.171597 7.61468 0.119017 7.48928 0.117877 7.35818C0.116737 7.22708 0.167126 7.10078 0.258206 7.00648L2.90471 4.36002L0.258206 1.71352C0.164476 1.61976 0.111816 1.4926 0.111816 1.36002C0.111816 1.22744 0.164476 1.10028 0.258206 1.00652Z"
								fill="currentColor" />
						</svg>
					</button>
				</div>

				<div class="ti-modal-body overflow-y-auto <?php echo e($bodyMaxHeight); ?> min-w-0 break-words"
					style="white-space: normal !important; overflow-wrap: anywhere;">
					<p style="white-space: normal !important; overflow-wrap: anywhere; font-weight: 400">
						<?php echo e($note); ?>

					</p>
				</div>

				<div class="ti-modal-footer shrink-0">
					<button type="button"
						class="hs-dropdown-toggle ti-btn ti-border font-medium bg-white text-gray-700 shadow-sm align-middle hover:bg-gray-50 focus:ring-offset-white focus:ring-primary dark:bg-bgdark dark:hover:bg-black/20 dark:border-white/10 dark:text-white/70 dark:hover:text-white dark:focus:ring-offset-white/10"
						data-hs-overlay="#note-modal-<?php echo e($id); ?>">
						Close
					</button>
				</div>
			</div>
		</div>
	</div>
<?php endif; ?>
<?php /**PATH C:\laragon\www\policypilot\resources\views/components/note-modal.blade.php ENDPATH**/ ?>