{{-- Opens the month's individual payments under the row. --}}
<button type="button" class="inline-flex items-center gap-1.5 rounded-lg bg-white px-3 py-1.5 text-xs font-semibold text-slate-700 shadow-sm ring-1 ring-inset ring-slate-300 transition duration-150 ease-in-out hover:bg-slate-50 focus:outline-none focus:ring-2 focus:ring-brand-500" data-details-toggle aria-expanded="false">
    <span data-details-label-closed>{{ __('Open') }}</span>
    <span data-details-label-open hidden>{{ __('Close') }}</span>
    <svg class="h-3.5 w-3.5 transition-transform duration-150" data-details-chevron fill="none" viewBox="0 0 24 24" stroke-width="2.5" stroke="currentColor" aria-hidden="true">
        <path stroke-linecap="round" stroke-linejoin="round" d="M19.5 8.25l-7.5 7.5-7.5-7.5" />
    </svg>
</button>