Application Checkboxes Base Dark

<fieldset>
      <legend class="sr-only">Checkboxes</legend>

      <div class="flex flex-col items-start gap-3">
        <label for="Option1" class="inline-flex items-center gap-3">
          <input
            type="checkbox"
            class="size-5 rounded border-gray-300 shadow-sm dark:border-gray-600 dark:bg-gray-900 dark:ring-offset-gray-900 dark:checked:bg-blue-600"
            id="Option1"
          />

          <span class="font-medium text-gray-700 dark:text-gray-200"> Option 1 </span>
        </label>

        <label for="Option2" class="inline-flex items-center gap-3">
          <input
            type="checkbox"
            class="size-5 rounded border-gray-300 shadow-sm dark:border-gray-600 dark:bg-gray-900 dark:ring-offset-gray-900 dark:checked:bg-blue-600"
            id="Option2"
          />

          <span class="font-medium text-gray-700 dark:text-gray-200"> Option 2 </span>
        </label>

        <label for="Option3" class="inline-flex items-center gap-3">
          <input
            type="checkbox"
            class="size-5 rounded border-gray-300 shadow-sm dark:border-gray-600 dark:bg-gray-900 dark:ring-offset-gray-900 dark:checked:bg-blue-600"
            id="Option3"
          />

          <span class="font-medium text-gray-700 dark:text-gray-200"> Option 3 </span>
        </label>
      </div>
    </fieldset>